Merge remote-tracking branch 'origin/main' into jcfranco/switch-from-…

…ts-node-to-tsx

* origin/main:
  chore: release next
  ci(next): install deps before running npm scripts (#8370)
  feat: provide legacy CSS custom props for backwards compatibility (#8355)
  fix(input-date-picker): no longer emits redundant change event (#8341)
  fix(shell-panel): adds border at the start when slotted in `panel-end` (#8314)
  build(deps): update dependency sortablejs to v1.15.1 (#8364)

.github/workflows/deploy-next.yml

@@ -28,12 +28,13 @@ jobs:
           GH_TOKEN_FOR_STORYBOOK: ${{ github.actor }}:${{ secrets.ADMIN_TOKEN }}
         run: |
           if [ "$NEXT_RELEASE_ENABLED" == "true" ]; then
+            npm install
+
             if npm run util:is-next-deployable; then
               git config --global user.email "github-actions[bot]@users.noreply.github.com"
               git config --global user.name "github-actions[bot]"
 
-              npm install
-              # version the packages with lerna before building to ensure 
+              # version the packages with lerna before building to ensure
               # the version in the CC source code preamble is correct for deployment
               npm run version:next
               npm run build

package.json

@@ -53,7 +53,7 @@
     "@types/react-dom": "^16.0.9",
     "@types/semver": "7.5.6",
     "@types/shell-quote": "1.7.5",
-    "@types/sortablejs": "1.15.4",
+    "@types/sortablejs": "1.15.7",
     "@typescript-eslint/eslint-plugin": "6.10.0",
     "@typescript-eslint/parser": "6.10.0",
     "@whitespace/storybook-addon-html": "5.0.0",

packages/calcite-components-angular/projects/component-library/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.1.0-next.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components-angular@2.0.0...@esri/calcite-components-angular@2.1.0-next.0) (2023-12-07)
+
+__Note:__ Version bump only for package @esri/calcite-components-angular
+
 ## [2.0.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components-angular@1.11.0...@esri/calcite-components-angular@2.0.0) (2023-12-02)
 
 ### ⚠ BREAKING CHANGES

packages/calcite-components-angular/projects/component-library/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esri/calcite-components-angular",
-  "version": "2.0.0",
+  "version": "2.1.0-next.0",
   "sideEffects": false,
   "homepage": "https://developers.arcgis.com/calcite-design-system/",
   "description": "A set of Angular components that wrap Esri's Calcite Components.",
@@ -20,7 +20,7 @@
     "@angular/core": ">=16.0.0"
   },
   "dependencies": {
-    "@esri/calcite-components": "^2.0.0",
+    "@esri/calcite-components": "^2.1.0-next.0",
     "tslib": "2.6.2"
   },
   "lerna": {

packages/calcite-components-react/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.1.0-next.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components-react@2.0.0...@esri/calcite-components-react@2.1.0-next.0) (2023-12-07)
+
+__Note:__ Version bump only for package @esri/calcite-components-react
+
 ## [2.0.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components-react@1.11.0...@esri/calcite-components-react@2.0.0) (2023-12-02)
 
 ### ⚠ BREAKING CHANGES

packages/calcite-components-react/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@esri/calcite-components-react",
   "sideEffects": false,
-  "version": "2.0.0",
+  "version": "2.1.0-next.0",
   "homepage": "https://developers.arcgis.com/calcite-design-system/",
   "description": "A set of React components that wrap calcite components",
   "license": "SEE LICENSE.md",
@@ -20,7 +20,7 @@
     "dist/"
   ],
   "dependencies": {
-    "@esri/calcite-components": "^2.0.0"
+    "@esri/calcite-components": "^2.1.0-next.0"
   },
   "peerDependencies": {
     "react": ">=16.7",

packages/calcite-components/CHANGELOG.md

@@ -3,6 +3,21 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.1.0-next.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components@2.0.0...@esri/calcite-components@2.1.0-next.0) (2023-12-07)
+
+### Features
+
+- __dropdown-item:__ add disabled support ([#8312](https://github.com/Esri/calcite-design-system/issues/8312)) ([4c311c6](https://github.com/Esri/calcite-design-system/commit/4c311c646b0a1051ca63f4ca809227a3afb243f9)), closes [#6667](https://github.com/Esri/calcite-design-system/issues/6667)
+- provide legacy CSS custom props for backwards compatibility ([#8355](https://github.com/Esri/calcite-design-system/issues/8355)) ([b0f063e](https://github.com/Esri/calcite-design-system/commit/b0f063e213adaa31bc5fed124b7f29381735ccf5)), closes [#8354](https://github.com/Esri/calcite-design-system/issues/8354)
+
+### Bug Fixes
+
+- __action-menu:__ fix closing action menu after a drag occurs ([#8339](https://github.com/Esri/calcite-design-system/issues/8339)) ([dcb8548](https://github.com/Esri/calcite-design-system/commit/dcb854803f242c5bbe8febdd7138c329f120d890)), closes [#7445](https://github.com/Esri/calcite-design-system/issues/7445)
+- __action-menu:__ Filter hidden or disabled actions via keyboard. ([#8336](https://github.com/Esri/calcite-design-system/issues/8336)) ([11c0007](https://github.com/Esri/calcite-design-system/commit/11c0007b774207c2b862061fc277c64ea513c845)), closes [#8337](https://github.com/Esri/calcite-design-system/issues/8337)
+- __input-date-picker:__ no longer emits redundant change event ([#8341](https://github.com/Esri/calcite-design-system/issues/8341)) ([cd5b92b](https://github.com/Esri/calcite-design-system/commit/cd5b92b8f9a3d2edbca34eb8621bd340c07d23d5)), closes [#7218](https://github.com/Esri/calcite-design-system/issues/7218)
+- __shell-panel:__ adds border at the start when slotted in `panel-end` ([#8314](https://github.com/Esri/calcite-design-system/issues/8314)) ([2d1a1e2](https://github.com/Esri/calcite-design-system/commit/2d1a1e2064e8a8163f03112c28ed6f6b0cdd36e6)), closes [#7929](https://github.com/Esri/calcite-design-system/issues/7929)
+- __shell, shell-panel:__ support resizing shell panel when there is an iframe slotted in shell content ([#8317](https://github.com/Esri/calcite-design-system/issues/8317)) ([e0f69c9](https://github.com/Esri/calcite-design-system/commit/e0f69c91e1304d7c9f6444dbd2189d32a6e69806)), closes [#8156](https://github.com/Esri/calcite-design-system/issues/8156)
+
 ## [2.0.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components@1.11.0...@esri/calcite-components@2.0.0) (2023-12-02)
 
 ### ⚠ BREAKING CHANGES

packages/calcite-components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esri/calcite-components",
-  "version": "2.0.0",
+  "version": "2.1.0-next.0",
   "homepage": "https://developers.arcgis.com/calcite-design-system/",
   "description": "Web Components for Esri's Calcite Design System.",
   "main": "dist/index.cjs.js",
@@ -70,13 +70,13 @@
     "focus-trap": "7.5.4",
     "form-request-submit-polyfill": "2.0.0",
     "lodash-es": "4.17.21",
-    "sortablejs": "1.15.0",
+    "sortablejs": "1.15.1",
     "timezone-groups": "0.8.0"
   },
   "devDependencies": {
-    "@esri/calcite-design-tokens": "2.0.0",
+    "@esri/calcite-design-tokens": "^2.0.1-next.0",
     "@esri/calcite-ui-icons": "3.25.1",
-    "@esri/eslint-plugin-calcite-components": "1.0.0",
+    "@esri/eslint-plugin-calcite-components": "^1.0.1-next.0",
     "@stencil-community/eslint-plugin": "0.7.1",
     "@stencil-community/postcss": "2.2.0",
     "@stencil/angular-output-target": "0.8.3",

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

@@ -0,0 +1,116 @@
+// Map of Calcite Design Tokens to old CalciteComponent Custom Props (from calcite-colors)
+:root {
+  --calcite-ui-brand: var(--calcite-color-brand);
+  --calcite-ui-brand-hover: var(--calcite-color-brand-hover);
+  --calcite-ui-brand-press: var(--calcite-color-brand-press);
+  --calcite-ui-background: var(--calcite-color-background);
+  --calcite-ui-foreground-1: var(--calcite-color-foreground-1);
+  --calcite-ui-foreground-2: var(--calcite-color-foreground-2);
+  --calcite-ui-foreground-3: var(--calcite-color-foreground-3);
+  --calcite-ui-foreground-current: var(--calcite-color-foreground-current);
+  --calcite-ui-focus-offset-invert: var(--calcite-offset-invert-focus);
+  --calcite-semantic-ui-color-foreground-current: var(--calcite-color-foreground-current);
+  --calcite-ui-text-1: var(--calcite-color-text-1);
+  --calcite-ui-text-2: var(--calcite-color-text-2);
+  --calcite-ui-text-3: var(--calcite-color-text-3);
+  --calcite-ui-text-inverse: var(--calcite-color-text-inverse);
+  --calcite-ui-text-link: var(--calcite-color-text-link);
+  --calcite-ui-border-1: var(--calcite-color-border-1);
+  --calcite-ui-border-2: var(--calcite-color-border-2);
+  --calcite-ui-border-3: var(--calcite-color-border-3);
+  --calcite-ui-border-input: var(--calcite-color-border-input);
+  --calcite-ui-info: var(--calcite-color-status-info);
+  --calcite-ui-info-hover: var(--calcite-color-status-info-hover);
+  --calcite-ui-info-press: var(--calcite-color-status-info-press);
+  --calcite-ui-success: var(--calcite-color-status-success);
+  --calcite-ui-success-hover: var(--calcite-color-status-success-hover);
+  --calcite-ui-success-press: var(--calcite-color-status-success-press);
+  --calcite-ui-warning: var(--calcite-color-status-warning);
+  --calcite-ui-warning-hover: var(--calcite-color-status-warning-hover);
+  --calcite-ui-warning-press: var(--calcite-color-status-warning-press);
+  --calcite-ui-danger: var(--calcite-color-status-danger);
+  --calcite-ui-danger-hover: var(--calcite-color-status-danger-hover);
+  --calcite-ui-danger-press: var(--calcite-color-status-danger-press);
+  --calcite-ui-inverse: var(--calcite-color-inverse);
+  --calcite-app-z-index: var(--calcite-z-index);
+  --calcite-app-z-index-tooltip: var(--calcite-z-index-tooltip);
+  --calcite-app-z-index-popup: var(--calcite-z-index-popup);
+  --calcite-app-z-index-modal: var(--calcite-z-index-modal);
+  --calcite-app-z-index-overlay: var(--calcite-z-index-overlay);
+  --calcite-app-z-index-dropdown: var(--calcite-z-index-dropdown);
+  --calcite-app-z-index-toast: var(--calcite-z-index-toast);
+  --calcite-app-z-index-header: var(--calcite-z-index-header);
+  --calcite-app-z-index-sticky: var(--calcite-z-index-sticky);
+  --calcite-app-breakpoint-content-fixed: var(--calcite-container-size-content-fixed);
+  --calcite-app-breakpoint-content-fluid: var(--calcite-container-size-content-fluid);
+  --calcite-app-breakpoint-width-lg: var(--calcite-container-size-width-lg-max);
+  --calcite-app-breakpoint-width-md: var(--calcite-container-size-width-md-max);
+  --calcite-app-breakpoint-width-sm: var(--calcite-container-size-width-sm-max);
+  --calcite-app-breakpoint-width-xs: var(--calcite-container-size-width-xs-max);
+  --calcite-app-breakpoint-width-xxs: var(--calcite-container-size-width-xxs-max);
+  --calcite-app-spacing-11: var(--calcite-spacing-xxxl);
+  --calcite-app-spacing-8: var(--calcite-spacing-xxl);
+  --calcite-app-spacing-7: var(--calcite-spacing-xl);
+  --calcite-app-spacing-6: var(--calcite-spacing-lg);
+  --calcite-app-spacing-5: var(--calcite-spacing-md);
+  --calcite-app-spacing-3: var(--calcite-spacing-sm);
+  --calcite-app-spacing-2: var(--calcite-spacing-xs);
+  --calcite-app-spacing-1: var(--calcite-spacing-xxs);
+  --calcite-app-spacing-0: var(--calcite-spacing-base);
+  --calcite-app-sizing-11: var(--calcite-size-xxxl);
+  --calcite-app-sizing-9: var(--calcite-size-xxl);
+  --calcite-app-sizing-8: var(--calcite-size-xl);
+  --calcite-app-sizing-7: var(--calcite-size-lg);
+  --calcite-app-sizing-6: var(--calcite-size-md-plus);
+  --calcite-app-sizing-5: var(--calcite-size-md);
+  --calcite-app-sizing-4: var(--calcite-size-sm-plus);
+  --calcite-app-sizing-3: var(--calcite-size-sm);
+  --calcite-app-sizing-2: var(--calcite-size-xs);
+  --calcite-app-sizing-1: var(--calcite-size-xxs);
+  --calcite-app-sizing-0: var(--calcite-size-xxxs);
+  --calcite-app-opacity-100: var(--calcite-app-opacity-full);
+  --calcite-app-opacity-85: var(--calcite-app-opacity-dark);
+  --calcite-app-opacity-50: var(--calcite-app-opacity-half);
+  --calcite-app-opacity-40: var(--calcite-app-opacity-light);
+  --calcite-app-border-width-none: var(--calcite-border-width-none);
+  --calcite-app-border-width-2: var(--calcite-border-width-lg);
+  --calcite-app-border-width-1: var(--calcite-border-width-md);
+  --calcite-app-border-width-0: var(--calcite-border-width-sm);
+  --calcite-app-border-radius-full: var(--calcite-corner-radius-pill);
+  --calcite-app-border-radius-none: var(--calcite-corner-radius-sharp);
+  --calcite-app-border-radius-1: var(--calcite-corner-radius-round);
+  --calcite-app-border-radius-0: var(--calcite-corner-radius-0);
+  --calcite-app-font-text-case-capitalize: var(--calcite-font-text-case-capitalize);
+  --calcite-app-font-text-case-lowercase: var(--calcite-font-text-case-lowercase);
+  --calcite-app-font-text-case-uppercase: var(--calcite-font-text-case-uppercase);
+  --calcite-app-font-text-case-none: var(--calcite-font-text-case-none);
+  --calcite-app-font-text-decoration-underline: var(--calcite-font-text-decoration-underline);
+  --calcite-app-font-text-decoration-none: var(--calcite-font-text-decoration-none);
+  --calcite-app-font-paragraph-spacing-normal: var(--calcite-font-paragraph-spacing-normal);
+  --calcite-app-font-letter-spacing-wide: var(--calcite-font-letter-spacing-wide);
+  --calcite-app-font-letter-spacing-normal: var(--calcite-font-letter-spacing-normal);
+  --calcite-app-font-letter-spacing-tight: var(--calcite-font-letter-spacing-tight);
+  --calcite-app-font-size-6: var(--calcite-font-size-xxl);
+  --calcite-app-font-size-5: var(--calcite-font-size-xl);
+  --calcite-app-font-size-4: var(--calcite-font-size-lg);
+  --calcite-app-font-size-3: var(--calcite-font-size-md);
+  --calcite-app-font-size-2: var(--calcite-font-size);
+  --calcite-app-font-size-1: var(--calcite-font-size-sm);
+  --calcite-app-font-size-0: var(--calcite-font-size-xs);
+  --calcite-app-font-line-height-relative-loose: var(--calcite-font-line-height-relative-loose);
+  --calcite-app-font-line-height-relative-relaxed: var(--calcite-font-line-height-relative-relaxed);
+  --calcite-app-font-line-height-relative-normal: var(--calcite-font-line-height-relative-normal);
+  --calcite-app-font-line-height-relative-snug: var(--calcite-font-line-height-relative-snug);
+  --calcite-app-font-line-height-relative-tight: var(--calcite-font-line-height-relative-tight);
+  --calcite-app-font-line-height-relative: var(--calcite-font-line-height-relative);
+  --calcite-app-font-line-height-fixed-3: var(--calcite-font-line-height-fixed-xl);
+  --calcite-app-font-line-height-fixed-2: var(--calcite-font-line-height-fixed-lg);
+  --calcite-app-font-line-height-fixed: var(--calcite-font-line-height-fixed-sm);
+  --calcite-app-font-weight-bold: var(--calcite-font-weight-bold);
+  --calcite-app-font-weight-demi: var(--calcite-font-weight-semibold);
+  --calcite-app-font-weight-medium: var(--calcite-font-weight-medium);
+  --calcite-app-font-weight-regular: var(--calcite-font-weight-regular);
+  --calcite-app-font-weight-light: var(--calcite-font-weight-light);
+  --calcite-app-font-family-code: var(--calcite-font-family-code);
+  --calcite-app-font-family-primary: var(--calcite-font-family-primary);
+}

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

@@ -8,6 +8,9 @@
 // Add Calcite Design Tokens as CSS Custom Props
 @import url("~@esri/calcite-design-tokens/dist/css/index.css");
 
+// Include legacy tokens for backwards compatibility
+@import "./legacy";
+
 :root {
   @extend %type-vars;
   @include floating-ui-base();