test(color-picker): alpha support

.eslintrc.json

@@ -10,7 +10,7 @@
     "plugin:jsdoc/recommended",
     "prettier"
   ],
-  "ignorePatterns": ["dist", "docs", "www"],
+  "ignorePatterns": ["dist", "docs", "hydrate", "www"],
   "parser": "@typescript-eslint/parser",
   "parserOptions": {
     "project": "./tsconfig-eslint.json",

.github/ISSUE_TEMPLATE/accessibility.yml

@@ -109,6 +109,7 @@ body:
         - ArcGIS Map Viewer
         - ArcGIS Marketplace
         - ArcGIS Mission
+        - ArcGIS Monitor
         - ArcGIS Network Analyst
         - ArcGIS Online
         - ArcGIS Scene Viewer

.github/ISSUE_TEMPLATE/bug.yml

@@ -103,6 +103,7 @@ body:
         - ArcGIS Map Viewer
         - ArcGIS Marketplace
         - ArcGIS Mission
+        - ArcGIS Monitor
         - ArcGIS Network Analyst
         - ArcGIS Online
         - ArcGIS Scene Viewer

.github/ISSUE_TEMPLATE/enhancement.yml

@@ -70,6 +70,7 @@ body:
         - ArcGIS Map Viewer
         - ArcGIS Marketplace
         - ArcGIS Mission
+        - ArcGIS Monitor
         - ArcGIS Network Analyst
         - ArcGIS Online
         - ArcGIS Scene Viewer

.github/ISSUE_TEMPLATE/new-component.yml

@@ -71,6 +71,7 @@ body:
         - ArcGIS Map Viewer
         - ArcGIS Marketplace
         - ArcGIS Mission
+        - ArcGIS Monitor
         - ArcGIS Network Analyst
         - ArcGIS Online
         - ArcGIS Scene Viewer

.github/workflows/add-esri-product-label.yml

@@ -57,16 +57,23 @@ jobs:
               }
 
               /** remove any existing product label(s) */
-              const labels = currentLabels
-                .filter((l) => !/Issues logged by/.test(l.description))
-                .map((l) => l.name);
+              const existingProductLabels = currentLabels
+                .filter((l) => /Issues logged by/.test(l.description) && l.name !== product)
+                .forEach(
+                  async (l) =>
+                    await github.rest.issues.removeLabel({
+                      issue_number,
+                      owner,
+                      repo,
+                      name: l.name,
+                    })
+                );
 
-              labels.push(product);
-
-              await github.rest.issues.setLabels({
+              /** add new product label */
+              await github.rest.issues.addLabels({
                 issue_number,
                 owner,
                 repo,
-                labels,
+                labels: [product],
               });
             }

.github/workflows/chromatic.yml

@@ -50,6 +50,7 @@ jobs:
         with:
           projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
           exitOnceUploaded: true
+          autoAcceptChanges: master
         env:
           STORYBOOK_SCREENSHOT_TEST_BUILD: true
           CHROMATIC_DIFF_THRESHOLD: ${{ secrets.CHROMATIC_DIFF_THRESHOLD }}

.github/workflows/need-info-verify.yml

@@ -2,12 +2,10 @@ name: "Need Info - Verify"
 on:
   issues:
     types: [labeled, edited]
-    branches: [master]
   issue_comment:
     types: [created, edited]
-    branches: [master]
 jobs:
   verify:
     runs-on: ubuntu-latest
     steps:
-      - uses: benelan/need-info-action@v1.3.1
+      - uses: benelan/need-info-action@v2.0.0

.github/workflows/pr-milestone.yml

@@ -8,4 +8,4 @@ jobs:
     if: github.event.pull_request.merged == true
     runs-on: ubuntu-latest
     steps:
-      - uses: benelan/milestone-action@v1.3.1
+      - uses: benelan/milestone-action@v2.0.0

.github/workflows/pr-semantic.yml

@@ -4,7 +4,7 @@ jobs:
   semantic:
     runs-on: ubuntu-latest
     steps:
-      - uses: amannn/action-semantic-pull-request@v3.4.6
+      - uses: amannn/action-semantic-pull-request@v5.0.2
         with:
           validateSingleCommit: true
         env:

.lintstagedrc.json

@@ -2,5 +2,5 @@
   "*.{json,md,html,yml}": ["prettier --write"],
   "*.js": ["eslint --ext .js --fix", "prettier --write"],
   "*.scss": ["stylelint --fix", "prettier --write"],
-  "*.{ts,tsx}": ["eslint --ext .ts,.tsx --fix", "prettier --write"]
+  "*/!(assets)/*.{ts,tsx}": ["eslint --ext .ts,.tsx --fix", "prettier --write"]
 }

