@keboola/tailwind-config 1.1.0 → 1.1.2

package/CHANGELOG.md

@@ -0,0 +1,279 @@
+# @keboola/tailwind-config
+
+## 1.1.2
+
+### Patch Changes
+
+- `AIKit/Markdown` code surfaces follow the colour scheme and the brand.
+
+  Fenced blocks and inline code were painted with `neutral-50` / `neutral-800`, literals that cannot take part in the `[data-theme='dark']` variable swap. In dark mode `prose-invert` flipped the surrounding text to light while the pinned fill stayed near-white, leaving inline code unreadable. Both now use the semantic `muted` / `foreground` pair, the same one the stylesheet already gives a prose blockquote.
+
+  Typography's inverted palette pinned the ink of a fenced block and of code in a quote to `#c7254e` regardless of the fill beneath it — 2.72:1 once that fill follows the dark scheme. Both now inherit the surface they sit on, so the ink moves with the fill.
+
+## 1.1.1
+
+### Patch Changes
+
+- The published tarball now carries a `CHANGELOG.md`, so a consumer can read what changed in a release — breaking changes included — without leaving their `node_modules`.
+
+  It could not simply be added to `files`. This repo is private, so every reference `@changesets/changelog-github` emits is a dead link for anyone reading from npm: PR links, commit SHAs, author handles, and the Linear and cross-repo links that changeset prose carries. Across the publishable packages that came to 490 PR links, 863 commit links, 490 author credits and 102 dependency-bump blocks.
+
+  The published file is generated, not maintained. `scripts/public-changelog.mjs` removes those links ahead of the publish and leaves the prose. An identifier the author typed themselves stays as text — `UT-4009`, `connection#8040` — because it is part of the sentence and, without its URL, resolves to nothing outside Keboola. The repo-side `CHANGELOG.md` keeps every link, because that is how a release gets traced internally. It is rewritten only for the moment the tarballs are packed, then restored — which the release also depends on: `changesets/action` reads each changelog back off disk _after_ the publish command returns, to build that version's GitHub Release body, so without the restore the internal releases would carry the public text. A reference the rules do not cover fails the publish rather than shipping.
+
+  One incidental fix: a hex colour written as `#222529` in changeset prose had been autolinked into a link to issue 222529. Unwrapping restores the colour, so the published notes read as the author wrote them.
+
+## 1.1.0
+
+### Minor Changes
+
+- Remove the deprecated `Collapse` component. Use `Collapsible` instead.
+
+  Every call site in this repo has been migrated and the export is gone from the barrel. The `collapseDown` animation and keyframe go with it — `Collapse` was their only consumer.
+
+  Migrating is not a rename; the two components differ in three ways:
+  - **Closed content is unmounted.** `Collapse` kept children mounted at zero height; Radix's `Collapsible` takes them out of the DOM. Anything that read, measured or held local state in collapsed content needs `forceMount` or a lift of that state.
+  - **The toggle moves to `Collapsible.Trigger`**, a real `<button>` with `aria-expanded`. It cannot wrap a header that already contains buttons — where the header carries its own actions, keep the existing click handler and drive `Collapsible` through `open` / `onOpenChange`.
+  - **`header` is a child, not a prop.** Render the header element directly, then `Collapsible.Content` for the body. `data-state` still lands on the root, so `group-data-[state=open]:` rules keep working once the root carries `tw:group`.
+
+  `Collapsible` is **not** the right replacement for a clamped preview — a "show more" block whose collapsed state still shows part of the content. It hides the content outright; clamp it with your own `max-height`/grid rule instead.
+
+  `CollapsiblePanel` and `PanelWithDetails` now build on `Collapsible`. Their props are unchanged, but both inherit the unmount-when-closed behaviour above.
+
+  **Disclosure motion slows to match.** `Collapsible`'s `collapsible-open` / `collapsible-close` go from 0.2s `ease-out` to 300ms `ease` — the motion the retired `Collapse` had, so migrated call sites keep their timing. Pre-existing `Collapsible` consumers get the slower curve too.
+
+  `Collapsible.Trigger` now carries `tailwindcss-preflight`. It renders a bare `<button>`, and because the package's reset is opt-in, a trigger without `asChild` previously picked up UA button chrome — a `2px outset` border and a `buttonface` fill — in any host app without a global reset. Triggers using `asChild` already inherited the reset from the design component they wrapped and are unaffected.
+
+### Patch Changes
+
+- Guard every custom utility `theme.css` promises against the v4 failure mode where an unregistered
+  token resolves in another namespace instead of erroring, and move the three an app's own build
+  could not reach into it. `not-disabled` is the one that changes behaviour: outside design it fell
+  through to v4's core `not-*` variant, which drops the `[data-disabled="true"]` half, so a control
+  disabled that way still took hover and focus styling.
+
+- Shipped docs and comments spell Tailwind classes the v4 way (`tw:flex`, not `tw-flex`).
+
+  A `tw-` class compiles to nothing under the v4 prefix, so every one of these examples handed a reader a class name that silently produces no styles. `brand-registry`'s `AGENTS.md` and `brand-audit`'s `README.md` go out in the tarball, and `tailwind-config` ships `index.js` / `colors.ts` with their comments intact.
+
+  `brand-audit`'s README also stops attributing its false positives to Tailwind v3 inlining resolved triplets into the bundle. That mechanism is gone — v4 emits `rgb(var(--token))` — but a scan of `apps/boilerplate/dist` reports 2 661 findings against a v4 build, up from the 1 082 the README quotes. The surviving cause is the scanner's own skip logic: `stripSkippableContent` blanks `var(...)` to spaces and leaves the colour function around it, so `rgb(var(--background))` becomes `rgb(                 )` and the `rgb()` pattern matches it. It fires on precisely the idiom that makes a bundle brand-safe.
+
+  `--tw-*` custom properties, the `tw-animate-css` package name, and the deliberate `never tw-flex` counter-examples in `AGENTS.md` are left alone.
+
+- Docs stop teaching two class spellings that do not compile.
+
+  `tw:shadow-sm/md/lg` and `tw:rounded-sm/md/lg` were prose shorthand for three classes each. Under the v3 prefix that was merely terse; under v4 `/` is the opacity modifier, so the shorthand parses as one broken class. Spelled out in `tailwind-config`'s shipped `index.js` comments and in `brand-registry`'s `AGENTS.md`, which goes out in the tarball.
+
+  `@keboola/design`'s `DESIGN.md` token table referred to the prose surface as `.tw:prose`. In a selector an unescaped colon reads as `.tw` with a `:prose` pseudo-class; `src/styles.css` already writes `.tw\:prose`, so the docs now match it. The bare `tw:prose` class token elsewhere in that file is unchanged.
+
+## 1.0.3
+
+### Patch Changes
+
+- `Collapsible.Content` stays clipped for the whole open/close animation, so its content can no longer paint outside the box it is animating into — over whatever card or section follows it (UT-5169). Every `Alert mode="collapsible"` gets the same fix.
+
+  The clipping lives in the keyframes, and the keyframes were not ours. `tw-animate-css` ships `collapsible-down` / `collapsible-up` carrying height only; every consumer imports it unlayered (its `@utility` rules cannot be nested in a layer), unlayered beats `tailwind-config`'s `@config`-bridged same-named pair, so ours never applied. Reordering does not help either — Tailwind emits `@theme`-sourced keyframes unlayered at the tail, in an order each consuming app decides.
+
+  So the animation moves to `design/src/theme.css` under `collapsible-open` / `collapsible-close`, names no vendored library claims. That is also the better home on its own: `@keboola/tailwind-config`'s theme reaches design's own bundle, while `design/theme` reaches every consumer app's utility generation. Both keyframes now carry `overflow: hidden` on **both** endpoints — `overflow` animates discretely, so the old `visible → hidden` pair left the first half of the collapse unclipped regardless of which definition won. No fill mode, so a settled-open panel keeps its own `overflow: visible` and its own height.
+
+  Two guards, because the two halves fail differently. A unit test asserts our `@keyframes` names stay disjoint from `tw-animate-css`'s, so the next colliding name fails at author time instead of silently losing the cascade; the dead `collapsible-*` and `caret-blink` entries are gone from `tailwind-config` to make that true. A `Collapsible` story test then reads the winning rule out of a real browser and asserts every frame of it clips.
+
+## 1.0.2
+
+### Patch Changes
+
+- `PageLayout.Content nav` behaves the same at both widths, and no longer eats a sticky table header.
+
+  Three things diverged as the nav collapsed. The dropdown trigger stayed pinned, so it floated over the content it was meant to label — it is only pinned now where it sits beside a scrolling body. The body scrolled itself only at the wide width, so the edge fades were absent when collapsed and a page's tables changed scroll container under them; the body is now the scroll region at both widths, measured from its own top since stacked it sits below the trigger. And the fade dissolved a `position: sticky` table header exactly while it was pinned at the region's top, so the body's leading edge is now tunable and a page that pins a header flattens just that edge.
+
+  Both edges stay masked, and stacked the region's edge now starts at the dropdown: the row took a 24px gap under the trigger, so content dissolved at a line floating below it. `tailwind-config` gains `--tw-scroll-fade-size-start`, which lets a region keep a shallow or flat leading edge — a mask dims a `position: sticky` table header pinned at the top along with the content it is fading, so kbc-ui flattens it on pages that pin one (`:has(.is-sticky)`) and every other page keeps the full fade.
+
+## 1.0.1
+
+### Patch Changes
+
+- `InputGroup`, the `Toggle` `ghost` variant and the legacy `Button` `invisible` variant follow the active color scheme instead of staying pinned to light-scheme literals. Adds an `input-background` token for the form-control fill.
+
+  All three hard-coded the values that happen to be right on a white page, so under `[data-theme='dark']` an input kept a white fill, a light border and near-black text, a pressed `ghost` toggle rendered as a bright pale-blue block, and an `invisible` button's label vanished into the panel.
+
+  **New token — `input-background`.** A form control's fill had no token of its own, so the only scheme-following surfaces available were container tokens. `card` is raised container chrome (Card / Modal / Sheet) and a brand tints it independently of what it wants inside a field, so the field now gets its own slot: `--input-background` / Tailwind `bg-input-background`, brand-overridable through `colors.inputBackground`. It pairs with `input`, which stays the control's _border_. Defaults are `#ffffff` light and `#2f3037` dark — the dark value clears `background`, `card` and `popover` so a field reads as its own surface in all three.
+  - `InputGroup` takes its border from `input`, and the `primary` variant its fill from `input-background` and its text from `foreground`. `primary` also re-pins its readonly fill to `muted`/`input`, the pair `argo` already uses — the shared readonly fill is a fixed light grey that scheme-following text would sit on invisibly. The `argo` variant keeps its `muted` fill: a grey inset is deliberate there, and converging the two is a brand-value decision.
+  - `Toggle` `ghost` takes its hover fill from `muted` and its pressed fill from a translucent blue tint that composites over whatever surface it sits on.
+  - `Button` `invisible` (legacy) takes its label from `foreground` and its hover / active fills from `muted` / `secondary`. A transparent button inherits whatever surface it is dropped on, so it is the one legacy variant that cannot assume a light page; pinning it forced dark-scheme call sites to re-declare the colour by hand. The argo `invisible` variant already read `foreground`.
+
+  Light-scheme deltas are limited to the `invisible` button, whose label moves from `neutral-800` (`#222529`) to `foreground` (`#1e293b`) — converging it with the ~90 surfaces already on that token — and whose hover / active fills move from `neutral-100` / `neutral-150` to `muted` / `secondary` (`#edf0f5` → `#f1f5f9`, `#d9dde5` → `#e2e8f0`). Everything else is byte-identical: `input-background` is white in the light scheme, and `input` / `foreground` / `muted` resolve to the greys the literals named (a readonly `primary` input's fill lightens by one step).
+
+  `InputGroup`'s `secondary` variant and the error scales are still light-only.
+
+## 1.0.0
+
+### Major Changes
+
+- Drop Tailwind CSS v3 from the shared config packages — the monorepo runs on v4
+  everywhere, and these were the last holdouts pinning v3 in the dependency graph.
+
+  `@keboola/tailwind-config` is now tokens only: the default export is
+  `{ theme }`. Removed the `createKeboolaConfig({ prefix })` factory (in v4 the
+  class prefix is declared in CSS, `@import 'tailwindcss/utilities.css' prefix(tw)`),
+  `content`, `corePlugins.preflight`, and the bundled plugin registrations —
+  `tailwindcss-animate`, `@tailwindcss/typography`,
+  `@tailwindcss/container-queries` and `tailwindcss-scoped-preflight` are no
+  longer dependencies. Container queries are core in v4, animation utilities come
+  from `tw-animate-css`, and preflight scoping is a `@plugin` directive in CSS.
+  The `tailwindcss` peer moves to `^4.0.0`. Migrating consumers: spread
+  `keboolaConfig.theme` into your own config, register the plugins you need
+  yourself, and declare the prefix in your stylesheet.
+
+  `@keboola/postcss-config` is deleted rather than migrated. It had no consumer
+  left in the monorepo — there is no `postcss.config.*` anywhere, since every app
+  builds through `@tailwindcss/vite` — and all it ever exported was a one-line
+  plugin list. v4 consumers who need the PostCSS path should write it themselves:
+  `module.exports = { plugins: { '@tailwindcss/postcss': {} } }`. The published
+  `@keboola/postcss-config@0.1.1` stays on npm and gets deprecated with that
+  pointer.
+
+  No behavioural change for `@keboola/design` or the apps: design already reads
+  only the token surface (via v4's `@config` bridge) and registers its own
+  plugins.
+
+### Minor Changes
+
+- Add a `./scrollFade` export exposing the scroll-fade plugin so consumers can register it under the Tailwind v4 `@plugin` API. Part of the Tailwind v3 → v4 migration.
+
+## 0.9.0
+
+### Minor Changes
+
+- Improve DS contrast. The `Table` header now uses a distinct `table-header`
+  chrome token instead of `muted` (which sat ~1.05:1 against the surfaces, making
+  the header row near-invisible), and the gray-inverse `Badge` text meets WCAG-AA.
+  Adds a non-gating `audit:contrast` script + `CONTRAST-AUDIT.md` reporting sub-AA
+  token pairings in the default palette as a backlog.
+
+## 0.8.0
+
+### Minor Changes
+
+- Add a brand-driven type scale to `typography`. `theme.typography.typeScale` now carries `display` / `heading` / `body` steps, each bundling `size` / `weight` / `leading` (line-height) / `tracking` (letter-spacing) — all optional. `ThemeProvider` emits them as `--type-<step>-<axis>` CSS vars, and `@keboola/tailwind-config` reads them through new `tw-text-display` / `tw-text-heading` / `tw-text-body` utilities (one utility sets size + line-height + weight + letter-spacing together). This lets a brand express a real display/body hierarchy — pair with `typography.fontDisplay` (e.g. a serif display face over a sans body) for an editorial/executive feel. The utilities' inline fallbacks equal the stylesheet defaults, so brands that omit `typeScale` render unchanged.
+
+## 0.7.0
+
+### Minor Changes
+
+- Wire the brand `radii` and body-font tokens into their Tailwind utilities. `tw-rounded-sm/md/lg` now read `--radius-sm/md/lg` and `tw-font-sans` now reads `--font-sans` (both emitted by `ThemeProvider` from a brand's `theme.radii` / `theme.typography.fontFamily`), each with an inline fallback equal to the previous value so unset brands are unaffected. Until now these vars were injected but no utility consumed them, so a brand's radii and body font only reached the handful of components using `var(--radius-*)` directly and elements inheriting `html`'s font — a brand override now re-skins corner radii and typography across all chrome. Mirrors the existing `--shadow-*` / `--space-*` / `--font-display` wiring.
+
+  One behavioral change for consumers importing `@keboola/design/styles`: `tw-rounded-sm` shifts `0.125rem` → `0.25rem`, because the stylesheet's `:root` already declares `--radius-sm: 0.25rem` (which the new `var(--radius-sm, 0.125rem)` resolves to). `tw-rounded-md/lg` and `tw-font-sans` are unchanged, since their `:root`/brand values already equal the previous stock values.
+
+### Patch Changes
+
+- Make chrome tracking + font weights on `Button` and `Badge` token-driven so a brand can re-skin them via `@keboola/brand-registry`. The hardcoded `tw-tracking-[1px]` becomes the `tw-tracking-chrome` token (reading `--letter-spacing-chrome`), and the `fontWeight` scale reads the brand's `--font-weight-*` overrides. `ThemeProvider` emits the new variables. Casing stays a plain `tw-uppercase`. Defaults are unchanged, so brands that omit the slots render identically to today.
+
+  `@keboola/tailwind-config` gains the `tracking-chrome` utility and a var-driven `fontWeight` scale — both falling back to today's values.
+
+## 0.6.0
+
+### Minor Changes
+
+- Make the `Skeleton` loading placeholder visible in light mode. The base used
+  `tw-bg-muted`, which sits ~1.05–1.10:1 against white cards / off-white
+  background — effectively invisible — and the `white/40` shimmer was likewise
+  invisible over that near-white base. The base now uses a dedicated,
+  scheme-aware `tw-bg-skeleton` token (`--color-skeleton`): a touch darker than
+  `muted` in light and lighter than card/background in dark, so the block is
+  perceptible and the shimmer reads in both schemes.
+
+## 0.5.0
+
+### Minor Changes
+
+- Add advanced brand theme tokens beyond colour/radii. `brandSchema.theme` now accepts optional `shadows` (elevation scale `sm`/`md`/`lg`/`lift`), `spacing` (`gutter`/`inset` density), `motion` (`duration`/`easing`), `gradient` (`brand`), and `typography.fontDisplay` / `typography.fontMono` for display/mono font pairing. `ThemeProvider` emits each as a CSS variable only when the brand sets it (`--shadow-*`, `--font-display`, `--font-mono`, `--space-*`, `--motion-*`, `--gradient-brand`), so unset brands are unaffected. Tailwind utilities read these vars with inline fallbacks equal to the current defaults — `tw-shadow-sm/md/lg` are unchanged, plus new `tw-shadow-lift`, `tw-font-display`, `tw-bg-brand`, `tw-duration-brand` / `tw-ease-brand`, and `tw-p-inset` / `tw-gap-gutter`.
+
+- Make Card / Search elevation dark-aware. Both components hardcoded a pale
+  blue-gray shadow (`0 2px 6px rgba(100 135 153 / 0.13)`) tuned for white
+  backgrounds, which reads as a light halo on dark surfaces. The shadow now comes
+  from a new `tw-shadow-raised` utility backed by the `--shadow-raised` token,
+  which flips to a black shadow under `[data-theme='dark']`. Light rendering is
+  unchanged (the token default equals the previous value).
+
+## 0.4.0
+
+### Minor Changes
+
+- Add a `createKeboolaConfig({ prefix })` factory so external consumers can opt out of the `tw-` class prefix (or set a custom one). The default export is unchanged — it now equals `createKeboolaConfig()` (`prefix: 'tw-'`), so `@keboola/design`'s build and every in-monorepo app that `import`s the default config are unaffected. Consumers that don't extend design's compiled CSS and want unprefixed utilities (`flex`, not `tw-flex`) can spread `createKeboolaConfig({ prefix: '' })` instead.
+
+### Patch Changes
+
+- Fix dark-mode text contrast in AI chat messages. `MessageBubble` and `tw-prose` headings hardcoded fixed neutral primitives (`neutral-800`/`neutral-900`) that stayed dark on the dark surface, rendering assistant body copy and markdown headings nearly invisible. They now use the semantic `foreground` token (and `muted` for the user bubble) so they flip with `[data-theme='dark']`. All prose heading levels (`h1`–`h6`) now resolve to `foreground`, so none stay dark-on-dark in dark mode. In light mode the values are near-identical (headings `#101114`→`#1e293b`, body `#222529`→`#1e293b`, user bubble `#f2f4f7`→`#f1f5f9`), aligning chat text with the app's other headings.
+
+- Expose the `ring-offset` color (`--color-ring-offset`) so `tw-ring-offset-ring-offset` resolves to a CSS-var-backed token.
+
+## 0.3.0
+
+### Minor Changes
+
+- Add the `scroll-fade` CSS utility — fades the leading/trailing edges of a scroll container to hint at more content, purely in CSS (`mask-image` + CSS scroll-driven animations, no JS and no scroll listeners).
+  - Ships from `@keboola/tailwind-config` (registered via the shared plugin), so the classes are available — and autocomplete — in every app that uses the config.
+  - Classes: `tw-scroll-fade` / `tw-scroll-fade-y` (vertical) and `tw-scroll-fade-x` (horizontal). Apply directly to the scrollable element.
+  - Fade thickness is tunable via the `--tw-scroll-fade-size` custom property (default `1.5rem`).
+  - Static-fade fallback under `@supports not (animation-timeline: scroll())` for browsers without scroll-driven animations (non-Chromium).
+  - First shadcn-derived utility in the design system. See the `Utility/Scroll Fade` Storybook story.
+
+- Align semantic tokens with shadcn and add dark-mode-tunable status tokens.
+  - Rename the raised-container-chrome token `surface` → `card` (shadcn naming) and add its `card-foreground` pair. `card` resolves to the same values `surface` did (white in light, `#222228` in dark) — `Card`/`Modal`/`Sheet` are visually unchanged.
+  - Add a global `ring` focus-ring token (brand blue), matching `sidebar-ring`.
+  - Promote `secondary` / `secondary-foreground` to CSS variables (the `secondary-100..900` primitive scale is unchanged).
+  - Add semantic status tokens `success-foreground`, `warning` (+ `warning-foreground`), and `info` (+ `info-foreground`), and retune dark `destructive` from `#f87171` to `#e5484d`. These flip per color scheme so error/success/warning/info stay legible on dark surfaces.
+  - Add a categorical `chart-1..5` palette (brand-derived).
+
+- Add semantic-correct `blue` and `green` color palettes (UT-4361 Step 1). These are the Keboola brand ramps that historically lived under `secondary[100..900]` (blue) and `primary[100..900]` (green) — fixed tints, unrelated to the brand-driven `primary.DEFAULT` / `secondary.DEFAULT` shadcn semantic slots that share those namespace keys.
+  - `green`/`blue` are `100..900` ramps that override Tailwind's same-named defaults — exactly like the existing custom `cyan`/`teal`/`yellow`/`pink`/`purple` palettes in this config. So this is **not** "zero behavioral change": bare `tw-*-green-*` / `tw-*-blue-*` usages now resolve to the Keboola brand hue.
+  - The brand ramps are defined once (`greenScale` / `blueScale`) and shared by both the legacy `primary`/`secondary` aliases and the new `green`/`blue` palettes, so they can't drift.
+  - Migrated kbc-ui's few incidental bare-Tailwind usages so nothing relies on a now-removed default shade: `bg-green-50` → in-ramp `bg-green-100` (the only out-of-ramp shade in use), and `border-blue-400` → `border-secondary-400` to match its adjacent `bg-secondary-100`. The remaining `green-500/600` status indicators now resolve to the Keboola green primitive — the correct categorical-status token (their siblings already use `error-500`).
+
+  Step 2 (separate stacked PRs) sweeps the ~578 `primary-N`/`secondary-N` ramp callsites to `green-N`/`blue-N` and then drops the legacy ramps from `primary`/`secondary`.
+
+## 0.2.0
+
+### Minor Changes
+
+- Finalize dark-mode (Graphite) semantic tokens and add a `--color-surface` token for raised container chrome (Modal/Card/Sheet). In light mode, argo `Card` and `Sheet` move from the off-white `background` (`#f9fafb`) to white `surface` (`#ffffff`) — `Modal` was already white, so it is visually unchanged; in dark mode these surfaces lift off the page background, fixing the surface/input collision.
+
+- `primary.DEFAULT` and `primary.foreground` Tailwind tokens now reference `--color-primary` / `--color-primary-foreground` CSS variables via the `rgb(var(--name) / <alpha-value>)` template, so brand swaps that update those custom properties actually re-paint `tw-bg-primary`, `tw-text-primary-foreground`, etc. The green primitive scale at `primary[100..900]` is untouched.
+
+## 0.1.1
+
+### Patch Changes
+
+- Publish setup for the four shared config packages. Each package goes from
+  workspace-only (`"private": true`, version `1.0.0`) to publish-ready
+  (version `0.1.0`, `publishConfig.access: "public"`, `exports` map, `files`
+  allow-list, full `repository`/`homepage`/`bugs` metadata).
+
+  Initial `0.1.0` lands via a manual bootstrap `npm publish` once this PR
+  merges; subsequent releases ride Changesets. This entry is the first
+  changeset-tracked bump after bootstrap, so the next automated release
+  will produce `0.1.1`.
+
+  `@keboola/tailwind-config` exposes `.`, `./colors`, and `./typography`
+  subpath exports; the `colors`/`typography` entries are TypeScript source
+  that consumers' TS-aware Tailwind/bundler loader resolves (Tailwind v3.3+
+  ships jiti for this). A pre-compiled JS variant is planned as a
+  follow-up.
+
+  `@keboola/oxlint-config` resolves `@keboola/tailwind-config` via
+  `import.meta.resolve()` instead of a relative path so it works whether
+  the package is consumed via workspace symlink or installed from npm.
+  - `@keboola/tailwind-config` declares `tailwindcss@^3` as a peer dependency
+    and keeps the Tailwind plugins (`@tailwindcss/container-queries`,
+    `@tailwindcss/typography`, `tailwindcss-animate`,
+    `tailwindcss-scoped-preflight`) as direct dependencies.
+  - `@keboola/postcss-config` declares `postcss@^8` and `tailwindcss@^3` as
+    peer dependencies.
+  - `@keboola/tsconfig` exposes the three preset entry points
+    (`./base.json`, `./react.json`, `./nextjs.json`) via the `exports` map
+    and declares `typescript@^5 || ^6` as a peer dependency.
+  - `@keboola/oxlint-config` moves the ESLint-plugin set referenced by
+    `jsPlugins` from `devDependencies` to `peerDependencies` so external
+    consumers know what to install alongside.
+
+  Unblocks `@keboola/design` publish setup (UT-4009), which depends on
+  `@keboola/tailwind-config` resolving from npm.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@keboola/tailwind-config",
-  "version": "1.1.0",
+  "version": "1.1.2",
   "description": "Shared Tailwind CSS v4 design tokens for the Keboola UI platform — semantic color palette, type scale, radii and shadows as a `theme` object.",
   "license": "MIT",
   "type": "module",
@@ -16,7 +16,8 @@
     "colors.ts",
     "typography.ts",
     "scrollFade.ts",
-    "README.md"
+    "README.md",
+    "CHANGELOG.md"
   ],
   "publishConfig": {
     "access": "public"

package/typography.ts

@@ -6,11 +6,25 @@ export const typography = {
       'h1, h2, h3, h4, h5, h6': {
         color: 'inherit',
       },
-      'blockquote code': {
-        color: 'var(--tw-prose-code)',
-      },
-      'pre code': {
-        color: 'var(--tw-prose-code)',
+      // Code in a quote or a fenced block takes the ink of the surface it sits
+      // on rather than a pinned one.
+      //
+      // - `--tw-prose-code` is `#c7254e` in both schemes; the fill under it is
+      //   not. On a dark `--muted` slab that pin measures 2.72:1.
+      // - A colour declared here lands on the `<code>`, so it beats the one a
+      //   call site puts on the `<pre>` — inheritance loses to any declaration.
+      // - Raising the call site's specificity is not an escape either: under
+      //   `[data-theme='dark'] .tw\:prose` this rule is `(0,2,0)`, above the
+      //   `(0,1,2)` of a `[&_pre_code]:…` arbitrary variant.
+      // - Bare inline `code` is deliberately not in the list. It keeps
+      //   `--tw-prose-invert-code`, 3.36:1 on the dark page. The chat surfaces
+      //   that render most of it put it on their own chip — `AIKit/Markdown`
+      //   and kbc-ui's chat both do. A bare `.tw\:prose` does not, and
+      //   kbc-ui's `react/common/Markdown` is one: there the 3.36:1 stands.
+      //   The fix still belongs with the chip — a rule here would strip the
+      //   accent from every call site at once, including the ones that want it.
+      'blockquote code, pre code': {
+        color: 'inherit',
       },
     },
   },