Skip to content
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
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -137,7 +137,7 @@ npm run test:less:update -w packages/stacks-classic

[![ci status][gh-action-badge]][gh-action-url] [![npm version][npm-badge-svelte]][npm-url-svelte]

This workspace contains a Svelte implementation of the Stacks Classic design system. Unlike the Stacks-Classic workspace which has its documentation defined in the separate Stacks-Docs workspace, this one defines its documentation site directly within its own workspace which can be reached via https://svelte.stackoverflow.design
This workspace contains a Svelte implementation of the Stacks Classic design system. Unlike the Stacks-Classic workspace which has its documentation defined in the separate Stacks-Docs workspace, this one defines its documentation site directly within its own workspace which can be reached via https://v2.svelte.stackoverflow.design

We use [storybook](https://storybook.js.org/) for local development. To start the storybook server run:

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ This package is an implementation of the [Stacks Design System](https://stackove
Stacks Svelte can be installed via npm:

```
npm install @stackoverflow/stacks-svelte
npm install @stackoverflow/stacks-svelte@legacy-v2 @stackoverflow/stacks@legacy-v2
```

`@stackoverflow/stacks-svelte` relies on `@stackoverflow/stacks` styles.
Expand Down Expand Up @@ -54,7 +54,7 @@ We also have a selection of [Svelte Actions](https://svelte.dev/docs/svelte-acti

## Documentation

You can consult the full catalog of component available together with their respective documentation and an interactive playground at [svelte.stackoverflow.design](https://svelte.stackoverflow.design).
You can consult the full catalog of components together with their respective documentation and an interactive playground at [v2.svelte.stackoverflow.design](https://v2.svelte.stackoverflow.design).

## Contributing

Expand Down
8 changes: 6 additions & 2 deletions packages/stacks-svelte/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,18 @@

This package is an implementation of the [Stacks Design System](https://stackoverflow.design/), using Svelte Components.

[Documentation](https://svelte.stackoverflow.design)
[Documentation](https://v2.svelte.stackoverflow.design)

This branch contains the maintained V2 release. Its documentation is built
from `v2` and hosted separately from the current release at
`v2.svelte.stackoverflow.design`.

## Installation

Stacks Svelte can be installed via npm:

```
npm install @stackoverflow/stacks-svelte
npm install @stackoverflow/stacks-svelte@legacy-v2 @stackoverflow/stacks@legacy-v2
```

`@stackoverflow/stacks-svelte` relies on `@stackoverflow/stacks` styles.
Expand Down
14 changes: 8 additions & 6 deletions packages/stacks-svelte/tools/storybook-llms-extractor.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,22 +21,24 @@ import process from "node:process";
const __dirname = dirname(fileURLToPath(import.meta.url));

function getCurrentBranch() {
return execSync("git branch --show-current", { encoding: "utf-8" }).trim();
return (
process.env.BRANCH ??
execSync("git branch --show-current", { encoding: "utf-8" }).trim()
);
}

const currentBranch = getCurrentBranch();
const isBeta = currentBranch === "beta";

const CONFIG = {
distPath: "../netlify/dist",
summaryBaseUrl: isBeta
? "https://beta.svelte.stackoverflow.design"
: "https://svelte.stackoverflow.design",
summaryBaseUrl: "https://v2.svelte.stackoverflow.design",
summaryTitle: "Stacks Svelte",
summaryDescription: "Stacks Svelte Components Documentation",
};
const { distPath, summaryBaseUrl, summaryTitle, summaryDescription } = CONFIG;

export { summaryBaseUrl };

export function parseStorybookIndex(distPath) {
const content = readFileSync(join(distPath, "index.json"), "utf-8");
return JSON.parse(content);
Expand Down Expand Up @@ -369,7 +371,7 @@ function findSubcomponents(componentPath) {
}));
}

function generateDocs(groups) {
export function generateDocs(groups) {
let md = `# ${summaryTitle}\n\n${summaryDescription}\n\n`;
md += `> Generated Storybook documentation optimized for LLM consumption.\n\n---\n\n## Table of Contents\n\n`;

Expand Down
28 changes: 28 additions & 0 deletions packages/stacks-svelte/tools/storybook-llms-extractor.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,38 @@ import {
extractPropsFromInterface,
extractPropsFromExports,
extractStoryExamples,
generateDocs,
parseArgsTable,
summaryBaseUrl,
} from "./storybook-llms-extractor.js";

describe("Storybook LLM Extractor", () => {
test("uses the V2 documentation hostname", () => {
assert.strictEqual(
summaryBaseUrl,
"https://v2.svelte.stackoverflow.design"
);
});

test("generates V2 documentation and story links", () => {
const result = generateDocs([
{
title: "Components/Button",
docs: { id: "components-button--docs" },
stories: [{ id: "components-button--base", name: "Base" }],
},
]);

assert.match(
result,
/https:\/\/v2\.svelte\.stackoverflow\.design\/\?path=\/docs\/components-button--docs/
);
assert.match(
result,
/https:\/\/v2\.svelte\.stackoverflow\.design\/\?path=\/story\/components-button--base/
);
});

describe("cleanJSDoc", () => {
test("should remove JSDoc asterisks and trim whitespace", () => {
const input = `
Expand Down
Loading