Merge remote-tracking branch 'origin/dev' into benelan/8359-track-mil…

…estone-estimates

* origin/dev: (26 commits)
  test: fix `window.getComputedStyle` arguments (#10424)
  test(card): remove redundant spy and setup wrapper element (#10429)
  test(heading): avoid `newSpecPage` usage to ease Lumina migration (#10431)
  refactor(themed): drop broken, unused, regexp arg support (#10425)
  docs: component token description consistency (#10430)
  refactor: prevent mixed Sass mixed declaration warnings (#10426)
  deprecate: deprecate `enforce-ref-last-prop` rule (#10421)
  chore(actions): add custom `deprecate` type to semantic-pr check (#10427)
  chore(issue templates): add arcgis data pipelines to team dropdown (#10418)
  fix(tooltip): closed tooltips should not reappear (#10420)
  feat: add dashboard-graph (#10417)
  fix(input-time-zone): fix region mode quirks after update (#10413)
  fix(text-area): ensure border-color token doesn't override invalid styles (#10390)
  ci(changelog): add deprecation commits to changelog automation (#10346)
  fix: properly set aria attributes on components (#10404)
  feat: add parcel parameter (#10384)
  feat(alert): apply --calcite-alert-corner-radius to internal close button (#10388)
  feat(dialog, panel): Add css properties for background-color (#10387)
  fix: remove aria-disabled from components where necessary (#10374)
  feat(action-group, block, panel): add `menuPlacement` and `menuFlipPlacements` properties (#10249)
  ...

.github/ISSUE_TEMPLATE/accessibility.yml

@@ -124,6 +124,7 @@ body:
         - ArcGIS Business/Community Analyst
         - ArcGIS Charts
         - ArcGIS Dashboards
+        - ArcGIS Data Pipelines
         - ArcGIS Developer Experience
         - ArcGIS Enterprise
         - ArcGIS Excalibur

.github/ISSUE_TEMPLATE/bug.yml

@@ -118,6 +118,7 @@ body:
         - ArcGIS Business/Community Analyst
         - ArcGIS Charts
         - ArcGIS Dashboards
+        - ArcGIS Data Pipelines
         - ArcGIS Developer Experience
         - ArcGIS Enterprise
         - ArcGIS Excalibur

.github/ISSUE_TEMPLATE/enhancement.yml

@@ -87,6 +87,7 @@ body:
         - ArcGIS Business/Community Analyst
         - ArcGIS Charts
         - ArcGIS Dashboards
+        - ArcGIS Data Pipelines
         - ArcGIS Developer Experience
         - ArcGIS Enterprise
         - ArcGIS Excalibur

.github/ISSUE_TEMPLATE/new-component.yml

@@ -71,6 +71,7 @@ body:
         - ArcGIS Business/Community Analyst
         - ArcGIS Charts
         - ArcGIS Dashboards
+        - ArcGIS Data Pipelines
         - ArcGIS Developer Experience
         - ArcGIS Enterprise
         - ArcGIS Excalibur

.github/workflows/pr-semantic.yml

@@ -9,3 +9,20 @@ jobs:
       - uses: amannn/action-semantic-pull-request@v5.5.3
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          types: |
+            # default https://github.com/commitizen/conventional-commit-types/blob/master/index.json
+            feat
+            fix
+            docs
+            style
+            refactor
+            perf
+            test
+            build
+            ci
+            chore
+            revert
+
+            # custom
+            deprecate

CONTRIBUTING.md

@@ -236,6 +236,7 @@ Contributions must adhere to **one** of the following conventions:
 - **`refactor`**: A change that neither fixes a bug or adds a feature 🔁
 - **`revert`**: Reverts a previous commit ↪️
 - **`test`**: Improves test coverage in updating a test or adding a new, or missing test 🧪
+- **`deprecate`**: Documentation only changes for a deprecation 👎
 
 ### Scope of change
 

packages/calcite-components/src/assets/styles/_host.scss

@@ -1,10 +1,11 @@
 %component-host {
   /* Base ":host" styles for the component */
   box-sizing: border-box;
-  * {
-    box-sizing: border-box;
-  }
   background-color: var(--calcite-color-foreground-1);
   color: var(--calcite-color-text-2);
   font-size: var(--calcite-font-size--1);
+
+  * {
+    box-sizing: border-box;
+  }
 }

packages/calcite-components/src/components.d.ts

@@ -402,10 +402,18 @@ export namespace Components {
           * @deprecated Use the `layout` property on the component's parent instead.
          */
         "layout": Extract<"horizontal" | "vertical" | "grid", Layout>;
+        /**
+          * Specifies the component's fallback menu `placement` when it's initial or specified `placement` has insufficient space available.
+         */
+        "menuFlipPlacements": FlipPlacement[];
         /**
           * When `true`, the `calcite-action-menu` is open.
          */
         "menuOpen": boolean;
+        /**
+          * Determines where the action menu will be positioned.
+         */
+        "menuPlacement": LogicalPlacement;
         /**
           * Use this property to override individual strings used by the component.
          */
@@ -648,6 +656,14 @@ export namespace Components {
           * When `true`, a busy indicator is displayed.
          */
         "loading": boolean;
+        /**
+          * Specifies the component's fallback menu `placement` when it's initial or specified `placement` has insufficient space available.
+         */
+        "menuFlipPlacements": FlipPlacement[];
+        /**
+          * Determines where the action menu will be positioned.
+         */
+        "menuPlacement": LogicalPlacement;
         /**
           * Use this property to override individual strings used by the component.
          */
@@ -3312,6 +3328,10 @@ export namespace Components {
           * Used to specify the aria-setsize attribute to define the number of items in the current set of list for accessibility.
          */
         "setSize": number;
+        /**
+          * When `true`, the component's content appears inactive.
+         */
+        "unavailable": boolean;
         /**
           * The component's value.
          */
@@ -3872,10 +3892,18 @@ export namespace Components {
           * When `true`, a busy indicator is displayed.
          */
         "loading": boolean;
+        /**
+          * Specifies the component's fallback menu `placement` when it's initial or specified `placement` has insufficient space available.
+         */
+        "menuFlipPlacements": FlipPlacement[];
         /**
           * When `true`, the action menu items in the `header-menu-actions` slot are open.
          */
         "menuOpen": boolean;
+        /**
+          * Determines where the action menu will be positioned.
+         */
+        "menuPlacement": LogicalPlacement;
         /**
           * Use this property to override individual strings used by the component.
          */
@@ -7104,7 +7132,7 @@ declare global {
         new (): HTMLCalciteListItemElement;
     };
     interface HTMLCalciteListItemGroupElementEventMap {
-        "calciteInternalListItemGroupDefaultSlotChange": DragEvent;
+        "calciteInternalListItemGroupDefaultSlotChange": void;
     }
     interface HTMLCalciteListItemGroupElement extends Components.CalciteListItemGroup, HTMLStencilElement {
         addEventListener<K extends keyof HTMLCalciteListItemGroupElementEventMap>(type: K, listener: (this: HTMLCalciteListItemGroupElement, ev: CalciteListItemGroupCustomEvent<HTMLCalciteListItemGroupElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -7850,7 +7878,7 @@ declare global {
         new (): HTMLCalciteTileSelectGroupElement;
     };
     interface HTMLCalciteTimePickerElementEventMap {
-        "calciteInternalTimePickerChange": string;
+        "calciteInternalTimePickerChange": void;
     }
     interface HTMLCalciteTimePickerElement extends Components.CalciteTimePicker, HTMLStencilElement {
         addEventListener<K extends keyof HTMLCalciteTimePickerElementEventMap>(type: K, listener: (this: HTMLCalciteTimePickerElement, ev: CalciteTimePickerCustomEvent<HTMLCalciteTimePickerElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -8330,10 +8358,18 @@ declare namespace LocalJSX {
           * @deprecated Use the `layout` property on the component's parent instead.
          */
         "layout"?: Extract<"horizontal" | "vertical" | "grid", Layout>;
+        /**
+          * Specifies the component's fallback menu `placement` when it's initial or specified `placement` has insufficient space available.
+         */
+        "menuFlipPlacements"?: FlipPlacement[];
         /**
           * When `true`, the `calcite-action-menu` is open.
          */
         "menuOpen"?: boolean;
+        /**
+          * Determines where the action menu will be positioned.
+         */
+        "menuPlacement"?: LogicalPlacement;
         /**
           * Use this property to override individual strings used by the component.
          */
@@ -8583,6 +8619,14 @@ declare namespace LocalJSX {
           * When `true`, a busy indicator is displayed.
          */
         "loading"?: boolean;
+        /**
+          * Specifies the component's fallback menu `placement` when it's initial or specified `placement` has insufficient space available.
+         */
+        "menuFlipPlacements"?: FlipPlacement[];
+        /**
+          * Determines where the action menu will be positioned.
+         */
+        "menuPlacement"?: LogicalPlacement;
         /**
           * Use this property to override individual strings used by the component.
          */
@@ -11440,6 +11484,10 @@ declare namespace LocalJSX {
           * Used to specify the aria-setsize attribute to define the number of items in the current set of list for accessibility.
          */
         "setSize"?: number;
+        /**
+          * When `true`, the component's content appears inactive.
+         */
+        "unavailable"?: boolean;
         /**
           * The component's value.
          */
@@ -11461,7 +11509,7 @@ declare namespace LocalJSX {
         /**
           * Fires when changes occur in the default slot, notifying parent lists of the changes.
          */
-        "onCalciteInternalListItemGroupDefaultSlotChange"?: (event: CalciteListItemGroupCustomEvent<DragEvent>) => void;
+        "onCalciteInternalListItemGroupDefaultSlotChange"?: (event: CalciteListItemGroupCustomEvent<void>) => void;
     }
     interface CalciteLoader {
         /**
@@ -11996,10 +12044,18 @@ declare namespace LocalJSX {
           * When `true`, a busy indicator is displayed.
          */
         "loading"?: boolean;
+        /**
+          * Specifies the component's fallback menu `placement` when it's initial or specified `placement` has insufficient space available.
+         */
+        "menuFlipPlacements"?: FlipPlacement[];
         /**
           * When `true`, the action menu items in the `header-menu-actions` slot are open.
          */
         "menuOpen"?: boolean;
+        /**
+          * Determines where the action menu will be positioned.
+         */
+        "menuPlacement"?: LogicalPlacement;
         /**
           * Use this property to override individual strings used by the component.
          */
@@ -13813,7 +13869,7 @@ declare namespace LocalJSX {
           * Specifies the Unicode numeral system used by the component for localization.
          */
         "numberingSystem"?: NumberingSystem;
-        "onCalciteInternalTimePickerChange"?: (event: CalciteTimePickerCustomEvent<string>) => void;
+        "onCalciteInternalTimePickerChange"?: (event: CalciteTimePickerCustomEvent<void>) => void;
         /**
           * Specifies the size of the component.
          */

packages/calcite-components/src/components/accordion-item/accordion-item.scss

@@ -3,20 +3,20 @@
  *
  * These properties can be overridden using the component's tag as selector.
  *
- * @prop --calcite-accordion-border-color: [Deprecate] Use --calcite-accordion-item-border-color. Specifies the component's border color.
+ * @prop --calcite-accordion-border-color: [Deprecate] Use `--calcite-accordion-item-border-color`. Specifies the component's border color.
  * @prop --calcite-accordion-item-background-color: Specifies the component's background color.
  * @prop --calcite-accordion-item-border-color: Specifies the component's border color.
  * @prop --calcite-accordion-item-content-space: Specifies the component's padding.
- * @prop --calcite-accordion-item-end-icon-color: Specifies the component's end icon color. Fallback to --calcite-accordion-item-icon-color or current color.
+ * @prop --calcite-accordion-item-end-icon-color: Specifies the component's `iconEnd` color. Fallback to `--calcite-accordion-item-icon-color` or current color.
  * @prop --calcite-accordion-item-expand-icon-color: Specifies the component's expand icon color.
- * @prop --calcite-accordion-item-header-background-color: Specifies the background color of the component's header.
- * @prop --calcite-accordion-item-heading-text-color: Specifies the component's heading text color.
+ * @prop --calcite-accordion-item-header-background-color: Specifies the component's `heading` background color.
+ * @prop --calcite-accordion-item-heading-text-color: Specifies the component's `heading` text color.
  * @prop --calcite-accordion-item-icon-color: Specifies the component's default icon color.
- * @prop --calcite-accordion-item-start-icon-color: Specifies the component's start icon color. Fallback to --calcite-accordion-item-icon-color or current color.
+ * @prop --calcite-accordion-item-start-icon-color: Specifies the component's `iconStart` color. Fallback to `--calcite-accordion-item-icon-color` or current color.
  * @prop --calcite-accordion-item-text-color: Specifies the component's text color.
- * @prop --calcite-accordion-text-color-hover: [Deprecated] Use --calcite-accordion-item-text-color-hover. Specifies the component's main text color on hover.
- * @prop --calcite-accordion-text-color-pressed: [Deprecated] Use --calcite-accordion-item-text-color-press. Specifies the component's main text color when pressed.
- * @prop --calcite-accordion-text-color: [Deprecated] Use --calcite-accordion-item-text-color. Specifies the component's text color.
+ * @prop --calcite-accordion-text-color-hover: [Deprecated] Use `--calcite-accordion-item-text-color-hover`. Specifies the component's main text color on hover.
+ * @prop --calcite-accordion-text-color-pressed: [Deprecated] Use `--calcite-accordion-item-text-color-press`. Specifies the component's main text color when pressed.
+ * @prop --calcite-accordion-text-color: [Deprecated] Use `--calcite-accordion-item-text-color`. Specifies the component's text color.
  */
 
 %icon-position {

packages/calcite-components/src/components/action-bar/action-bar.scss

@@ -3,7 +3,7 @@
  *
  * These properties can be overridden using the component's tag as selector.
  *
- * @prop --calcite-action-bar-expanded-max-width: Specifies the maximum width of the component when it's `layout` is `"vertical"`.
+ * @prop --calcite-action-bar-expanded-max-width: When `layout` is `"vertical"`, specifies the component's maximum width.
  * @prop --calcite-action-bar-items-space: Specifies the space between slotted components in the component.
  */
 

packages/calcite-components/src/components/action-group/action-group.e2e.ts

@@ -1,5 +1,16 @@
 import { newE2EPage } from "@stencil/core/testing";
-import { accessible, defaults, focusable, hidden, renders, slots, t9n, themed } from "../../tests/commonTests";
+import {
+  accessible,
+  defaults,
+  focusable,
+  handlesActionMenuPlacements,
+  hidden,
+  reflects,
+  renders,
+  slots,
+  t9n,
+  themed,
+} from "../../tests/commonTests";
 import { html } from "../../../support/formatting";
 import { CSS, SLOTS } from "./resources";
 
@@ -19,6 +30,23 @@ describe("calcite-action-group", () => {
         propertyName: "overlayPositioning",
         defaultValue: "absolute",
       },
+      {
+        propertyName: "menuPlacement",
+        defaultValue: undefined,
+      },
+      {
+        propertyName: "menuFlipPlacements",
+        defaultValue: undefined,
+      },
+    ]);
+  });
+
+  describe("reflects", () => {
+    reflects("calcite-action-group", [
+      {
+        propertyName: "menuPlacement",
+        value: "bottom",
+      },
     ]);
   });
 
@@ -42,6 +70,15 @@ describe("calcite-action-group", () => {
     slots("calcite-action-group", SLOTS);
   });
 
+  describe("handles action-menu placement and flipPlacements", () => {
+    handlesActionMenuPlacements(html`
+      <calcite-action-group scale="l" overlay-positioning="fixed">
+        <calcite-action id="plus" slot="${SLOTS.menuActions}" text="Add" icon="plus"></calcite-action>
+        <calcite-action id="banana" slot="${SLOTS.menuActions}" text="Banana" icon="banana"></calcite-action>
+      </calcite-action-group>
+    `);
+  });
+
   it("should honor scale of expand icon", async () => {
     const page = await newE2EPage({ html: actionGroupHTML });
     const menu = await page.find(`calcite-action-group >>> calcite-action-menu`);

packages/calcite-components/src/components/action-group/action-group.scss

@@ -4,10 +4,10 @@
  * These properties can be overridden using the component's tag as selector.
  *
  * @prop --calcite-action-background-color: Specifies the component's background color.
- * @prop --calcite-action-group-border-color: Specifies the component's border color when used in a calcite-action-bar or calcite-action-menu.
- * @prop --calcite-action-group-columns: Specifies the component's grid-template-columns when the `layout` property is `"grid"`.
- * @prop --calcite-action-group-gap: Specifies the component's gap  when the `layout` property is `"grid" and padding`.
- * @prop --calcite-action-group-padding: [Deprecated] Use --calcite-action-group-gap. Specifies the component's padding.
+ * @prop --calcite-action-group-border-color: Specifies the component's border color when used in a `calcite-action-bar` or `calcite-action-menu`.
+ * @prop --calcite-action-group-columns: When `layout` is `"grid"`, specifies the component's grid-template-columns.
+ * @prop --calcite-action-group-gap: When `layout` is `"grid"`, specifies the component's gap.
+ * @prop --calcite-action-group-padding: [Deprecated] Use `--calcite-action-group-gap`. Specifies the component's padding.
  *
  */