⚙️ Fix/setup tailwind issue

[adriangohjw]

Problem

For some reason, setting up the codebase from scratch again caused a tailwind import issue

Solution

Bug Fixes:

• import from tailwindcss/colours.js instead of tailwindcss/colours
• since tailwind is not a dependency in Studio, i have components export the colour so it can be imported from it instead

---

Note

Low Risk
Primarily build/config import-path fixes and a small refactor to source colors from components; runtime impact should be limited to Tailwind build success and potential missing CSS utilities in the preview bundle.

Overview
Fixes Tailwind setup/import breakages by switching Tailwind ESM imports to explicit .js entrypoints (e.g. tailwindcss/plugin.js, tailwindcss/defaultTheme.js, tailwindcss/colors.js) across presets and template/storybook configs.

Studio no longer imports tailwindcss/colors directly; instead @opengovsg/isomer-components now re-exports isomerColors from the Next preset and Studio’s contrast-checking logic uses that shared token (isomerColors.base.content.DEFAULT).

The generated Studio preview Tailwind CSS bundle is updated, removing a few previously emitted utilities (e.g. end-1, !inline, max-h-16, gap-x-2, pl-1, and some responsive variants).

^{Written by Cursor Bugbot for commit 230cf6f. This will update automatically on new commits. Configure here.}

[seaerchin]

do you mind sharing what's the issue? i might be able to help

[adriangohjw]

do you mind sharing what's the issue? i might be able to help

@seaerchin it says tailwind not found in node_modules for studio - TBH I also don't really know why. Tried deleting the repo and reckoning+npm ci, but still couldn't fix it... :(

[mergify]

This pull request has been stale for more than 30 days! Could someone please take a look at it @opengovsg/isomer-engineers