@cloudscape-design/components-themeable 3.0.725 → 3.0.727

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "538c9067306049643a5c8b55157a0db6b8c87d01"
+  "commit": "27a5608893d2fcaeb8b3d3c8dac0f1d9b9913bab"
 }

package/lib/internal/scss/app-layout/visual-refresh-toolbar/skeleton/styles.scss

@@ -13,6 +13,12 @@
   }
 }
 
+@mixin mobile-only {
+  @include styles.media-breakpoint-down(styles.$breakpoint-x-small) {
+    @content;
+  }
+}
+
 .root {
   @include styles.styles-reset;
   color: awsui.$color-text-body-default;
@@ -152,8 +158,7 @@
 
 /* stylelint-disable-next-line selector-combinator-disallowed-list, selector-max-universal */
 .unfocusable-mobile * {
-  visibility: hidden;
-  @include desktop-only {
-    visibility: visible;
+  @include mobile-only {
+    visibility: hidden;
   }
 }

package/lib/internal/scss/property-filter/styles.scss

@@ -6,6 +6,8 @@
 @use '../internal/styles/index' as styles;
 @use '../internal/styles/tokens' as awsui;
 
+$operator-field-width: 120px;
+
 .root {
   @include styles.styles-reset;
 }
@@ -83,6 +85,91 @@
   }
 }
 
