diff --git a/docs/src/content.config.ts b/docs/src/content.config.ts index 53b74ea..cb8964d 100644 --- a/docs/src/content.config.ts +++ b/docs/src/content.config.ts @@ -8,6 +8,8 @@ const guides = defineCollection({ title: z.string(), sort: z.number(), description: z.string().optional(), + // Keep the page routable but omit it from the sidebar listing. + hidden: z.boolean().optional(), }), }); diff --git a/docs/src/content/guides/changelog.mdx b/docs/src/content/guides/changelog.mdx new file mode 100644 index 0000000..cd8ae43 --- /dev/null +++ b/docs/src/content/guides/changelog.mdx @@ -0,0 +1,77 @@ +--- +title: "Changelog" +description: "Track what's new in Driver.js. See the latest features, changes, and fixes shipping in each release, plus what's currently in the works." +groupTitle: "Introduction" +sort: 7 +--- + +The _Unreleased_ section lists changes that are merged and will ship in the next +release. Once a release is published, these entries move under a versioned +heading. + +## Unreleased + +### Added + +- `animationDuration` config to control how long the highlight transition takes. + ([#104](https://github.com/nilbuild/driver.js/issues/104)) +- `allowScroll` config to lock body scroll while a tour is active. +- `onDoneClick` hook, fired when the done button on the final step is clicked. + ([#500](https://github.com/nilbuild/driver.js/issues/500)) + +### Changed + +- Breaking Popover footer buttons are now styled + through the `driver-popover-footer-btn` class instead of the + `.driver-popover-footer button` selector. Buttons you add through `onPopoverRender` + no longer inherit the default styling automatically. Add the + `driver-popover-footer-btn` class to opt in, or leave it off to apply your own + styles. The built-in next/previous buttons carry the class out of the box. + ([#555](https://github.com/nilbuild/driver.js/issues/555)) +- Custom buttons added through `onPopoverRender` now receive their own click + events. Only the built-in next, previous, and close buttons have their default + action intercepted by the library. +- The popover exposes `driver-popover-side-*` and `driver-popover-align-*` + classes so you can target its position from CSS, and the arrow positioning was + rewritten for more accurate placement. +- Dropped the CSS `:has()` selector for broader browser compatibility. + ([#586](https://github.com/nilbuild/driver.js/issues/586)) + +### Fixed + +- Document event listener leak in `onDriverClick` that left handlers attached + after the tour was destroyed. + ([#452](https://github.com/nilbuild/driver.js/issues/452)) + +## 1.5.0 + +### Added + +- `getNextStep` method on the driver API. + ([#420](https://github.com/nilbuild/driver.js/issues/420)) +- `driver-popover-done-btn` class on the next button when it acts as the done + button on the final step. ([#610](https://github.com/nilbuild/driver.js/issues/610)) + +### Changed + +- The `onDestroyed` hook now receives the final tour state. + ([#553](https://github.com/nilbuild/driver.js/issues/553)) +- Removed the unicode characters from the default button labels. + +### Fixed + +- The tour no longer closes when pressing the left arrow on the first step. + ([#564](https://github.com/nilbuild/driver.js/issues/564)) +- Removed the button text-shadow that left ghost text behind. + ([#605](https://github.com/nilbuild/driver.js/issues/605)) +- `onNextClick` now fires when advancing the tour through an overlay click. + ([#576](https://github.com/nilbuild/driver.js/issues/576)) + +For the release notes of other versions, see the +[GitHub releases](https://github.com/nilbuild/driver.js/releases) page. + +## Migrating from 0.x to 1.x + +Driver.js 1.x is a major release with a new API and architecture. See the +[Migrate to 1.x](/docs/migrating-from-0x) guide for a step-by-step walkthrough +of the import, configuration, and API changes. diff --git a/docs/src/content/guides/migrating-from-0x.mdx b/docs/src/content/guides/migrating-from-0x.mdx index e73d6b2..3e7a700 100644 --- a/docs/src/content/guides/migrating-from-0x.mdx +++ b/docs/src/content/guides/migrating-from-0x.mdx @@ -3,6 +3,7 @@ title: "Migrate to 1.x" description: "Upgrade from Driver.js 0.x to 1.x with this step-by-step migration guide covering the new API, imports, and architecture changes in the 1.0 rewrite." groupTitle: "Introduction" sort: 6 +hidden: true --- Drivers 1.x is a major release that introduces a new API and a new architecture. This page will help you migrate your code from 0.x to 1.x. diff --git a/docs/src/layouts/DocsLayout.astro b/docs/src/layouts/DocsLayout.astro index 4d37580..71f9507 100644 --- a/docs/src/layouts/DocsLayout.astro +++ b/docs/src/layouts/DocsLayout.astro @@ -30,7 +30,10 @@ const metaDescription =
+ class:list={[ + "min-w-0 max-w-[800px] py-6 md:py-12 prose px-6 md:px-14 prose-base md:proxe-xl mb-24 prose-blockquote:font-normal prose-blockquote:not-italic prose-blockquote:text-gray-500 prose-p:before:content-['']", + { "changelog-page": guide.id === "changelog" }, + ]}>
diff --git a/docs/src/lib/guide.ts b/docs/src/lib/guide.ts index 3fb77b0..a0df83b 100644 --- a/docs/src/lib/guide.ts +++ b/docs/src/lib/guide.ts @@ -2,7 +2,8 @@ import { type CollectionEntry, getCollection } from "astro:content"; export async function getAllGuides(): Promise[]>> { const allGuides: CollectionEntry<"guides">[] = await getCollection("guides"); - const sortedGuides = allGuides.sort((a, b) => a.data.sort - b.data.sort); + const visibleGuides = allGuides.filter(guide => !guide.data.hidden); + const sortedGuides = visibleGuides.sort((a, b) => a.data.sort - b.data.sort); return sortedGuides.reduce((acc: Record[]>, curr: CollectionEntry<"guides">) => { const { groupTitle } = curr.data; diff --git a/docs/src/styles/tailwind.css b/docs/src/styles/tailwind.css index e458b9f..55cc479 100644 --- a/docs/src/styles/tailwind.css +++ b/docs/src/styles/tailwind.css @@ -3,3 +3,43 @@ /* Recreates the custom `sh` screen from the old tailwind.config.cjs. */ @custom-variant sh (@media (min-height: 750px)); + +/* Inline code — render as a soft pill instead of backtick-quoted bold text. */ +.prose :not(pre) > code { + background-color: #f4f4f5; + border: 1px solid #e4e4e7; + border-radius: 0.375rem; + padding: 0.125em 0.375em; + font-weight: 500; + font-size: 0.875em; + color: #27272a; + /* Keep an identifier on one line — move the whole token to the next line + rather than slicing the pill across a line break. */ + white-space: nowrap; +} + +.prose :not(pre) > code::before, +.prose :not(pre) > code::after { + content: none; +} + +/* Changelog — underline each version/section heading to separate releases. */ +.changelog-page :where(h2) { + border-bottom: 1px solid #e4e4e7; + padding-bottom: 0.3em; +} + +/* Inline badge that flags a breaking change in the changelog. */ +.breaking-badge { + display: inline-block; + background-color: #dc2626; + color: #ffffff; + border-radius: 0.375rem; + padding: 0.05em 0.5em; + margin-right: 0.45em; + font-size: 0.7em; + font-weight: 500; + text-transform: uppercase; + letter-spacing: 0.04em; + vertical-align: middle; +}