[vscode-lit-plugin] Non-hex color formats aren't recognized for color picker

[Austin Jackson]

Related to #30

Currently, the only colors that can be matched and that can use the color picker are hex based:

lit-analyzer/packages/vscode-lit-plugin/src/color-provider.ts

Line 117 in 9659154

 const colorMatches = getRegexMatches(COLOR_HEX_REGEX, taggedTemplateText); 

With an HTML file:

With a TS file:

Reproduce:

import { LitElement, css, html } from 'lit'
import { customElement } from 'lit/decorators.js'

@customElement('foo-element')
export class FooElement extends LitElement {
  render() {
    return html`<p>hello</p>`;
  }

  static styles = css`
    .foo {
      background: white;
      background-color: rgb(234, 238, 242);
      color: hsl(120deg, 75%, 25%);
      color: hsla(120deg, 75%, 25%, 0.5);
      color: #fff;
    }
  `
}

[Austin Jackson]

I don't know if this is related or not, but this seems to be how VSCode does it:

https://github.com/microsoft/vscode/blob/7ead2078eb2a097119e66bd8272155bcc1580667/src/vs/editor/common/languages/defaultDocumentColorsComputer.ts#L101-L138