+.token-editor-grouped {
+  display: flex;
+  flex-direction: column;
+  gap: awsui.$space-s;
+  user-select: text;
+  margin-block: awsui.$space-xxs;
+  margin-inline: awsui.$space-xxs;
+
+  &-form {
+    margin-block-end: awsui.$space-scaled-l;
+  }
+
+  &-field-property {
+    flex-grow: 2;
+  }
+
+  &-field-operator {
+    flex-grow: 1;
+  }
+
+  &-field-value {
+    flex-grow: 2;
+  }
+
+  &-cancel {
+    margin-inline-end: awsui.$space-xs;
+  }
+
+  &-submit {
+    /* used in test-utils */
+  }
+
+  &-actions {
+    display: flex;
+    justify-content: flex-end;
+    padding-block-start: awsui.$space-s;
+    border-block-start: 1px solid #{awsui.$color-border-dropdown-item-default};
+
+    // The below code cancels horizontal padding of the popover and horizontal margin of the token-editor.
+    padding-inline-end: calc(#{awsui.$space-m} + #{awsui.$space-xxs});
+    margin-inline: calc(-1 * #{awsui.$space-m} + -1 * #{awsui.$space-xxs});
+    margin-block-start: awsui.$space-s;
+  }
+
+  &-grid {
+    @include styles.styles-reset;
+
+    display: grid;
+    gap: awsui.$space-s;
+    grid-template-columns: 2fr $operator-field-width 3fr min-content;
+
+    &-group {
+      display: contents;
+    }
+
+    &.token-editor-narrow {
+      grid-template-columns: 1fr;
+      gap: awsui.$space-m;
+
+      > .token-editor-grouped-group {
+        display: flex;
+        flex-direction: column;
+        gap: awsui.$space-s;
+      }
+    }
+
+    &-header {
+      color: awsui.$color-text-column-header;
+      font-weight: awsui.$font-weight-heading-s;
+      padding-block: awsui.$space-scaled-xxs;
+      text-align: start;
+    }
+
+    &-cell {
+      display: flex;
+      align-items: flex-end;
+      justify-content: flex-end;
+    }
+  }
+
+  &-add-token {
+    margin-block-start: awsui.$space-s;
+  }
+}
+
 .property-editor {
   padding-block: awsui.$space-m;
   padding-inline: awsui.$space-m;

package/lib/internal/scss/property-filter/test-classes/styles.scss

@@ -6,27 +6,35 @@
 .filtering-token {
   /* used in test-utils */
 }
+
 .filtering-token-dismiss-button {
   /* used in test-utils */
 }
+
 .filtering-token-select {
   /* used in test-utils */
 }
+
 .filtering-token-content {
   /* used in test-utils */
 }
+
 .filtering-token-inner {
   /* used in test-utils */
 }
+
 .filtering-token-inner-dismiss-button {
   /* used in test-utils */
 }
+
 .filtering-token-inner-select {
   /* used in test-utils */
 }
+
 .filtering-token-inner-content {
   /* used in test-utils */
 }
+
 .filtering-token-edit-button {
   /* used in test-utils */
 }
@@ -34,15 +42,27 @@
 .token-editor-field-property {
   /* used in test-utils */
 }
+
 .token-editor-field-operator {
   /* used in test-utils */
 }
+
 .token-editor-field-value {
   /* used in test-utils */
 }
+
+.token-editor-token-remove-actions {
+  /* used in test-utils */
+}
+
+.token-editor-token-add-actions {
+  /* used in test-utils */
+}
+
 .token-editor-cancel {
   /* used in test-utils */
 }
+
 .token-editor-submit {
   /* used in test-utils */
 }

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.css.js

@@ -1,21 +1,21 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_7nfqu_18aiq_101",
-  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_18aiq_150",
-  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_18aiq_165",
-  "navigation": "awsui_navigation_7nfqu_18aiq_180",
-  "tools": "awsui_tools_7nfqu_18aiq_181",
-  "split-panel-side": "awsui_split-panel-side_7nfqu_18aiq_205",
-  "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_18aiq_211",
-  "panel-hidden": "awsui_panel-hidden_7nfqu_18aiq_224",
-  "toolbar-container": "awsui_toolbar-container_7nfqu_18aiq_228",
-  "notifications-container": "awsui_notifications-container_7nfqu_18aiq_234",
-  "main-landmark": "awsui_main-landmark_7nfqu_18aiq_241",
-  "main": "awsui_main_7nfqu_18aiq_241",
-  "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_18aiq_250",
-  "content-header": "awsui_content-header_7nfqu_18aiq_260",
-  "content": "awsui_content_7nfqu_18aiq_260",
-  "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_18aiq_269"
+  "root": "awsui_root_7nfqu_l0bvq_101",
+  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_l0bvq_150",
+  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_l0bvq_165",
+  "navigation": "awsui_navigation_7nfqu_l0bvq_180",
+  "tools": "awsui_tools_7nfqu_l0bvq_181",
+  "split-panel-side": "awsui_split-panel-side_7nfqu_l0bvq_205",
+  "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_l0bvq_211",
+  "panel-hidden": "awsui_panel-hidden_7nfqu_l0bvq_224",
+  "toolbar-container": "awsui_toolbar-container_7nfqu_l0bvq_228",
+  "notifications-container": "awsui_notifications-container_7nfqu_l0bvq_234",
+  "main-landmark": "awsui_main-landmark_7nfqu_l0bvq_241",
+  "main": "awsui_main_7nfqu_l0bvq_241",
+  "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_l0bvq_250",
+  "content-header": "awsui_content-header_7nfqu_l0bvq_260",
+  "content": "awsui_content_7nfqu_l0bvq_260",
+  "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_l0bvq_270"
 };
   

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css

@@ -98,7 +98,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_root_7nfqu_18aiq_101:not(#\9) {
+.awsui_root_7nfqu_l0bvq_101:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -141,45 +141,45 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   grid-template-rows: min-content min-content 1fr;
 }
 @media (min-width: 689px) {
-  .awsui_root_7nfqu_18aiq_101:not(#\9) {
+  .awsui_root_7nfqu_l0bvq_101:not(#\9) {
     grid-template-areas: "navigation toolbar      toolbar       toolbar   toolbar         tools" "navigation .         notifications    .         sideSplitPanel  tools" "navigation .             main         .         sideSplitPanel  tools";
     grid-template-columns: min-content minmax(var(--space-layout-content-horizontal-sin989, 40px), 1fr) minmax(0, var(--awsui-max-content-width-g964ok)) minmax(var(--space-layout-content-horizontal-sin989, 40px), 1fr) min-content min-content;
     grid-template-rows: min-content min-content 1fr min-content;
   }
 }
 @media (min-width: 689px) and (min-width: 1401px) {
-  .awsui_root_7nfqu_18aiq_101.awsui_has-adaptive-widths-default_7nfqu_18aiq_150:not(#\9) {
+  .awsui_root_7nfqu_l0bvq_101.awsui_has-adaptive-widths-default_7nfqu_l0bvq_150:not(#\9) {
     --awsui-max-content-width-g964ok: 1280px;
   }
 }
 @media (min-width: 689px) and (min-width: 1921px) {
-  .awsui_root_7nfqu_18aiq_101.awsui_has-adaptive-widths-default_7nfqu_18aiq_150:not(#\9) {
+  .awsui_root_7nfqu_l0bvq_101.awsui_has-adaptive-widths-default_7nfqu_l0bvq_150:not(#\9) {
     --awsui-max-content-width-g964ok: 1440px;
   }
 }
 @media (min-width: 689px) and (min-width: 2541px) {
-  .awsui_root_7nfqu_18aiq_101.awsui_has-adaptive-widths-default_7nfqu_18aiq_150:not(#\9) {
+  .awsui_root_7nfqu_l0bvq_101.awsui_has-adaptive-widths-default_7nfqu_l0bvq_150:not(#\9) {
     --awsui-max-content-width-g964ok: 1620px;
   }
 }
 @media (min-width: 689px) and (min-width: 1401px) {
-  .awsui_root_7nfqu_18aiq_101.awsui_has-adaptive-widths-dashboard_7nfqu_18aiq_165:not(#\9) {
+  .awsui_root_7nfqu_l0bvq_101.awsui_has-adaptive-widths-dashboard_7nfqu_l0bvq_165:not(#\9) {
     --awsui-max-content-width-g964ok: 1280px;
   }
 }
 @media (min-width: 689px) and (min-width: 1921px) {
-  .awsui_root_7nfqu_18aiq_101.awsui_has-adaptive-widths-dashboard_7nfqu_18aiq_165:not(#\9) {
+  .awsui_root_7nfqu_l0bvq_101.awsui_has-adaptive-widths-dashboard_7nfqu_l0bvq_165:not(#\9) {
     --awsui-max-content-width-g964ok: 1620px;
   }
 }
 @media (min-width: 689px) and (min-width: 2541px) {
-  .awsui_root_7nfqu_18aiq_101.awsui_has-adaptive-widths-dashboard_7nfqu_18aiq_165:not(#\9) {
+  .awsui_root_7nfqu_l0bvq_101.awsui_has-adaptive-widths-dashboard_7nfqu_l0bvq_165:not(#\9) {
     --awsui-max-content-width-g964ok: 2160px;
   }
 }
 
-.awsui_navigation_7nfqu_18aiq_180:not(#\9),
-.awsui_tools_7nfqu_18aiq_181:not(#\9) {
+.awsui_navigation_7nfqu_l0bvq_180:not(#\9),
+.awsui_tools_7nfqu_l0bvq_181:not(#\9) {
   grid-row: 1/-1;
   grid-column: 1/-1;
   background: var(--color-background-container-content-il2pe5, #ffffff);
@@ -187,7 +187,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
 }
 
 @media (min-width: 689px) {
-  .awsui_navigation_7nfqu_18aiq_180:not(#\9) {
+  .awsui_navigation_7nfqu_l0bvq_180:not(#\9) {
     grid-area: navigation;
     inline-size: var(--awsui-navigation-width-g964ok);
     border-inline-end: 1px solid var(--color-border-divider-panel-side-btgups, transparent);
@@ -195,7 +195,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
 }
 
 @media (min-width: 689px) {
-  .awsui_tools_7nfqu_18aiq_181:not(#\9) {
+  .awsui_tools_7nfqu_l0bvq_181:not(#\9) {
     grid-area: tools;
     inline-size: var(--awsui-tools-width-g964ok);
     border-inline-start: 1px solid var(--color-border-divider-panel-side-btgups, transparent);
@@ -203,13 +203,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
 }
 
 @media (min-width: 689px) {
-  .awsui_split-panel-side_7nfqu_18aiq_205:not(#\9) {
+  .awsui_split-panel-side_7nfqu_l0bvq_205:not(#\9) {
     grid-area: sideSplitPanel;
     border-inline-start: 1px solid var(--color-border-divider-panel-side-btgups, transparent);
   }
 }
 
-.awsui_split-panel-bottom_7nfqu_18aiq_211:not(#\9) {
+.awsui_split-panel-bottom_7nfqu_l0bvq_211:not(#\9) {
   position: sticky;
   z-index: 840;
   align-self: end;
@@ -217,61 +217,58 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   grid-column: 1/-1;
 }
 @media (min-width: 689px) {
-  .awsui_split-panel-bottom_7nfqu_18aiq_211:not(#\9) {
+  .awsui_split-panel-bottom_7nfqu_l0bvq_211:not(#\9) {
     grid-column: 2/span 3;
   }
 }
 
-.awsui_panel-hidden_7nfqu_18aiq_224:not(#\9) {
+.awsui_panel-hidden_7nfqu_l0bvq_224:not(#\9) {
   display: none;
 }
 
-.awsui_toolbar-container_7nfqu_18aiq_228:not(#\9) {
+.awsui_toolbar-container_7nfqu_l0bvq_228:not(#\9) {
   grid-area: toolbar;
   block-size: 48px;
   border-block-end: 1px solid var(--color-border-divider-panel-bottom-sc2k0v, rgba(0, 28, 36, 0.15));
 }
 
-.awsui_notifications-container_7nfqu_18aiq_234:not(#\9) {
+.awsui_notifications-container_7nfqu_l0bvq_234:not(#\9) {
   grid-area: notifications;
 }
-.awsui_notifications-container_7nfqu_18aiq_234:not(#\9):not(:empty) {
+.awsui_notifications-container_7nfqu_l0bvq_234:not(#\9):not(:empty) {
   padding-block-start: var(--space-scaled-xs-x91h81, 8px);
 }
 
-.awsui_main-landmark_7nfqu_18aiq_241:not(#\9) {
+.awsui_main-landmark_7nfqu_l0bvq_241:not(#\9) {
   display: contents;
 }
 
-.awsui_main_7nfqu_18aiq_241:not(#\9) {
+.awsui_main_7nfqu_l0bvq_241:not(#\9) {
   grid-area: main;
   margin-block-start: var(--space-scaled-s-9q8n2q, 12px);
   margin-block-end: var(--space-layout-content-bottom-ve4osc, 20px);
 }
-.awsui_main-disable-paddings_7nfqu_18aiq_250:not(#\9) {
+.awsui_main-disable-paddings_7nfqu_l0bvq_250:not(#\9) {
   grid-column: 1/-1;
   margin-block: 0;
 }
 @media (min-width: 689px) {
-  .awsui_main-disable-paddings_7nfqu_18aiq_250:not(#\9) {
+  .awsui_main-disable-paddings_7nfqu_l0bvq_250:not(#\9) {
     grid-column: 2/span 3;
   }
 }
 
-.awsui_content-header_7nfqu_18aiq_260:not(#\9) {
+.awsui_content-header_7nfqu_l0bvq_260:not(#\9) {
   margin-block-end: var(--space-content-header-padding-bottom-d3iv03, 16px);
 }
 
-.awsui_content_7nfqu_18aiq_260:not(#\9) {
+.awsui_content_7nfqu_l0bvq_260:not(#\9) {
   display: contents;
 }
 
 /* stylelint-disable-next-line selector-combinator-disallowed-list, selector-max-universal */
-.awsui_unfocusable-mobile_7nfqu_18aiq_269 *:not(#\9) {
-  visibility: hidden;
-}
-@media (min-width: 689px) {
-  .awsui_unfocusable-mobile_7nfqu_18aiq_269 *:not(#\9) {
-    visibility: visible;
+@media (max-width: 688px) {
+  .awsui_unfocusable-mobile_7nfqu_l0bvq_270 *:not(#\9) {
+    visibility: hidden;
   }
 }

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js

@@ -2,21 +2,21 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_7nfqu_18aiq_101",
-  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_18aiq_150",
-  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_18aiq_165",
-  "navigation": "awsui_navigation_7nfqu_18aiq_180",
-  "tools": "awsui_tools_7nfqu_18aiq_181",
-  "split-panel-side": "awsui_split-panel-side_7nfqu_18aiq_205",
-  "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_18aiq_211",
-  "panel-hidden": "awsui_panel-hidden_7nfqu_18aiq_224",
-  "toolbar-container": "awsui_toolbar-container_7nfqu_18aiq_228",
-  "notifications-container": "awsui_notifications-container_7nfqu_18aiq_234",
-  "main-landmark": "awsui_main-landmark_7nfqu_18aiq_241",
-  "main": "awsui_main_7nfqu_18aiq_241",
-  "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_18aiq_250",
-  "content-header": "awsui_content-header_7nfqu_18aiq_260",
-  "content": "awsui_content_7nfqu_18aiq_260",
-  "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_18aiq_269"
+  "root": "awsui_root_7nfqu_l0bvq_101",
+  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_l0bvq_150",
+  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_l0bvq_165",
+  "navigation": "awsui_navigation_7nfqu_l0bvq_180",
+  "tools": "awsui_tools_7nfqu_l0bvq_181",
+  "split-panel-side": "awsui_split-panel-side_7nfqu_l0bvq_205",
+  "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_l0bvq_211",
+  "panel-hidden": "awsui_panel-hidden_7nfqu_l0bvq_224",
+  "toolbar-container": "awsui_toolbar-container_7nfqu_l0bvq_228",
+  "notifications-container": "awsui_notifications-container_7nfqu_l0bvq_234",
+  "main-landmark": "awsui_main-landmark_7nfqu_l0bvq_241",
+  "main": "awsui_main_7nfqu_l0bvq_241",
+  "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_l0bvq_250",
+  "content-header": "awsui_content-header_7nfqu_l0bvq_260",
+  "content": "awsui_content_7nfqu_l0bvq_260",
+  "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_l0bvq_270"
 };
   

package/lib/internal/template/autosuggest/options-controller.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"options-controller.d.ts","sourceRoot":"","sources":["../../../src/autosuggest/options-controller.ts"],"names":[],"mappings":"AASA,OAAO,EACL,yBAAyB,EACzB,sBAAsB,EAEvB,MAAM,gEAAgE,CAAC;AACxE,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAGjE,KAAK,OAAO,GAAG,gBAAgB,CAAC,OAAO,CAAC;AAExC,MAAM,WAAW,wBAAwB;IACvC,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,gBAAgB,CAAC,aAAa,CAAC;IAC9C,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC;IACrD,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,YAAY,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;CACjD;AAED,MAAM,WAAW,qBAAsB,SAAQ,sBAAsB,CAAC,eAAe,CAAC;IACpF,KAAK,EAAE,SAAS,eAAe,EAAE,CAAC;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,SAAS,GAAG,gBAAgB,CAAC,WAAW,CAAC;CACnF;AAED,MAAM,WAAW,wBAAyB,SAAQ,yBAAyB,CAAC,eAAe,CAAC;IAC1F,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC;IACjC,mCAAmC,IAAI,OAAO,CAAC;IAC/C,+BAA+B,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrD,4BAA4B,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACnD;AAQD,eAAO,MAAM,mBAAmB,+GAQ7B,wBAAwB,KAAG,CAAC,qBAAqB,EAAE,wBAAwB,CA8D7E,CAAC"}
+{"version":3,"file":"options-controller.d.ts","sourceRoot":"","sources":["../../../src/autosuggest/options-controller.ts"],"names":[],"mappings":"AASA,OAAO,EACL,yBAAyB,EACzB,sBAAsB,EAEvB,MAAM,gEAAgE,CAAC;AACxE,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAGjE,KAAK,OAAO,GAAG,gBAAgB,CAAC,OAAO,CAAC;AAExC,MAAM,WAAW,wBAAwB;IACvC,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,gBAAgB,CAAC,aAAa,CAAC;IAC9C,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC;IACrD,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,YAAY,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;CACjD;AAED,MAAM,WAAW,qBAAsB,SAAQ,sBAAsB,CAAC,eAAe,CAAC;IACpF,KAAK,EAAE,SAAS,eAAe,EAAE,CAAC;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,SAAS,GAAG,gBAAgB,CAAC,WAAW,CAAC;CACnF;AAED,MAAM,WAAW,wBAAyB,SAAQ,yBAAyB,CAAC,eAAe,CAAC;IAC1F,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC;IACjC,mCAAmC,IAAI,OAAO,CAAC;IAC/C,+BAA+B,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrD,4BAA4B,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACnD;AAQD,eAAO,MAAM,mBAAmB,+GAQ7B,wBAAwB,KAAG,CAAC,qBAAqB,EAAE,wBAAwB,CAsE7E,CAAC"}

package/lib/internal/template/autosuggest/options-controller.js

@@ -37,11 +37,18 @@ export const useAutosuggestItems = ({ options, filterValue, filterText, filterin
         isHighlightable,
     });
     const selectHighlightedOptionWithKeyboard = () => {
-        if (highlightedOptionState.highlightedOption && isInteractive(highlightedOptionState.highlightedOption)) {
-            onSelectItem(highlightedOptionState.highlightedOption);
-            return true;
+        var _a;
+        if (highlightedOptionState.highlightedOption && !isInteractive(highlightedOptionState.highlightedOption)) {
+            // skip selection when a non-interactive item is active
+            return false;
         }
-        return false;
+        onSelectItem((_a = highlightedOptionState.highlightedOption) !== null && _a !== void 0 ? _a : {
+            // put use-entered item as a fallback
+            value: filterValue,
+            type: 'use-entered',
+            option: { value: filterValue },
+        });
+        return true;
     };
     const highlightVisibleOptionWithMouse = (index) => {
         if (filteredItems[index] && isHighlightable(filteredItems[index])) {

package/lib/internal/template/autosuggest/options-controller.js.map

@@ -1 +1 @@
-{"version":3,"file":"options-controller.js","sourceRoot":"","sources":["../../../src/autosuggest/options-controller.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useMemo, useState } from 'react';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { generateTestIndexes } from '../internal/components/options-list/utils/test-indexes';\nimport {\n  HighlightedOptionHandlers,\n  HighlightedOptionState,\n  useHighlightedOption,\n} from '../internal/components/options-list/utils/use-highlight-option';\nimport { AutosuggestItem, AutosuggestProps } from './interfaces';\nimport { filterOptions } from './utils/utils';\n\ntype Options = AutosuggestProps.Options;\n\nexport interface UseAutosuggestItemsProps {\n  options: Options;\n  filterValue: string;\n  filterText: string;\n  filteringType: AutosuggestProps.FilteringType;\n  enteredTextLabel?: AutosuggestProps.EnteredTextLabel;\n  hideEnteredTextLabel?: boolean;\n  onSelectItem: (option: AutosuggestItem) => void;\n}\n\nexport interface AutosuggestItemsState extends HighlightedOptionState<AutosuggestItem> {\n  items: readonly AutosuggestItem[];\n  showAll: boolean;\n  getItemGroup: (item: AutosuggestItem) => undefined | AutosuggestProps.OptionGroup;\n}\n\nexport interface AutosuggestItemsHandlers extends HighlightedOptionHandlers<AutosuggestItem> {\n  setShowAll(value: boolean): void;\n  selectHighlightedOptionWithKeyboard(): boolean;\n  highlightVisibleOptionWithMouse(index: number): void;\n  selectVisibleOptionWithMouse(index: number): void;\n}\n\nconst isHighlightable = (option?: AutosuggestItem) => {\n  return !!option && option.type !== 'parent';\n};\n\nconst isInteractive = (option?: AutosuggestItem) => !!option && !option.disabled && option.type !== 'parent';\n\nexport const useAutosuggestItems = ({\n  options,\n  filterValue,\n  filterText,\n  filteringType,\n  enteredTextLabel,\n  hideEnteredTextLabel,\n  onSelectItem,\n}: UseAutosuggestItemsProps): [AutosuggestItemsState, AutosuggestItemsHandlers] => {\n  const i18n = useInternalI18n('autosuggest');\n  const [showAll, setShowAll] = useState(false);\n\n  const { items, getItemGroup, getItemParent } = useMemo(() => createItems(options), [options]);\n\n  const enteredItemLabel = i18n('enteredTextLabel', enteredTextLabel?.(filterValue), format =>\n    format({ value: filterValue })\n  );\n  if (!enteredItemLabel) {\n    warnOnce('Autosuggest', 'A value for enteredTextLabel must be provided.');\n  }\n\n  const filteredItems = useMemo(() => {\n    const filteredItems = filteringType === 'auto' && !showAll ? filterOptions(items, filterText) : [...items];\n    if (filterValue && !hideEnteredTextLabel) {\n      filteredItems.unshift({\n        value: filterValue,\n        type: 'use-entered',\n        label: enteredItemLabel,\n        option: { value: filterValue },\n      });\n    }\n    generateTestIndexes(filteredItems, getItemParent);\n    return filteredItems;\n  }, [filteringType, showAll, items, filterText, filterValue, hideEnteredTextLabel, getItemParent, enteredItemLabel]);\n\n  const [highlightedOptionState, highlightedOptionHandlers] = useHighlightedOption({\n    options: filteredItems,\n    isHighlightable,\n  });\n\n  const selectHighlightedOptionWithKeyboard = () => {\n    if (highlightedOptionState.highlightedOption && isInteractive(highlightedOptionState.highlightedOption)) {\n      onSelectItem(highlightedOptionState.highlightedOption);\n      return true;\n    }\n    return false;\n  };\n\n  const highlightVisibleOptionWithMouse = (index: number) => {\n    if (filteredItems[index] && isHighlightable(filteredItems[index])) {\n      highlightedOptionHandlers.setHighlightedIndexWithMouse(index);\n    }\n  };\n\n  const selectVisibleOptionWithMouse = (index: number) => {\n    if (filteredItems[index] && isInteractive(filteredItems[index])) {\n      onSelectItem(filteredItems[index]);\n    }\n  };\n\n  return [\n    { ...highlightedOptionState, items: filteredItems, showAll, getItemGroup },\n    {\n      ...highlightedOptionHandlers,\n      setShowAll,\n      selectHighlightedOptionWithKeyboard,\n      highlightVisibleOptionWithMouse,\n      selectVisibleOptionWithMouse,\n    },\n  ];\n};\n\nfunction createItems(options: Options) {\n  const items: AutosuggestItem[] = [];\n  const itemToGroup = new WeakMap<AutosuggestItem, AutosuggestItem>();\n  const getItemParent = (item: AutosuggestItem) => itemToGroup.get(item);\n  const getItemGroup = (item: AutosuggestItem) => getItemParent(item)?.option as AutosuggestProps.OptionGroup;\n\n  for (const option of options) {\n    if (isGroup(option)) {\n      for (const item of flattenGroup(option)) {\n        items.push(item);\n      }\n    } else {\n      items.push({ ...option, option });\n    }\n  }\n\n  function flattenGroup(group: AutosuggestProps.OptionGroup) {\n    const { options, ...rest } = group;\n\n    let hasOnlyDisabledChildren = true;\n\n    const groupItem: AutosuggestItem = { ...rest, type: 'parent', option: group };\n\n    const items: AutosuggestItem[] = [groupItem];\n\n    for (const option of options) {\n      if (!option.disabled) {\n        hasOnlyDisabledChildren = false;\n      }\n\n      const childOption: AutosuggestItem = {\n        ...option,\n        type: 'child',\n        disabled: option.disabled || rest.disabled,\n        option,\n      };\n\n      items.push(childOption);\n\n      itemToGroup.set(childOption, groupItem);\n    }\n\n    items[0].disabled = items[0].disabled || hasOnlyDisabledChildren;\n\n    return items;\n  }\n\n  return { items, getItemGroup, getItemParent };\n}\n\nfunction isGroup(optionOrGroup: AutosuggestProps.Option): optionOrGroup is AutosuggestProps.OptionGroup {\n  return 'options' in optionOrGroup;\n}\n"]}
+{"version":3,"file":"options-controller.js","sourceRoot":"","sources":["../../../src/autosuggest/options-controller.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useMemo, useState } from 'react';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { generateTestIndexes } from '../internal/components/options-list/utils/test-indexes';\nimport {\n  HighlightedOptionHandlers,\n  HighlightedOptionState,\n  useHighlightedOption,\n} from '../internal/components/options-list/utils/use-highlight-option';\nimport { AutosuggestItem, AutosuggestProps } from './interfaces';\nimport { filterOptions } from './utils/utils';\n\ntype Options = AutosuggestProps.Options;\n\nexport interface UseAutosuggestItemsProps {\n  options: Options;\n  filterValue: string;\n  filterText: string;\n  filteringType: AutosuggestProps.FilteringType;\n  enteredTextLabel?: AutosuggestProps.EnteredTextLabel;\n  hideEnteredTextLabel?: boolean;\n  onSelectItem: (option: AutosuggestItem) => void;\n}\n\nexport interface AutosuggestItemsState extends HighlightedOptionState<AutosuggestItem> {\n  items: readonly AutosuggestItem[];\n  showAll: boolean;\n  getItemGroup: (item: AutosuggestItem) => undefined | AutosuggestProps.OptionGroup;\n}\n\nexport interface AutosuggestItemsHandlers extends HighlightedOptionHandlers<AutosuggestItem> {\n  setShowAll(value: boolean): void;\n  selectHighlightedOptionWithKeyboard(): boolean;\n  highlightVisibleOptionWithMouse(index: number): void;\n  selectVisibleOptionWithMouse(index: number): void;\n}\n\nconst isHighlightable = (option?: AutosuggestItem) => {\n  return !!option && option.type !== 'parent';\n};\n\nconst isInteractive = (option?: AutosuggestItem) => !!option && !option.disabled && option.type !== 'parent';\n\nexport const useAutosuggestItems = ({\n  options,\n  filterValue,\n  filterText,\n  filteringType,\n  enteredTextLabel,\n  hideEnteredTextLabel,\n  onSelectItem,\n}: UseAutosuggestItemsProps): [AutosuggestItemsState, AutosuggestItemsHandlers] => {\n  const i18n = useInternalI18n('autosuggest');\n  const [showAll, setShowAll] = useState(false);\n\n  const { items, getItemGroup, getItemParent } = useMemo(() => createItems(options), [options]);\n\n  const enteredItemLabel = i18n('enteredTextLabel', enteredTextLabel?.(filterValue), format =>\n    format({ value: filterValue })\n  );\n  if (!enteredItemLabel) {\n    warnOnce('Autosuggest', 'A value for enteredTextLabel must be provided.');\n  }\n\n  const filteredItems = useMemo(() => {\n    const filteredItems = filteringType === 'auto' && !showAll ? filterOptions(items, filterText) : [...items];\n    if (filterValue && !hideEnteredTextLabel) {\n      filteredItems.unshift({\n        value: filterValue,\n        type: 'use-entered',\n        label: enteredItemLabel,\n        option: { value: filterValue },\n      });\n    }\n    generateTestIndexes(filteredItems, getItemParent);\n    return filteredItems;\n  }, [filteringType, showAll, items, filterText, filterValue, hideEnteredTextLabel, getItemParent, enteredItemLabel]);\n\n  const [highlightedOptionState, highlightedOptionHandlers] = useHighlightedOption({\n    options: filteredItems,\n    isHighlightable,\n  });\n\n  const selectHighlightedOptionWithKeyboard = () => {\n    if (highlightedOptionState.highlightedOption && !isInteractive(highlightedOptionState.highlightedOption)) {\n      // skip selection when a non-interactive item is active\n      return false;\n    }\n    onSelectItem(\n      highlightedOptionState.highlightedOption ?? {\n        // put use-entered item as a fallback\n        value: filterValue,\n        type: 'use-entered',\n        option: { value: filterValue },\n      }\n    );\n    return true;\n  };\n\n  const highlightVisibleOptionWithMouse = (index: number) => {\n    if (filteredItems[index] && isHighlightable(filteredItems[index])) {\n      highlightedOptionHandlers.setHighlightedIndexWithMouse(index);\n    }\n  };\n\n  const selectVisibleOptionWithMouse = (index: number) => {\n    if (filteredItems[index] && isInteractive(filteredItems[index])) {\n      onSelectItem(filteredItems[index]);\n    }\n  };\n\n  return [\n    { ...highlightedOptionState, items: filteredItems, showAll, getItemGroup },\n    {\n      ...highlightedOptionHandlers,\n      setShowAll,\n      selectHighlightedOptionWithKeyboard,\n      highlightVisibleOptionWithMouse,\n      selectVisibleOptionWithMouse,\n    },\n  ];\n};\n\nfunction createItems(options: Options) {\n  const items: AutosuggestItem[] = [];\n  const itemToGroup = new WeakMap<AutosuggestItem, AutosuggestItem>();\n  const getItemParent = (item: AutosuggestItem) => itemToGroup.get(item);\n  const getItemGroup = (item: AutosuggestItem) => getItemParent(item)?.option as AutosuggestProps.OptionGroup;\n\n  for (const option of options) {\n    if (isGroup(option)) {\n      for (const item of flattenGroup(option)) {\n        items.push(item);\n      }\n    } else {\n      items.push({ ...option, option });\n    }\n  }\n\n  function flattenGroup(group: AutosuggestProps.OptionGroup) {\n    const { options, ...rest } = group;\n\n    let hasOnlyDisabledChildren = true;\n\n    const groupItem: AutosuggestItem = { ...rest, type: 'parent', option: group };\n\n    const items: AutosuggestItem[] = [groupItem];\n\n    for (const option of options) {\n      if (!option.disabled) {\n        hasOnlyDisabledChildren = false;\n      }\n\n      const childOption: AutosuggestItem = {\n        ...option,\n        type: 'child',\n        disabled: option.disabled || rest.disabled,\n        option,\n      };\n\n      items.push(childOption);\n\n      itemToGroup.set(childOption, groupItem);\n    }\n\n    items[0].disabled = items[0].disabled || hasOnlyDisabledChildren;\n\n    return items;\n  }\n\n  return { items, getItemGroup, getItemParent };\n}\n\nfunction isGroup(optionOrGroup: AutosuggestProps.Option): optionOrGroup is AutosuggestProps.OptionGroup {\n  return 'options' in optionOrGroup;\n}\n"]}

package/lib/internal/template/internal/environment.js

@@ -1,4 +1,4 @@
 export var PACKAGE_SOURCE = "components";
-export var PACKAGE_VERSION = "3.0.0 (538c9067)";
+export var PACKAGE_VERSION = "3.0.0 (27a56088)";
 export var THEME = "open-source-visual-refresh";
 export var ALWAYS_VISUAL_REFRESH = true;

package/lib/internal/template/internal/environment.json

@@ -1,6 +1,6 @@
 {
   "PACKAGE_SOURCE": "components",
-  "PACKAGE_VERSION": "3.0.0 (538c9067)",
+  "PACKAGE_VERSION": "3.0.0 (27a56088)",
   "THEME": "default",
   "ALWAYS_VISUAL_REFRESH": false
 }

package/lib/internal/template/property-filter/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/property-filter/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAgD,MAAM,OAAO,CAAC;AAoBrE,OAAO,EASL,mBAAmB,EAGpB,MAAM,cAAc,CAAC;AAStB,OAAO,EAAE,mBAAmB,EAAE,CAAC;AAE/B,QAAA,MAAM,cAAc,qGAgZnB,CAAC;AAGF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/property-filter/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAgD,MAAM,OAAO,CAAC;AAmBrE,OAAO,EASL,mBAAmB,EAGpB,MAAM,cAAc,CAAC;AAStB,OAAO,EAAE,mBAAmB,EAAE,CAAC;AAE/B,QAAA,MAAM,cAAc,qGAsYnB,CAAC;AAGF,eAAe,cAAc,CAAC"}

package/lib/internal/template/property-filter/index.js

@@ -10,7 +10,6 @@ import TokenList from '../internal/components/token-list';
 import { fireNonCancelableEvent } from '../internal/events';
 import useBaseComponent from '../internal/hooks/use-base-component';
 import { useUniqueId } from '../internal/hooks/use-unique-id/index';
-import { KeyCode } from '../internal/keycode';
 import { applyDisplayName } from '../internal/utils/apply-display-name';
 import { joinStrings } from '../internal/utils/strings';
 import InternalSpaceBetween from '../space-between/internal';
@@ -117,12 +116,6 @@ const PropertyFilter = React.forwardRef((_a, ref) => {
         addToken(newToken);
         setFilteringText('');
     };
-    const ignoreKeyDown = useRef(false);
-    const handleKeyDown = event => {
-        if (filteringText && !ignoreKeyDown.current && event.detail.keyCode === KeyCode.enter) {
-            createToken(filteringText);
-        }
-    };
     const getLoadMoreDetail = (parsedText, filteringText) => {
         const loadMoreDetail = {
             filteringProperty: undefined,
@@ -150,14 +143,11 @@ const PropertyFilter = React.forwardRef((_a, ref) => {
         ? Object.assign(Object.assign({}, inputLoadItemsHandlers), asyncProps) : {};
     const handleSelected = event => {
         var _a;
-        // The ignoreKeyDown flag makes sure `createToken` routine runs only once. Autosuggest's `onKeyDown` fires,
-        // when an item is selected from the list using "enter" key.
-        ignoreKeyDown.current = true;
-        setTimeout(() => {
-            ignoreKeyDown.current = false;
-        }, 0);
         const { detail: option } = event;
         const value = option.value || '';
+        if (!value) {
+            return;
+        }
         if (!('keepOpenOnSelect' in option)) {
             createToken(value);
             return;
@@ -187,7 +177,7 @@ const PropertyFilter = React.forwardRef((_a, ref) => {
     return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.root), ref: __internalRootRef }),
         React.createElement("div", { className: styles['search-field'] },
             customControl && React.createElement("div", { className: styles['custom-control'] }, customControl),
-            React.createElement(PropertyFilterAutosuggest, Object.assign({ ref: inputRef, virtualScroll: virtualScroll, enteredTextLabel: i18nStrings.enteredTextLabel, ariaLabel: filteringAriaLabel !== null && filteringAriaLabel !== void 0 ? filteringAriaLabel : i18nStrings.filteringAriaLabel, placeholder: filteringPlaceholder !== null && filteringPlaceholder !== void 0 ? filteringPlaceholder : i18nStrings.filteringPlaceholder, ariaLabelledby: rest.ariaLabelledby, ariaDescribedby: textboxAriaDescribedBy, controlId: rest.controlId, value: filteringText, disabled: disabled, onKeyDown: handleKeyDown }, autosuggestOptions, { onChange: event => setFilteringText(event.detail.value), empty: filteringEmpty }, asyncAutosuggestProps, { expandToViewport: expandToViewport, onOptionClick: handleSelected, customForm: operatorForm && (React.createElement(PropertyEditor, { property: parsedText.property, operator: parsedText.operator, filter: parsedText.value, operatorForm: operatorForm, i18nStrings: i18nStrings, onCancel: () => {
+            React.createElement(PropertyFilterAutosuggest, Object.assign({ ref: inputRef, virtualScroll: virtualScroll, enteredTextLabel: i18nStrings.enteredTextLabel, ariaLabel: filteringAriaLabel !== null && filteringAriaLabel !== void 0 ? filteringAriaLabel : i18nStrings.filteringAriaLabel, placeholder: filteringPlaceholder !== null && filteringPlaceholder !== void 0 ? filteringPlaceholder : i18nStrings.filteringPlaceholder, ariaLabelledby: rest.ariaLabelledby, ariaDescribedby: textboxAriaDescribedBy, controlId: rest.controlId, value: filteringText, disabled: disabled }, autosuggestOptions, { onChange: event => setFilteringText(event.detail.value), empty: filteringEmpty }, asyncAutosuggestProps, { expandToViewport: expandToViewport, onOptionClick: handleSelected, customForm: operatorForm && (React.createElement(PropertyEditor, { property: parsedText.property, operator: parsedText.operator, filter: parsedText.value, operatorForm: operatorForm, i18nStrings: i18nStrings, onCancel: () => {
                         var _a, _b;
                         setFilteringText('');
                         (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.close();