docs: add Angular integration guide

[vltansky]

Angular supports Tailwind out of the box from version 11.2 angular/angular-cli#19935
So the integration guide will be pretty simple.

There are two known issues (I've described them detailed in Angulars repo angular/angular-cli#20015):

1. Angular is not setting process.env.NODE_ENV to production (reasonable Tailwind support angular/angular-cli#20015 (comment)), so right now purge is not working.
   I think this is pretty critical, so I mark this PR as a draft until this or other PR with fix will be merged.
2. Tailwind dark mode directives won't work correctly in component styles with view encapsulation other than none, as tailwind will just try to prepend class with .dark, so the result code will be something like .dark[_ng-content-**] .value[_ng-content-**] instead of expected .dark .value[_ng-content-**]

The Angular team response:

Regarding point 2: ViewEncapsulation.None will be highly recommended with Tailwind due to the reasons you mentioned. View encapsulation doesn't really provide much value for Tailwind users anyways, since most styling is done via directly applied classes. We're hoping to avoid building additional tooling and over-engineer a solution where ViewEncapsulation.None would solve most of those issues

I don't think that this is a critical issue, but maybe it should be mentioned in the guide? Or maybe you would want to plan some fixes on your side towards Angular?

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/tailwindlabs/tailwindcss-com/mw7a0vpqy
✅ Preview: https://tailwindcss-com-git-fork-vltansky-integration-angular.tailwindlabs.vercel.app

[thanapongp]

One thing worth mentioning is if the user wanted to use :host inside the component's stylesheet, they'd have to include :host to PurgeCss's safelist like so:

const { guessProductionMode } = require('@ngneat/tailwind');

module.exports = {
  prefix: '',
  purge: {
    enabled: guessProductionMode(),
    content: ['./src/**/*.{html,ts}'],
    options: {
      safelist: {
        greedy: [/\:host/],
      },
    },
  },
  darkMode: false
  theme: {
    extend: {},
  },
  variants: {
    extend: {},
  },
  plugins: [],
};

Otherwise, it will get purge during the build process.

[adamwathan]

Hey thanks for this! We've removed the Angular guide from the repo since it was never properly finished/published, so unfortunately these changes no longer have a home. Hopefully have a chance to do a proper Angular guide in the future.