.storybook/helpers.ts

@@ -1,8 +1,8 @@
 import * as icons from "@esri/calcite-ui-icons";
 import { boolean as booleanKnob } from "@storybook/addon-knobs";
-import { THEMES } from "../src/utils/resources";
-import { ThemeName } from "../src/components/interfaces";
 import { Parameters } from "@storybook/api";
+import { ModeName } from "../src/components/interfaces";
+import { MODES } from "../src/utils/resources";
 
 // we can get all unique icon names from all size 16 non-filled icons.
 export const iconNames = Object.keys(icons)
@@ -30,8 +30,8 @@ export const setKnobs = ({ story, knobs }: { story: string; knobs: { name: strin
     .join("")}"`;
 };
 
-export const setTheme = (value: ThemeName) => `${THEMES.map(
-  (theme) => `document.body.classList.toggle('${theme.className}', ${(theme.name === value).toString()});`
+export const setMode = (value: ModeName) => `${MODES.map(
+  (mode) => `document.body.classList.toggle('${mode.className}', ${(mode.name === value).toString()});`
 ).join("")}
 `;
 

.storybook/preview.ts

@@ -1,35 +1,35 @@
-import { themes, globalDocsPage, parseReadme } from "./utils";
+import { Theme as Mode } from "storybook-addon-themes/dist/models/Theme";
 import { withDirection } from "storybook-rtl-addon";
-import { Theme } from "storybook-addon-themes/dist/models/Theme";
+import { globalDocsPage, modes, parseReadme } from "./utils";
 
 declare global {
   interface Window {}
 }
 
-const themeBodyClassDecorator = (Story: () => any, context: any) => {
-  const themes = context.parameters.themes;
+const modeBodyClassDecorator = (Story: () => any, context: any) => {
+  const modes = context.parameters.modes;
 
-  themes?.list?.forEach((theme: Theme) => {
-    const isDefault = theme.name === themes.default;
-    if (Array.isArray(theme.class)) {
-      theme.class.forEach((className) => document.body.classList.toggle(className, isDefault));
+  modes?.list?.forEach((mode: Mode) => {
+    const isDefault = mode.name === modes.default;
+    if (Array.isArray(mode.class)) {
+      mode.class.forEach((className) => document.body.classList.toggle(className, isDefault));
     } else {
-      theme.class && document.body.classList.toggle(theme.class, isDefault);
+      mode.class && document.body.classList.toggle(mode.class, isDefault);
     }
   });
 
   return Story();
 };
 
-export const decorators = [withDirection, themeBodyClassDecorator];
+export const decorators = [withDirection, modeBodyClassDecorator];
 export const parameters = {
   a11y: {
     element: "#root",
     config: {},
     options: {},
     manual: false
   },
-  themes,
+  modes,
   docs: {
     extractComponentDescription: (_component, { notes }) => {
       if (notes) {

.storybook/utils.tsx

@@ -18,7 +18,7 @@ import { CSS_UTILITY } from "../src/utils/resources";
 
 import { colors } from "../node_modules/@esri/calcite-colors/dist/colors";
 import { Description, DocsPage } from "@storybook/addon-docs";
-import { Theme } from "storybook-addon-themes/dist/models/Theme";
+import { Theme as Mode } from "storybook-addon-themes/dist/models/Theme";
 import React from "react";
 
 const autoValue = {
@@ -36,30 +36,30 @@ const darkValue = {
   value: colors["blk-210"]
 };
 
-const list: Theme[] = [
+const list: Mode[] = [
   {
     name: lightValue.name,
-    class: CSS_UTILITY.lightTheme,
+    class: CSS_UTILITY.lightMode,
     color: lightValue.value
   },
   {
     name: darkValue.name,
-    class: CSS_UTILITY.darkTheme,
+    class: CSS_UTILITY.darkMode,
     color: darkValue.value
   },
   {
     name: autoValue.name,
-    class: CSS_UTILITY.autoTheme,
+    class: CSS_UTILITY.autoMode,
     color: autoValue.value
   }
 ];
 
-export const themes = {
+export const modes = {
   default: lightValue.name,
   list
 };
 
-export const themesDarkDefault = {
+export const modesDarkDefault = {
   default: darkValue.name,
   list
 };

.vscode/settings.json

@@ -6,5 +6,9 @@
   "editor.formatOnSave": true,
   "editor.quickSuggestions": {
     "strings": true
-  }
+  },
+  "html.customData": [
+    "./dist/extras/vscode-data.json",
+    "./node_modules/@esri/calcite-components/dist/extras/vscode-data.json"
+  ]
 }