@cloudscape-design/components 3.0.719 → 3.0.721

package/property-filter/styles.selectors.js

@@ -2,43 +2,43 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_1wzqe_8mqhl_97",
-  "search-field": "awsui_search-field_1wzqe_8mqhl_132",
-  "input-wrapper": "awsui_input-wrapper_1wzqe_8mqhl_138",
-  "add-token": "awsui_add-token_1wzqe_8mqhl_142",
-  "tokens": "awsui_tokens_1wzqe_8mqhl_149",
-  "token-operator": "awsui_token-operator_1wzqe_8mqhl_154",
-  "property-editor": "awsui_property-editor_1wzqe_8mqhl_158",
-  "property-editor-form": "awsui_property-editor-form_1wzqe_8mqhl_166",
-  "property-editor-field-property": "awsui_property-editor-field-property_1wzqe_8mqhl_169",
-  "property-editor-field-operator": "awsui_property-editor-field-operator_1wzqe_8mqhl_172",
-  "property-editor-field-value": "awsui_property-editor-field-value_1wzqe_8mqhl_175",
-  "property-editor-cancel": "awsui_property-editor-cancel_1wzqe_8mqhl_178",
-  "property-editor-submit": "awsui_property-editor-submit_1wzqe_8mqhl_181",
-  "property-editor-actions": "awsui_property-editor-actions_1wzqe_8mqhl_184",
-  "token-editor": "awsui_token-editor_1wzqe_8mqhl_191",
-  "token-editor-form": "awsui_token-editor-form_1wzqe_8mqhl_199",
-  "token-editor-field-property": "awsui_token-editor-field-property_1wzqe_8mqhl_202",
-  "token-editor-field-operator": "awsui_token-editor-field-operator_1wzqe_8mqhl_205",
-  "token-editor-field-value": "awsui_token-editor-field-value_1wzqe_8mqhl_208",
-  "token-editor-cancel": "awsui_token-editor-cancel_1wzqe_8mqhl_211",
-  "token-editor-submit": "awsui_token-editor-submit_1wzqe_8mqhl_214",
-  "token-editor-actions": "awsui_token-editor-actions_1wzqe_8mqhl_217",
-  "token-editor-grid": "awsui_token-editor-grid_1wzqe_8mqhl_226",
-  "token-editor-grid-group": "awsui_token-editor-grid-group_1wzqe_8mqhl_263",
-  "token-editor-narrow": "awsui_token-editor-narrow_1wzqe_8mqhl_266",
-  "token-editor-group": "awsui_token-editor-group_1wzqe_8mqhl_270",
-  "token-editor-grid-header": "awsui_token-editor-grid-header_1wzqe_8mqhl_275",
-  "token-editor-grid-cell": "awsui_token-editor-grid-cell_1wzqe_8mqhl_281",
-  "token-editor-add-token": "awsui_token-editor-add-token_1wzqe_8mqhl_286",
-  "custom-content-wrapper": "awsui_custom-content-wrapper_1wzqe_8mqhl_290",
-  "custom-control": "awsui_custom-control_1wzqe_8mqhl_294",
-  "input": "awsui_input_1wzqe_8mqhl_138",
-  "results": "awsui_results_1wzqe_8mqhl_302",
-  "token-trigger": "awsui_token-trigger_1wzqe_8mqhl_307",
-  "remove-all": "awsui_remove-all_1wzqe_8mqhl_312",
-  "join-operation": "awsui_join-operation_1wzqe_8mqhl_313",
-  "custom-filter-actions": "awsui_custom-filter-actions_1wzqe_8mqhl_314",
-  "constraint": "awsui_constraint_1wzqe_8mqhl_318"
+  "root": "awsui_root_1wzqe_109an_97",
+  "search-field": "awsui_search-field_1wzqe_109an_132",
+  "input-wrapper": "awsui_input-wrapper_1wzqe_109an_138",
+  "add-token": "awsui_add-token_1wzqe_109an_142",
+  "tokens": "awsui_tokens_1wzqe_109an_149",
+  "token-operator": "awsui_token-operator_1wzqe_109an_154",
+  "property-editor": "awsui_property-editor_1wzqe_109an_158",
+  "property-editor-form": "awsui_property-editor-form_1wzqe_109an_166",
+  "property-editor-field-property": "awsui_property-editor-field-property_1wzqe_109an_169",
+  "property-editor-field-operator": "awsui_property-editor-field-operator_1wzqe_109an_172",
+  "property-editor-field-value": "awsui_property-editor-field-value_1wzqe_109an_175",
+  "property-editor-cancel": "awsui_property-editor-cancel_1wzqe_109an_178",
+  "property-editor-submit": "awsui_property-editor-submit_1wzqe_109an_181",
+  "property-editor-actions": "awsui_property-editor-actions_1wzqe_109an_184",
+  "token-editor": "awsui_token-editor_1wzqe_109an_191",
+  "token-editor-form": "awsui_token-editor-form_1wzqe_109an_199",
+  "token-editor-field-property": "awsui_token-editor-field-property_1wzqe_109an_202",
+  "token-editor-field-operator": "awsui_token-editor-field-operator_1wzqe_109an_205",
+  "token-editor-field-value": "awsui_token-editor-field-value_1wzqe_109an_208",
+  "token-editor-cancel": "awsui_token-editor-cancel_1wzqe_109an_211",
+  "token-editor-submit": "awsui_token-editor-submit_1wzqe_109an_214",
+  "token-editor-actions": "awsui_token-editor-actions_1wzqe_109an_217",
+  "token-editor-grid": "awsui_token-editor-grid_1wzqe_109an_226",
+  "token-editor-grid-group": "awsui_token-editor-grid-group_1wzqe_109an_263",
+  "token-editor-narrow": "awsui_token-editor-narrow_1wzqe_109an_266",
+  "token-editor-group": "awsui_token-editor-group_1wzqe_109an_270",
+  "token-editor-grid-header": "awsui_token-editor-grid-header_1wzqe_109an_275",
+  "token-editor-grid-cell": "awsui_token-editor-grid-cell_1wzqe_109an_281",
+  "token-editor-add-token": "awsui_token-editor-add-token_1wzqe_109an_286",
+  "custom-content-wrapper": "awsui_custom-content-wrapper_1wzqe_109an_290",
+  "custom-control": "awsui_custom-control_1wzqe_109an_294",
+  "input": "awsui_input_1wzqe_109an_138",
+  "results": "awsui_results_1wzqe_109an_302",
+  "token-trigger": "awsui_token-trigger_1wzqe_109an_307",
+  "remove-all": "awsui_remove-all_1wzqe_109an_312",
+  "join-operation": "awsui_join-operation_1wzqe_109an_313",
+  "custom-filter-actions": "awsui_custom-filter-actions_1wzqe_109an_314",
+  "constraint": "awsui_constraint_1wzqe_109an_318"
 };
   

package/property-filter/token-editor.d.ts

@@ -1,15 +1,8 @@
 /// <reference types="react" />
 import { DropdownStatusProps } from '../internal/components/dropdown-status/interfaces.js';
 import { NonCancelableEventHandler } from '../internal/events/index.js';
-import { FormattedToken, GroupText, I18nStrings, InternalFilteringOption, InternalFilteringProperty, InternalFreeTextFiltering, InternalToken, LoadItemsDetail } from './interfaces.js';
-interface I18nStringsExt {
-    tokenEditorTokenActionsLabel: (token: FormattedToken) => string;
-    tokenEditorTokenRemoveLabel: (token: FormattedToken) => string;
-    tokenEditorTokenRemoveFromGroupLabel: (token: FormattedToken) => string;
-    tokenEditorAddNewTokenLabel: string;
-    tokenEditorAddTokenActionsLabel: string;
-    tokenEditorAddExistingTokenLabel: (token: FormattedToken) => string;
-}
+import { GroupText, I18nStrings, InternalFilteringOption, InternalFilteringProperty, InternalFreeTextFiltering, InternalToken, LoadItemsDetail } from './interfaces.js';
+import { I18nStringsExt } from './internal.js';
 export interface TokenEditorProps {
     supportsGroups: boolean;
     asyncProperties?: boolean;
@@ -28,5 +21,4 @@ export interface TokenEditorProps {
     onChangeTempGroup: (token: InternalToken[]) => void;
 }
 export declare function TokenEditor({ supportsGroups, asyncProperties, asyncProps, customGroupsText, freeTextFiltering, filteringProperties, filteringOptions, i18nStrings, onLoadItems, onSubmit, onDismiss, standaloneTokens, onChangeStandalone, tempGroup, onChangeTempGroup, }: TokenEditorProps): JSX.Element;
-export {};
 //# sourceMappingURL=token-editor.d.ts.map

package/property-filter/token-editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"token-editor.d.ts","sourceRoot":"","sources":["../../../src/property-filter/token-editor.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAE,mBAAmB,EAAE,MAAM,sDAAsD,CAAC;AAE3F,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AAKxE,OAAO,EAEL,cAAc,EACd,SAAS,EACT,WAAW,EACX,uBAAuB,EACvB,yBAAyB,EACzB,yBAAyB,EACzB,aAAa,EACb,eAAe,EAChB,MAAM,iBAAiB,CAAC;AAMzB,UAAU,cAAc;IACtB,4BAA4B,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,MAAM,CAAC;IAChE,2BAA2B,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,MAAM,CAAC;IAC/D,oCAAoC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,MAAM,CAAC;IACxE,2BAA2B,EAAE,MAAM,CAAC;IACpC,+BAA+B,EAAE,MAAM,CAAC;IACxC,gCAAgC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,MAAM,CAAC;CACrE;AAED,MAAM,WAAW,gBAAgB;IAC/B,cAAc,EAAE,OAAO,CAAC;IACxB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,mBAAmB,CAAC;IAChC,gBAAgB,EAAE,SAAS,SAAS,EAAE,CAAC;IACvC,iBAAiB,EAAE,yBAAyB,CAAC;IAC7C,mBAAmB,EAAE,SAAS,yBAAyB,EAAE,CAAC;IAC1D,gBAAgB,EAAE,SAAS,uBAAuB,EAAE,CAAC;IACrD,WAAW,EAAE,WAAW,GAAG,cAAc,CAAC;IAC1C,WAAW,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,CAAC;IACzD,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,gBAAgB,EAAE,aAAa,EAAE,CAAC;IAClC,kBAAkB,EAAE,CAAC,aAAa,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IAC7D,SAAS,EAAE,aAAa,EAAE,CAAC;IAC3B,iBAAiB,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;CACrD;AAED,wBAAgB,WAAW,CAAC,EAC1B,cAAc,EACd,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,WAAW,EACX,WAAW,EACX,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,kBAAkB,EAClB,SAAS,EACT,iBAAiB,GAClB,EAAE,gBAAgB,eAqIlB"}
+{"version":3,"file":"token-editor.d.ts","sourceRoot":"","sources":["../../../src/property-filter/token-editor.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAE,mBAAmB,EAAE,MAAM,sDAAsD,CAAC;AAE3F,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AAKxE,OAAO,EAGL,SAAS,EACT,WAAW,EACX,uBAAuB,EACvB,yBAAyB,EACzB,yBAAyB,EACzB,aAAa,EACb,eAAe,EAChB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAM/C,MAAM,WAAW,gBAAgB;IAC/B,cAAc,EAAE,OAAO,CAAC;IACxB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,mBAAmB,CAAC;IAChC,gBAAgB,EAAE,SAAS,SAAS,EAAE,CAAC;IACvC,iBAAiB,EAAE,yBAAyB,CAAC;IAC7C,mBAAmB,EAAE,SAAS,yBAAyB,EAAE,CAAC;IAC1D,gBAAgB,EAAE,SAAS,uBAAuB,EAAE,CAAC;IACrD,WAAW,EAAE,WAAW,GAAG,cAAc,CAAC;IAC1C,WAAW,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,CAAC;IACzD,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,gBAAgB,EAAE,aAAa,EAAE,CAAC;IAClC,kBAAkB,EAAE,CAAC,aAAa,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IAC7D,SAAS,EAAE,aAAa,EAAE,CAAC;IAC3B,iBAAiB,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;CACrD;AAED,wBAAgB,WAAW,CAAC,EAC1B,cAAc,EACd,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,WAAW,EACX,WAAW,EACX,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,kBAAkB,EAClB,SAAS,EACT,iBAAiB,GAClB,EAAE,gBAAgB,eAqIlB"}

package/property-filter/token-editor.js

@@ -6,7 +6,7 @@ import InternalButton from '../button/internal.js';
 import InternalButtonDropdown from '../button-dropdown/internal.js';
 import InternalFormField from '../form-field/internal.js';
 import { FormFieldContext } from '../internal/context/form-field-context.js';
-import { useContainerBreakpoints } from '../internal/hooks/container-queries/index.js';
+import { useMobile } from '../internal/hooks/use-mobile/index.js';
 import { useUniqueId } from '../internal/hooks/use-unique-id/index.js';
 import { getAllowedOperators } from './controller.js';
 import { getFormattedToken } from './i18n-utils.js';
@@ -14,6 +14,7 @@ import { OperatorInput, PropertyInput, ValueInput } from './token-editor-inputs.
 import styles from './styles.css.js';
 import testUtilStyles from './test-classes/styles.css.js';
 export function TokenEditor({ supportsGroups, asyncProperties, asyncProps, customGroupsText, freeTextFiltering, filteringProperties, filteringOptions, i18nStrings, onLoadItems, onSubmit, onDismiss, standaloneTokens, onChangeStandalone, tempGroup, onChangeTempGroup, }) {
+    var _a;
     const groups = tempGroup.map((temporaryToken, index) => {
         const setTemporaryToken = (newToken) => {
             const copy = [...tempGroup];
@@ -52,10 +53,13 @@ export function TokenEditor({ supportsGroups, asyncProperties, asyncProps, custo
                 onChangeStandalone([...standaloneTokens, removedToken]);
             }, onSubmit: onSubmit, renderProperty: index => (React.createElement(PropertyInput, { property: groups[index].property, onChangePropertyKey: groups[index].onChangePropertyKey, asyncProps: asyncProperties ? asyncProps : null, filteringProperties: filteringProperties, onLoadItems: onLoadItems, customGroupsText: customGroupsText, i18nStrings: i18nStrings, freeTextFiltering: freeTextFiltering })), renderOperator: index => (React.createElement(OperatorInput, { property: groups[index].property, operator: groups[index].operator, onChangeOperator: groups[index].onChangeOperator, i18nStrings: i18nStrings, freeTextFiltering: freeTextFiltering, triggerVariant: supportsGroups ? 'label' : 'option' })), renderValue: index => (React.createElement(ValueInput, { property: groups[index].property, operator: groups[index].operator, value: groups[index].value, onChangeValue: groups[index].onChangeValue, asyncProps: asyncProps, filteringOptions: filteringOptions, onLoadItems: onLoadItems, i18nStrings: i18nStrings })), i18nStrings: i18nStrings }),
         supportsGroups && (React.createElement("div", { className: clsx(styles['token-editor-add-token'], testUtilStyles['token-editor-token-add-actions']) },
-            React.createElement(InternalButtonDropdown, { variant: "normal", ariaLabel: i18nStrings.tokenEditorAddTokenActionsLabel, items: standaloneTokens.map((token, index) => ({
-                    id: index.toString(),
-                    text: i18nStrings.tokenEditorAddExistingTokenLabel(getFormattedToken(token, i18nStrings)),
-                })), onItemClick: ({ detail }) => {
+            React.createElement(InternalButtonDropdown, { variant: "normal", ariaLabel: i18nStrings.tokenEditorAddTokenActionsLabel, items: standaloneTokens.map((token, index) => {
+                    var _a, _b;
+                    return ({
+                        id: index.toString(),
+                        text: (_b = (_a = i18nStrings.tokenEditorAddExistingTokenLabel) === null || _a === void 0 ? void 0 : _a.call(i18nStrings, getFormattedToken(token, i18nStrings))) !== null && _b !== void 0 ? _b : '',
+                    });
+                }), onItemClick: ({ detail }) => {
                     const index = parseInt(detail.id);
                     if (!isNaN(index) && standaloneTokens[index]) {
                         const addedToken = standaloneTokens[index];
@@ -64,7 +68,7 @@ export function TokenEditor({ supportsGroups, asyncProperties, asyncProps, custo
                         onChangeTempGroup([...tempGroup, addedToken]);
                     }
                 }, disabled: standaloneTokens.length === 0, mainAction: {
-                    text: i18nStrings.tokenEditorAddNewTokenLabel,
+                    text: (_a = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.tokenEditorAddNewTokenLabel) !== null && _a !== void 0 ? _a : '',
                     onClick: () => onChangeTempGroup([...tempGroup, { property: null, operator: ':', value: null }]),
                 } }))),
         React.createElement("div", { className: styles['token-editor-actions'] },
@@ -72,8 +76,8 @@ export function TokenEditor({ supportsGroups, asyncProperties, asyncProps, custo
             React.createElement(InternalButton, { className: clsx(styles['token-editor-submit'], testUtilStyles['token-editor-submit']), formAction: "none", onClick: onSubmit }, i18nStrings.applyActionText))));
 }
 function TokenEditorFields({ tokens, supportsGroups, onRemove, onRemoveFromGroup, onSubmit, renderProperty, renderOperator, renderValue, i18nStrings, }) {
-    const [breakpoint, breakpointRef] = useContainerBreakpoints(['xs']);
-    const isNarrow = breakpoint === 'default' || !supportsGroups;
+    const isMobile = useMobile();
+    const isNarrow = isMobile || !supportsGroups;
     const propertyLabelId = useUniqueId();
     const operatorLabelId = useUniqueId();
     const valueLabelId = useUniqueId();
@@ -82,31 +86,34 @@ function TokenEditorFields({ tokens, supportsGroups, onRemove, onRemoveFromGroup
         React.createElement("div", { id: operatorLabelId, className: styles['token-editor-grid-header'] }, i18nStrings.operatorText),
         React.createElement("div", { id: valueLabelId, className: styles['token-editor-grid-header'] }, i18nStrings.valueText),
         React.createElement("div", { className: styles['token-editor-grid-header'] })));
-    return (React.createElement("form", { className: clsx(styles['token-editor-grid'], isNarrow && styles['token-editor-narrow'], styles['token-editor-form']), ref: breakpointRef, onSubmit: event => {
+    return (React.createElement("form", { className: clsx(styles['token-editor-grid'], isNarrow && styles['token-editor-narrow'], styles['token-editor-form']), onSubmit: event => {
             event.preventDefault();
             onSubmit();
         } },
         !isNarrow && headers,
-        tokens.map((token, index) => (React.createElement("div", { key: index, role: "group", "aria-label": `${token.propertyLabel} ${token.operator} ${token.value}`, className: styles['token-editor-grid-group'] },
-            React.createElement("div", { className: clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow']) },
-                React.createElement(TokenEditorField, { isNarrow: isNarrow, label: i18nStrings.propertyText, labelId: propertyLabelId, className: clsx(styles['token-editor-field-property'], testUtilStyles['token-editor-field-property']), index: index }, renderProperty(index))),
-            React.createElement("div", { className: clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow']) },
-                React.createElement(TokenEditorField, { isNarrow: isNarrow, label: i18nStrings.operatorText, labelId: operatorLabelId, className: clsx(styles['token-editor-field-operator'], testUtilStyles['token-editor-field-operator']), index: index }, renderOperator(index))),
-            React.createElement("div", { className: clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow']) },
-                React.createElement(TokenEditorField, { isNarrow: isNarrow, label: i18nStrings.valueText, labelId: valueLabelId, className: clsx(styles['token-editor-field-value'], testUtilStyles['token-editor-field-value']), index: index }, renderValue(index))),
-            supportsGroups && (React.createElement("div", { className: clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow']) },
-                React.createElement("div", { className: styles['token-editor-remove-token'] },
-                    React.createElement(TokenEditorRemoveActions, { isNarrow: isNarrow, ariaLabel: i18nStrings.tokenEditorTokenActionsLabel(token), disabled: tokens.length === 1, items: [
-                            { id: 'remove', text: i18nStrings.tokenEditorTokenRemoveLabel(token) },
-                            { id: 'remove-from-group', text: i18nStrings.tokenEditorTokenRemoveFromGroupLabel(token) },
-                        ], onItemClick: itemId => {
-                            switch (itemId) {
-                                case 'remove':
-                                    return onRemove(index);
-                                case 'remove-from-group':
-                                    return onRemoveFromGroup(index);
-                            }
-                        }, index: index })))))))));
+        tokens.map((token, index) => {
+            var _a, _b, _c, _d, _e, _f;
+            return (React.createElement("div", { key: index, role: "group", "aria-label": `${token.propertyLabel} ${token.operator} ${token.value}`, className: styles['token-editor-grid-group'] },
+                React.createElement("div", { className: clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow']) },
+                    React.createElement(TokenEditorField, { isNarrow: isNarrow, label: i18nStrings.propertyText, labelId: propertyLabelId, className: clsx(styles['token-editor-field-property'], testUtilStyles['token-editor-field-property']), index: index }, renderProperty(index))),
+                React.createElement("div", { className: clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow']) },
+                    React.createElement(TokenEditorField, { isNarrow: isNarrow, label: i18nStrings.operatorText, labelId: operatorLabelId, className: clsx(styles['token-editor-field-operator'], testUtilStyles['token-editor-field-operator']), index: index }, renderOperator(index))),
+                React.createElement("div", { className: clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow']) },
+                    React.createElement(TokenEditorField, { isNarrow: isNarrow, label: i18nStrings.valueText, labelId: valueLabelId, className: clsx(styles['token-editor-field-value'], testUtilStyles['token-editor-field-value']), index: index }, renderValue(index))),
+                supportsGroups && (React.createElement("div", { className: clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow']) },
+                    React.createElement("div", { className: styles['token-editor-remove-token'] },
+                        React.createElement(TokenEditorRemoveActions, { isNarrow: isNarrow, ariaLabel: (_b = (_a = i18nStrings.tokenEditorTokenActionsLabel) === null || _a === void 0 ? void 0 : _a.call(i18nStrings, token)) !== null && _b !== void 0 ? _b : '', disabled: tokens.length === 1, items: [
+                                { id: 'remove', text: (_d = (_c = i18nStrings.tokenEditorTokenRemoveLabel) === null || _c === void 0 ? void 0 : _c.call(i18nStrings, token)) !== null && _d !== void 0 ? _d : '' },
+                                { id: 'remove-from-group', text: (_f = (_e = i18nStrings.tokenEditorTokenRemoveFromGroupLabel) === null || _e === void 0 ? void 0 : _e.call(i18nStrings, token)) !== null && _f !== void 0 ? _f : '' },
+                            ], onItemClick: itemId => {
+                                switch (itemId) {
+                                    case 'remove':
+                                        return onRemove(index);
+                                    case 'remove-from-group':
+                                        return onRemoveFromGroup(index);
+                                }
+                            }, index: index }))))));
+        })));
 }
 function TokenEditorField({ isNarrow, label, labelId, children, className, index, }) {
     return isNarrow ? (React.createElement(InternalFormField, { label: label, className: className, stretch: true, "data-testindex": index }, children)) : (React.createElement(FormFieldContext.Provider, { value: { ariaLabelledby: labelId } },

package/property-filter/token-editor.js.map

@@ -1 +1 @@
-{"version":3,"file":"token-editor.js","sourceRoot":"","sources":["../../../src/property-filter/token-editor.tsx"],"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 React from 'react';\nimport clsx from 'clsx';\n\nimport InternalButton from '../button/internal.js';\nimport { ButtonDropdownProps } from '../button-dropdown/interfaces.js';\nimport InternalButtonDropdown from '../button-dropdown/internal.js';\nimport InternalFormField from '../form-field/internal.js';\nimport { DropdownStatusProps } from '../internal/components/dropdown-status/interfaces.js';\nimport { FormFieldContext } from '../internal/context/form-field-context.js';\nimport { NonCancelableEventHandler } from '../internal/events/index.js';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries/index.js';\nimport { useUniqueId } from '../internal/hooks/use-unique-id/index.js';\nimport { getAllowedOperators } from './controller.js';\nimport { getFormattedToken } from './i18n-utils.js';\nimport {\n  ComparisonOperator,\n  FormattedToken,\n  GroupText,\n  I18nStrings,\n  InternalFilteringOption,\n  InternalFilteringProperty,\n  InternalFreeTextFiltering,\n  InternalToken,\n  LoadItemsDetail,\n} from './interfaces.js';\nimport { OperatorInput, PropertyInput, ValueInput } from './token-editor-inputs.js';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ninterface I18nStringsExt {\n  tokenEditorTokenActionsLabel: (token: FormattedToken) => string;\n  tokenEditorTokenRemoveLabel: (token: FormattedToken) => string;\n  tokenEditorTokenRemoveFromGroupLabel: (token: FormattedToken) => string;\n  tokenEditorAddNewTokenLabel: string;\n  tokenEditorAddTokenActionsLabel: string;\n  tokenEditorAddExistingTokenLabel: (token: FormattedToken) => string;\n}\n\nexport interface TokenEditorProps {\n  supportsGroups: boolean;\n  asyncProperties?: boolean;\n  asyncProps: DropdownStatusProps;\n  customGroupsText: readonly GroupText[];\n  freeTextFiltering: InternalFreeTextFiltering;\n  filteringProperties: readonly InternalFilteringProperty[];\n  filteringOptions: readonly InternalFilteringOption[];\n  i18nStrings: I18nStrings & I18nStringsExt;\n  onLoadItems?: NonCancelableEventHandler<LoadItemsDetail>;\n  onSubmit: () => void;\n  onDismiss: () => void;\n  standaloneTokens: InternalToken[];\n  onChangeStandalone: (newStandalone: InternalToken[]) => void;\n  tempGroup: InternalToken[];\n  onChangeTempGroup: (token: InternalToken[]) => void;\n}\n\nexport function TokenEditor({\n  supportsGroups,\n  asyncProperties,\n  asyncProps,\n  customGroupsText,\n  freeTextFiltering,\n  filteringProperties,\n  filteringOptions,\n  i18nStrings,\n  onLoadItems,\n  onSubmit,\n  onDismiss,\n  standaloneTokens,\n  onChangeStandalone,\n  tempGroup,\n  onChangeTempGroup,\n}: TokenEditorProps) {\n  const groups = tempGroup.map((temporaryToken, index) => {\n    const setTemporaryToken = (newToken: InternalToken) => {\n      const copy = [...tempGroup];\n      copy[index] = newToken;\n      onChangeTempGroup(copy);\n    };\n    const property = temporaryToken.property;\n    const onChangePropertyKey = (newPropertyKey: undefined | string) => {\n      const filteringProperty = filteringProperties.reduce<InternalFilteringProperty | undefined>(\n        (acc, property) => (property.propertyKey === newPropertyKey ? property : acc),\n        undefined\n      );\n      const allowedOperators = filteringProperty ? getAllowedOperators(filteringProperty) : freeTextFiltering.operators;\n      const operator =\n        temporaryToken.operator && allowedOperators.indexOf(temporaryToken.operator) !== -1\n          ? temporaryToken.operator\n          : allowedOperators[0];\n      const matchedProperty = filteringProperties.find(property => property.propertyKey === newPropertyKey) ?? null;\n      setTemporaryToken({ ...temporaryToken, property: matchedProperty, operator, value: null });\n    };\n\n    const operator = temporaryToken.operator;\n    const onChangeOperator = (newOperator: ComparisonOperator) => {\n      setTemporaryToken({ ...temporaryToken, operator: newOperator });\n    };\n\n    const value = temporaryToken.value;\n    const onChangeValue = (newValue: unknown) => {\n      setTemporaryToken({ ...temporaryToken, value: newValue });\n    };\n\n    return { token: temporaryToken, property, onChangePropertyKey, operator, onChangeOperator, value, onChangeValue };\n  });\n  return (\n    <div className={styles['token-editor']}>\n      <TokenEditorFields\n        supportsGroups={supportsGroups}\n        tokens={groups.map(group => getFormattedToken(group.token, i18nStrings))}\n        onRemove={index => {\n          const updated = tempGroup.filter((_, existingIndex) => existingIndex !== index);\n          onChangeTempGroup(updated);\n        }}\n        onRemoveFromGroup={index => {\n          const removedToken = tempGroup[index];\n          const updated = tempGroup.filter((_, existingIndex) => existingIndex !== index);\n          onChangeTempGroup(updated);\n          onChangeStandalone([...standaloneTokens, removedToken]);\n        }}\n        onSubmit={onSubmit}\n        renderProperty={index => (\n          <PropertyInput\n            property={groups[index].property}\n            onChangePropertyKey={groups[index].onChangePropertyKey}\n            asyncProps={asyncProperties ? asyncProps : null}\n            filteringProperties={filteringProperties}\n            onLoadItems={onLoadItems}\n            customGroupsText={customGroupsText}\n            i18nStrings={i18nStrings}\n            freeTextFiltering={freeTextFiltering}\n          />\n        )}\n        renderOperator={index => (\n          <OperatorInput\n            property={groups[index].property}\n            operator={groups[index].operator}\n            onChangeOperator={groups[index].onChangeOperator}\n            i18nStrings={i18nStrings}\n            freeTextFiltering={freeTextFiltering}\n            triggerVariant={supportsGroups ? 'label' : 'option'}\n          />\n        )}\n        renderValue={index => (\n          <ValueInput\n            property={groups[index].property}\n            operator={groups[index].operator}\n            value={groups[index].value}\n            onChangeValue={groups[index].onChangeValue}\n            asyncProps={asyncProps}\n            filteringOptions={filteringOptions}\n            onLoadItems={onLoadItems}\n            i18nStrings={i18nStrings}\n          />\n        )}\n        i18nStrings={i18nStrings}\n      />\n\n      {supportsGroups && (\n        <div className={clsx(styles['token-editor-add-token'], testUtilStyles['token-editor-token-add-actions'])}>\n          <InternalButtonDropdown\n            variant=\"normal\"\n            ariaLabel={i18nStrings.tokenEditorAddTokenActionsLabel}\n            items={standaloneTokens.map((token, index) => ({\n              id: index.toString(),\n              text: i18nStrings.tokenEditorAddExistingTokenLabel(getFormattedToken(token, i18nStrings)),\n            }))}\n            onItemClick={({ detail }) => {\n              const index = parseInt(detail.id);\n              if (!isNaN(index) && standaloneTokens[index]) {\n                const addedToken = standaloneTokens[index];\n                const updated = standaloneTokens.filter((_, existingIndex) => existingIndex !== index);\n                onChangeStandalone(updated);\n                onChangeTempGroup([...tempGroup, addedToken]);\n              }\n            }}\n            disabled={standaloneTokens.length === 0}\n            mainAction={{\n              text: i18nStrings.tokenEditorAddNewTokenLabel,\n              onClick: () => onChangeTempGroup([...tempGroup, { property: null, operator: ':', value: null }]),\n            }}\n          />\n        </div>\n      )}\n\n      <div className={styles['token-editor-actions']}>\n        <InternalButton\n          formAction=\"none\"\n          variant=\"link\"\n          className={clsx(styles['token-editor-cancel'], testUtilStyles['token-editor-cancel'])}\n          onClick={onDismiss}\n        >\n          {i18nStrings.cancelActionText}\n        </InternalButton>\n        <InternalButton\n          className={clsx(styles['token-editor-submit'], testUtilStyles['token-editor-submit'])}\n          formAction=\"none\"\n          onClick={onSubmit}\n        >\n          {i18nStrings.applyActionText}\n        </InternalButton>\n      </div>\n    </div>\n  );\n}\n\ninterface TokenEditorLayout {\n  tokens: FormattedToken[];\n  supportsGroups: boolean;\n  onRemove: (index: number) => void;\n  onRemoveFromGroup: (index: number) => void;\n  onSubmit: () => void;\n  renderProperty: (index: number) => React.ReactNode;\n  renderOperator: (index: number) => React.ReactNode;\n  renderValue: (index: number) => React.ReactNode;\n  i18nStrings: I18nStrings & I18nStringsExt;\n}\n\nfunction TokenEditorFields({\n  tokens,\n  supportsGroups,\n  onRemove,\n  onRemoveFromGroup,\n  onSubmit,\n  renderProperty,\n  renderOperator,\n  renderValue,\n  i18nStrings,\n}: TokenEditorLayout) {\n  const [breakpoint, breakpointRef] = useContainerBreakpoints(['xs']);\n  const isNarrow = breakpoint === 'default' || !supportsGroups;\n\n  const propertyLabelId = useUniqueId();\n  const operatorLabelId = useUniqueId();\n  const valueLabelId = useUniqueId();\n  const headers = (\n    <div className={styles['token-editor-grid-group']}>\n      <div id={propertyLabelId} className={styles['token-editor-grid-header']}>\n        {i18nStrings.propertyText}\n      </div>\n      <div id={operatorLabelId} className={styles['token-editor-grid-header']}>\n        {i18nStrings.operatorText}\n      </div>\n      <div id={valueLabelId} className={styles['token-editor-grid-header']}>\n        {i18nStrings.valueText}\n      </div>\n      <div className={styles['token-editor-grid-header']}></div>\n    </div>\n  );\n\n  return (\n    <form\n      className={clsx(\n        styles['token-editor-grid'],\n        isNarrow && styles['token-editor-narrow'],\n        styles['token-editor-form']\n      )}\n      ref={breakpointRef}\n      onSubmit={event => {\n        event.preventDefault();\n        onSubmit();\n      }}\n    >\n      {!isNarrow && headers}\n\n      {tokens.map((token, index) => (\n        <div\n          key={index}\n          role=\"group\"\n          aria-label={`${token.propertyLabel} ${token.operator} ${token.value}`}\n          className={styles['token-editor-grid-group']}\n        >\n          <div className={clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow'])}>\n            <TokenEditorField\n              isNarrow={isNarrow}\n              label={i18nStrings.propertyText}\n              labelId={propertyLabelId}\n              className={clsx(styles['token-editor-field-property'], testUtilStyles['token-editor-field-property'])}\n              index={index}\n            >\n              {renderProperty(index)}\n            </TokenEditorField>\n          </div>\n\n          <div className={clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow'])}>\n            <TokenEditorField\n              isNarrow={isNarrow}\n              label={i18nStrings.operatorText}\n              labelId={operatorLabelId}\n              className={clsx(styles['token-editor-field-operator'], testUtilStyles['token-editor-field-operator'])}\n              index={index}\n            >\n              {renderOperator(index)}\n            </TokenEditorField>\n          </div>\n\n          <div className={clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow'])}>\n            <TokenEditorField\n              isNarrow={isNarrow}\n              label={i18nStrings.valueText}\n              labelId={valueLabelId}\n              className={clsx(styles['token-editor-field-value'], testUtilStyles['token-editor-field-value'])}\n              index={index}\n            >\n              {renderValue(index)}\n            </TokenEditorField>\n          </div>\n\n          {supportsGroups && (\n            <div className={clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow'])}>\n              <div className={styles['token-editor-remove-token']}>\n                <TokenEditorRemoveActions\n                  isNarrow={isNarrow}\n                  ariaLabel={i18nStrings.tokenEditorTokenActionsLabel(token)}\n                  disabled={tokens.length === 1}\n                  items={[\n                    { id: 'remove', text: i18nStrings.tokenEditorTokenRemoveLabel(token) },\n                    { id: 'remove-from-group', text: i18nStrings.tokenEditorTokenRemoveFromGroupLabel(token) },\n                  ]}\n                  onItemClick={itemId => {\n                    switch (itemId) {\n                      case 'remove':\n                        return onRemove(index);\n                      case 'remove-from-group':\n                        return onRemoveFromGroup(index);\n                    }\n                  }}\n                  index={index}\n                />\n              </div>\n            </div>\n          )}\n        </div>\n      ))}\n    </form>\n  );\n}\n\nfunction TokenEditorField({\n  isNarrow,\n  label,\n  labelId,\n  children,\n  className,\n  index,\n}: {\n  isNarrow: boolean;\n  label: React.ReactNode;\n  labelId: string;\n  children: React.ReactNode;\n  className: string;\n  index: number;\n}) {\n  return isNarrow ? (\n    <InternalFormField label={label} className={className} stretch={true} data-testindex={index}>\n      {children}\n    </InternalFormField>\n  ) : (\n    <FormFieldContext.Provider value={{ ariaLabelledby: labelId }}>\n      <InternalFormField className={className} data-testindex={index}>\n        {children}\n      </InternalFormField>\n    </FormFieldContext.Provider>\n  );\n}\n\nfunction TokenEditorRemoveActions({\n  isNarrow,\n  ariaLabel,\n  disabled,\n  items,\n  onItemClick,\n  index,\n}: {\n  isNarrow: boolean;\n  ariaLabel: string;\n  disabled: boolean;\n  items: ButtonDropdownProps.Item[];\n  onItemClick: (itemId: string) => void;\n  index: number;\n}) {\n  return isNarrow ? (\n    <InternalButtonDropdown\n      variant=\"normal\"\n      ariaLabel={ariaLabel}\n      items={items.slice(1)}\n      onItemClick={({ detail }) => onItemClick(detail.id)}\n      disabled={disabled}\n      mainAction={{ text: items[0].text, onClick: () => onItemClick(items[0].id), disabled }}\n      className={testUtilStyles['token-editor-token-remove-actions']}\n      data-testindex={index}\n    />\n  ) : (\n    <InternalButtonDropdown\n      variant=\"icon\"\n      ariaLabel={ariaLabel}\n      items={items}\n      onItemClick={({ detail }) => onItemClick(detail.id)}\n      disabled={disabled}\n      className={testUtilStyles['token-editor-token-remove-actions']}\n      data-testindex={index}\n    />\n  );\n}\n"]}
+{"version":3,"file":"token-editor.js","sourceRoot":"","sources":["../../../src/property-filter/token-editor.tsx"],"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 React from 'react';\nimport clsx from 'clsx';\n\nimport InternalButton from '../button/internal.js';\nimport { ButtonDropdownProps } from '../button-dropdown/interfaces.js';\nimport InternalButtonDropdown from '../button-dropdown/internal.js';\nimport InternalFormField from '../form-field/internal.js';\nimport { DropdownStatusProps } from '../internal/components/dropdown-status/interfaces.js';\nimport { FormFieldContext } from '../internal/context/form-field-context.js';\nimport { NonCancelableEventHandler } from '../internal/events/index.js';\nimport { useMobile } from '../internal/hooks/use-mobile/index.js';\nimport { useUniqueId } from '../internal/hooks/use-unique-id/index.js';\nimport { getAllowedOperators } from './controller.js';\nimport { getFormattedToken } from './i18n-utils.js';\nimport {\n  ComparisonOperator,\n  FormattedToken,\n  GroupText,\n  I18nStrings,\n  InternalFilteringOption,\n  InternalFilteringProperty,\n  InternalFreeTextFiltering,\n  InternalToken,\n  LoadItemsDetail,\n} from './interfaces.js';\nimport { I18nStringsExt } from './internal.js';\nimport { OperatorInput, PropertyInput, ValueInput } from './token-editor-inputs.js';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport interface TokenEditorProps {\n  supportsGroups: boolean;\n  asyncProperties?: boolean;\n  asyncProps: DropdownStatusProps;\n  customGroupsText: readonly GroupText[];\n  freeTextFiltering: InternalFreeTextFiltering;\n  filteringProperties: readonly InternalFilteringProperty[];\n  filteringOptions: readonly InternalFilteringOption[];\n  i18nStrings: I18nStrings & I18nStringsExt;\n  onLoadItems?: NonCancelableEventHandler<LoadItemsDetail>;\n  onSubmit: () => void;\n  onDismiss: () => void;\n  standaloneTokens: InternalToken[];\n  onChangeStandalone: (newStandalone: InternalToken[]) => void;\n  tempGroup: InternalToken[];\n  onChangeTempGroup: (token: InternalToken[]) => void;\n}\n\nexport function TokenEditor({\n  supportsGroups,\n  asyncProperties,\n  asyncProps,\n  customGroupsText,\n  freeTextFiltering,\n  filteringProperties,\n  filteringOptions,\n  i18nStrings,\n  onLoadItems,\n  onSubmit,\n  onDismiss,\n  standaloneTokens,\n  onChangeStandalone,\n  tempGroup,\n  onChangeTempGroup,\n}: TokenEditorProps) {\n  const groups = tempGroup.map((temporaryToken, index) => {\n    const setTemporaryToken = (newToken: InternalToken) => {\n      const copy = [...tempGroup];\n      copy[index] = newToken;\n      onChangeTempGroup(copy);\n    };\n    const property = temporaryToken.property;\n    const onChangePropertyKey = (newPropertyKey: undefined | string) => {\n      const filteringProperty = filteringProperties.reduce<InternalFilteringProperty | undefined>(\n        (acc, property) => (property.propertyKey === newPropertyKey ? property : acc),\n        undefined\n      );\n      const allowedOperators = filteringProperty ? getAllowedOperators(filteringProperty) : freeTextFiltering.operators;\n      const operator =\n        temporaryToken.operator && allowedOperators.indexOf(temporaryToken.operator) !== -1\n          ? temporaryToken.operator\n          : allowedOperators[0];\n      const matchedProperty = filteringProperties.find(property => property.propertyKey === newPropertyKey) ?? null;\n      setTemporaryToken({ ...temporaryToken, property: matchedProperty, operator, value: null });\n    };\n\n    const operator = temporaryToken.operator;\n    const onChangeOperator = (newOperator: ComparisonOperator) => {\n      setTemporaryToken({ ...temporaryToken, operator: newOperator });\n    };\n\n    const value = temporaryToken.value;\n    const onChangeValue = (newValue: unknown) => {\n      setTemporaryToken({ ...temporaryToken, value: newValue });\n    };\n\n    return { token: temporaryToken, property, onChangePropertyKey, operator, onChangeOperator, value, onChangeValue };\n  });\n  return (\n    <div className={styles['token-editor']}>\n      <TokenEditorFields\n        supportsGroups={supportsGroups}\n        tokens={groups.map(group => getFormattedToken(group.token, i18nStrings))}\n        onRemove={index => {\n          const updated = tempGroup.filter((_, existingIndex) => existingIndex !== index);\n          onChangeTempGroup(updated);\n        }}\n        onRemoveFromGroup={index => {\n          const removedToken = tempGroup[index];\n          const updated = tempGroup.filter((_, existingIndex) => existingIndex !== index);\n          onChangeTempGroup(updated);\n          onChangeStandalone([...standaloneTokens, removedToken]);\n        }}\n        onSubmit={onSubmit}\n        renderProperty={index => (\n          <PropertyInput\n            property={groups[index].property}\n            onChangePropertyKey={groups[index].onChangePropertyKey}\n            asyncProps={asyncProperties ? asyncProps : null}\n            filteringProperties={filteringProperties}\n            onLoadItems={onLoadItems}\n            customGroupsText={customGroupsText}\n            i18nStrings={i18nStrings}\n            freeTextFiltering={freeTextFiltering}\n          />\n        )}\n        renderOperator={index => (\n          <OperatorInput\n            property={groups[index].property}\n            operator={groups[index].operator}\n            onChangeOperator={groups[index].onChangeOperator}\n            i18nStrings={i18nStrings}\n            freeTextFiltering={freeTextFiltering}\n            triggerVariant={supportsGroups ? 'label' : 'option'}\n          />\n        )}\n        renderValue={index => (\n          <ValueInput\n            property={groups[index].property}\n            operator={groups[index].operator}\n            value={groups[index].value}\n            onChangeValue={groups[index].onChangeValue}\n            asyncProps={asyncProps}\n            filteringOptions={filteringOptions}\n            onLoadItems={onLoadItems}\n            i18nStrings={i18nStrings}\n          />\n        )}\n        i18nStrings={i18nStrings}\n      />\n\n      {supportsGroups && (\n        <div className={clsx(styles['token-editor-add-token'], testUtilStyles['token-editor-token-add-actions'])}>\n          <InternalButtonDropdown\n            variant=\"normal\"\n            ariaLabel={i18nStrings.tokenEditorAddTokenActionsLabel}\n            items={standaloneTokens.map((token, index) => ({\n              id: index.toString(),\n              text: i18nStrings.tokenEditorAddExistingTokenLabel?.(getFormattedToken(token, i18nStrings)) ?? '',\n            }))}\n            onItemClick={({ detail }) => {\n              const index = parseInt(detail.id);\n              if (!isNaN(index) && standaloneTokens[index]) {\n                const addedToken = standaloneTokens[index];\n                const updated = standaloneTokens.filter((_, existingIndex) => existingIndex !== index);\n                onChangeStandalone(updated);\n                onChangeTempGroup([...tempGroup, addedToken]);\n              }\n            }}\n            disabled={standaloneTokens.length === 0}\n            mainAction={{\n              text: i18nStrings?.tokenEditorAddNewTokenLabel ?? '',\n              onClick: () => onChangeTempGroup([...tempGroup, { property: null, operator: ':', value: null }]),\n            }}\n          />\n        </div>\n      )}\n\n      <div className={styles['token-editor-actions']}>\n        <InternalButton\n          formAction=\"none\"\n          variant=\"link\"\n          className={clsx(styles['token-editor-cancel'], testUtilStyles['token-editor-cancel'])}\n          onClick={onDismiss}\n        >\n          {i18nStrings.cancelActionText}\n        </InternalButton>\n        <InternalButton\n          className={clsx(styles['token-editor-submit'], testUtilStyles['token-editor-submit'])}\n          formAction=\"none\"\n          onClick={onSubmit}\n        >\n          {i18nStrings.applyActionText}\n        </InternalButton>\n      </div>\n    </div>\n  );\n}\n\ninterface TokenEditorLayout {\n  tokens: FormattedToken[];\n  supportsGroups: boolean;\n  onRemove: (index: number) => void;\n  onRemoveFromGroup: (index: number) => void;\n  onSubmit: () => void;\n  renderProperty: (index: number) => React.ReactNode;\n  renderOperator: (index: number) => React.ReactNode;\n  renderValue: (index: number) => React.ReactNode;\n  i18nStrings: I18nStrings & I18nStringsExt;\n}\n\nfunction TokenEditorFields({\n  tokens,\n  supportsGroups,\n  onRemove,\n  onRemoveFromGroup,\n  onSubmit,\n  renderProperty,\n  renderOperator,\n  renderValue,\n  i18nStrings,\n}: TokenEditorLayout) {\n  const isMobile = useMobile();\n  const isNarrow = isMobile || !supportsGroups;\n\n  const propertyLabelId = useUniqueId();\n  const operatorLabelId = useUniqueId();\n  const valueLabelId = useUniqueId();\n  const headers = (\n    <div className={styles['token-editor-grid-group']}>\n      <div id={propertyLabelId} className={styles['token-editor-grid-header']}>\n        {i18nStrings.propertyText}\n      </div>\n      <div id={operatorLabelId} className={styles['token-editor-grid-header']}>\n        {i18nStrings.operatorText}\n      </div>\n      <div id={valueLabelId} className={styles['token-editor-grid-header']}>\n        {i18nStrings.valueText}\n      </div>\n      <div className={styles['token-editor-grid-header']}></div>\n    </div>\n  );\n\n  return (\n    <form\n      className={clsx(\n        styles['token-editor-grid'],\n        isNarrow && styles['token-editor-narrow'],\n        styles['token-editor-form']\n      )}\n      onSubmit={event => {\n        event.preventDefault();\n        onSubmit();\n      }}\n    >\n      {!isNarrow && headers}\n\n      {tokens.map((token, index) => (\n        <div\n          key={index}\n          role=\"group\"\n          aria-label={`${token.propertyLabel} ${token.operator} ${token.value}`}\n          className={styles['token-editor-grid-group']}\n        >\n          <div className={clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow'])}>\n            <TokenEditorField\n              isNarrow={isNarrow}\n              label={i18nStrings.propertyText}\n              labelId={propertyLabelId}\n              className={clsx(styles['token-editor-field-property'], testUtilStyles['token-editor-field-property'])}\n              index={index}\n            >\n              {renderProperty(index)}\n            </TokenEditorField>\n          </div>\n\n          <div className={clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow'])}>\n            <TokenEditorField\n              isNarrow={isNarrow}\n              label={i18nStrings.operatorText}\n              labelId={operatorLabelId}\n              className={clsx(styles['token-editor-field-operator'], testUtilStyles['token-editor-field-operator'])}\n              index={index}\n            >\n              {renderOperator(index)}\n            </TokenEditorField>\n          </div>\n\n          <div className={clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow'])}>\n            <TokenEditorField\n              isNarrow={isNarrow}\n              label={i18nStrings.valueText}\n              labelId={valueLabelId}\n              className={clsx(styles['token-editor-field-value'], testUtilStyles['token-editor-field-value'])}\n              index={index}\n            >\n              {renderValue(index)}\n            </TokenEditorField>\n          </div>\n\n          {supportsGroups && (\n            <div className={clsx(styles['token-editor-grid-cell'], isNarrow && styles['token-editor-narrow'])}>\n              <div className={styles['token-editor-remove-token']}>\n                <TokenEditorRemoveActions\n                  isNarrow={isNarrow}\n                  ariaLabel={i18nStrings.tokenEditorTokenActionsLabel?.(token) ?? ''}\n                  disabled={tokens.length === 1}\n                  items={[\n                    { id: 'remove', text: i18nStrings.tokenEditorTokenRemoveLabel?.(token) ?? '' },\n                    { id: 'remove-from-group', text: i18nStrings.tokenEditorTokenRemoveFromGroupLabel?.(token) ?? '' },\n                  ]}\n                  onItemClick={itemId => {\n                    switch (itemId) {\n                      case 'remove':\n                        return onRemove(index);\n                      case 'remove-from-group':\n                        return onRemoveFromGroup(index);\n                    }\n                  }}\n                  index={index}\n                />\n              </div>\n            </div>\n          )}\n        </div>\n      ))}\n    </form>\n  );\n}\n\nfunction TokenEditorField({\n  isNarrow,\n  label,\n  labelId,\n  children,\n  className,\n  index,\n}: {\n  isNarrow: boolean;\n  label: React.ReactNode;\n  labelId: string;\n  children: React.ReactNode;\n  className: string;\n  index: number;\n}) {\n  return isNarrow ? (\n    <InternalFormField label={label} className={className} stretch={true} data-testindex={index}>\n      {children}\n    </InternalFormField>\n  ) : (\n    <FormFieldContext.Provider value={{ ariaLabelledby: labelId }}>\n      <InternalFormField className={className} data-testindex={index}>\n        {children}\n      </InternalFormField>\n    </FormFieldContext.Provider>\n  );\n}\n\nfunction TokenEditorRemoveActions({\n  isNarrow,\n  ariaLabel,\n  disabled,\n  items,\n  onItemClick,\n  index,\n}: {\n  isNarrow: boolean;\n  ariaLabel: string;\n  disabled: boolean;\n  items: ButtonDropdownProps.Item[];\n  onItemClick: (itemId: string) => void;\n  index: number;\n}) {\n  return isNarrow ? (\n    <InternalButtonDropdown\n      variant=\"normal\"\n      ariaLabel={ariaLabel}\n      items={items.slice(1)}\n      onItemClick={({ detail }) => onItemClick(detail.id)}\n      disabled={disabled}\n      mainAction={{ text: items[0].text, onClick: () => onItemClick(items[0].id), disabled }}\n      className={testUtilStyles['token-editor-token-remove-actions']}\n      data-testindex={index}\n    />\n  ) : (\n    <InternalButtonDropdown\n      variant=\"icon\"\n      ariaLabel={ariaLabel}\n      items={items}\n      onItemClick={({ detail }) => onItemClick(detail.id)}\n      disabled={disabled}\n      className={testUtilStyles['token-editor-token-remove-actions']}\n      data-testindex={index}\n    />\n  );\n}\n"]}

package/property-filter/token.d.ts

@@ -20,7 +20,8 @@ interface TokenProps {
     setOperation: (newOperation: JoinOperation) => void;
     setToken: (newToken: Token) => void;
     token: InternalToken;
+    enableTokenGroups: boolean;
 }
-export declare const TokenButton: ({ token, operation, first, removeToken, setToken, setOperation, filteringProperties, filteringOptions, asyncProps, onLoadItems, i18nStrings, asyncProperties, hideOperations, customGroupsText, disabled, freeTextFiltering, expandToViewport, }: TokenProps) => JSX.Element;
+export declare const TokenButton: ({ token, operation, first, removeToken, setToken, setOperation, filteringProperties, filteringOptions, asyncProps, onLoadItems, i18nStrings, asyncProperties, hideOperations, customGroupsText, disabled, freeTextFiltering, expandToViewport, enableTokenGroups, }: TokenProps) => JSX.Element;
 export {};
 //# sourceMappingURL=token.d.ts.map

package/property-filter/token.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"token.d.ts","sourceRoot":"","sources":["../../../src/property-filter/token.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,mDAAmD,CAAC;AACxF,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAG/D,OAAO,EAEL,SAAS,EACT,WAAW,EACX,uBAAuB,EACvB,yBAAyB,EACzB,yBAAyB,EACzB,aAAa,EACb,aAAa,EACb,eAAe,EACf,KAAK,EACN,MAAM,cAAc,CAAC;AAMtB,UAAU,UAAU;IAClB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,mBAAmB,CAAC;IAChC,gBAAgB,EAAE,SAAS,SAAS,EAAE,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,yBAAyB,CAAC;IAC7C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,mBAAmB,EAAE,SAAS,yBAAyB,EAAE,CAAC;IAC1D,gBAAgB,EAAE,SAAS,uBAAuB,EAAE,CAAC;IACrD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,CAAC;IACzD,SAAS,EAAE,aAAa,CAAC;IACzB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,YAAY,EAAE,CAAC,YAAY,EAAE,aAAa,KAAK,IAAI,CAAC;IACpD,QAAQ,EAAE,CAAC,QAAQ,EAAE,KAAK,KAAK,IAAI,CAAC;IACpC,KAAK,EAAE,aAAa,CAAC;CACtB;AAKD,eAAO,MAAM,WAAW,qPAkBrB,UAAU,gBAwEZ,CAAC"}
+{"version":3,"file":"token.d.ts","sourceRoot":"","sources":["../../../src/property-filter/token.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,mDAAmD,CAAC;AACxF,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAG/D,OAAO,EAEL,SAAS,EACT,WAAW,EACX,uBAAuB,EACvB,yBAAyB,EACzB,yBAAyB,EACzB,aAAa,EACb,aAAa,EACb,eAAe,EACf,KAAK,EACN,MAAM,cAAc,CAAC;AAMtB,UAAU,UAAU;IAClB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,mBAAmB,CAAC;IAChC,gBAAgB,EAAE,SAAS,SAAS,EAAE,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,yBAAyB,CAAC;IAC7C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,mBAAmB,EAAE,SAAS,yBAAyB,EAAE,CAAC;IAC1D,gBAAgB,EAAE,SAAS,uBAAuB,EAAE,CAAC;IACrD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,CAAC;IACzD,SAAS,EAAE,aAAa,CAAC;IACzB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,YAAY,EAAE,CAAC,YAAY,EAAE,aAAa,KAAK,IAAI,CAAC;IACpD,QAAQ,EAAE,CAAC,QAAQ,EAAE,KAAK,KAAK,IAAI,CAAC;IACpC,KAAK,EAAE,aAAa,CAAC;IACrB,iBAAiB,EAAE,OAAO,CAAC;CAC5B;AAID,eAAO,MAAM,WAAW,wQAmBrB,UAAU,gBAgEZ,CAAC"}

package/property-filter/token.js

@@ -7,8 +7,7 @@ import { TokenEditor } from './token-editor';
 import { matchTokenValue } from './utils';
 import styles from './styles.css.js';
 const emptyHandler = () => { };
-const emptyLabel = () => '';
-export const TokenButton = ({ token, operation = 'and', first, removeToken, setToken, setOperation, filteringProperties, filteringOptions, asyncProps, onLoadItems, i18nStrings, asyncProperties, hideOperations, customGroupsText, disabled, freeTextFiltering, expandToViewport, }) => {
+export const TokenButton = ({ token, operation = 'and', first, removeToken, setToken, setOperation, filteringProperties, filteringOptions, asyncProps, onLoadItems, i18nStrings, asyncProperties, hideOperations, customGroupsText, disabled, freeTextFiltering, expandToViewport, enableTokenGroups, }) => {
     var _a, _b, _c, _d, _e, _f, _g;
     const tokenRef = useRef(null);
     const formattedToken = getFormattedToken(token, i18nStrings);
@@ -20,20 +19,18 @@ export const TokenButton = ({ token, operation = 'and', first, removeToken, setT
                 ariaLabel: `${formattedToken.propertyLabel} ${formattedToken.operator} ${formattedToken.value}`,
                 dismissAriaLabel: (_b = (_a = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.removeTokenButtonAriaLabel) === null || _a === void 0 ? void 0 : _a.call(i18nStrings, formattedToken)) !== null && _b !== void 0 ? _b : '',
             },
-        ], showOperation: !first && !hideOperations, operation: operation, andText: (_c = i18nStrings.operationAndText) !== null && _c !== void 0 ? _c : '', orText: (_d = i18nStrings.operationOrText) !== null && _d !== void 0 ? _d : '', operationAriaLabel: (_e = i18nStrings.tokenOperatorAriaLabel) !== null && _e !== void 0 ? _e : '', onChangeOperation: setOperation, onDismissToken: removeToken, disabled: disabled, editorContent: React.createElement(TokenEditor, { supportsGroups: false, filteringProperties: filteringProperties, filteringOptions: filteringOptions, tempGroup: [temporaryToken], onChangeTempGroup: newGroup => setTemporaryToken(newGroup[0]), 
+        ], showOperation: !first && !hideOperations, operation: operation, andText: (_c = i18nStrings.operationAndText) !== null && _c !== void 0 ? _c : '', orText: (_d = i18nStrings.operationOrText) !== null && _d !== void 0 ? _d : '', operationAriaLabel: (_e = i18nStrings.tokenOperatorAriaLabel) !== null && _e !== void 0 ? _e : '', onChangeOperation: setOperation, onDismissToken: removeToken, disabled: disabled, editorContent: React.createElement(TokenEditor, { supportsGroups: enableTokenGroups, filteringProperties: filteringProperties, filteringOptions: filteringOptions, tempGroup: [temporaryToken], onChangeTempGroup: newGroup => setTemporaryToken(newGroup[0]), 
             // This property will be needed when supportsGroups={true}
             standaloneTokens: [], 
             // This property will be needed when supportsGroups={true}
-            onChangeStandalone: emptyHandler, asyncProps: asyncProps, onLoadItems: onLoadItems, i18nStrings: Object.assign(Object.assign({}, i18nStrings), { 
-                // These properties will be needed when supportsGroups={true}
-                tokenEditorTokenActionsLabel: emptyLabel, tokenEditorTokenRemoveLabel: emptyLabel, tokenEditorTokenRemoveFromGroupLabel: emptyLabel, tokenEditorAddNewTokenLabel: '', tokenEditorAddTokenActionsLabel: '', tokenEditorAddExistingTokenLabel: emptyLabel }), asyncProperties: asyncProperties, customGroupsText: customGroupsText, freeTextFiltering: freeTextFiltering, onDismiss: () => { var _a; return (_a = tokenRef.current) === null || _a === void 0 ? void 0 : _a.closeEditor(); }, onSubmit: () => {
+            onChangeStandalone: emptyHandler, asyncProps: asyncProps, onLoadItems: onLoadItems, i18nStrings: i18nStrings, asyncProperties: asyncProperties, customGroupsText: customGroupsText, freeTextFiltering: freeTextFiltering, onDismiss: () => { var _a; return (_a = tokenRef.current) === null || _a === void 0 ? void 0 : _a.closeEditor(); }, onSubmit: () => {
                 var _a;
                 setToken(matchTokenValue(temporaryToken, filteringOptions));
                 (_a = tokenRef.current) === null || _a === void 0 ? void 0 : _a.closeEditor();
             } }), editorHeader: (_f = i18nStrings.editTokenHeader) !== null && _f !== void 0 ? _f : '', editorDismissAriaLabel: (_g = i18nStrings.dismissAriaLabel) !== null && _g !== void 0 ? _g : '', editorExpandToViewport: !!expandToViewport, onEditorOpen: () => setTemporaryToken(token), 
         // The properties below are only relevant for grouped tokens that are not supported
         // by the property filter component yet.
-        groupOperation: operation, groupAriaLabel: '', groupEditAriaLabel: '', onChangeGroupOperation: () => { }, hasGroups: false }));
+        groupOperation: operation, groupAriaLabel: '', groupEditAriaLabel: '', onChangeGroupOperation: () => { }, hasGroups: false, popoverSize: enableTokenGroups ? 'content' : 'large' }));
 };
 const TokenTrigger = ({ token: { propertyLabel, operator, value }, allProperties, }) => {
     if (propertyLabel) {

package/property-filter/token.js.map

@@ -1 +1 @@
-{"version":3,"file":"token.js","sourceRoot":"","sources":["../../../src/property-filter/token.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAIhD,OAAO,cAAqC,MAAM,mBAAmB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAajD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE1C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAsBrC,MAAM,YAAY,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;AAC9B,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,EAAE,CAAC;AAE5B,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAC1B,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,KAAK,EACL,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,mBAAmB,EACnB,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,WAAW,EACX,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,QAAQ,EACR,iBAAiB,EACjB,gBAAgB,GACL,EAAE,EAAE;;IACf,MAAM,QAAQ,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACjD,MAAM,cAAc,GAAG,iBAAiB,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;IAC7D,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAgB,KAAK,CAAC,CAAC;IAC3E,OAAO,CACL,oBAAC,cAAc,IACb,GAAG,EAAE,QAAQ,EACb,MAAM,EAAE;YACN;gBACE,OAAO,EAAE,CACP,8BAAM,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC;oBACtC,oBAAC,YAAY,IAAC,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,KAAK,CAAC,QAAQ,KAAK,IAAI,GAAI,CAC1E,CACR;gBACD,SAAS,EAAE,GAAG,cAAc,CAAC,aAAa,IAAI,cAAc,CAAC,QAAQ,IAAI,cAAc,CAAC,KAAK,EAAE;gBAC/F,gBAAgB,EAAE,MAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,0BAA0B,4DAAG,cAAc,CAAC,mCAAI,EAAE;aAClF;SACF,EACD,aAAa,EAAE,CAAC,KAAK,IAAI,CAAC,cAAc,EACxC,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,MAAA,WAAW,CAAC,gBAAgB,mCAAI,EAAE,EAC3C,MAAM,EAAE,MAAA,WAAW,CAAC,eAAe,mCAAI,EAAE,EACzC,kBAAkB,EAAE,MAAA,WAAW,CAAC,sBAAsB,mCAAI,EAAE,EAC5D,iBAAiB,EAAE,YAAY,EAC/B,cAAc,EAAE,WAAW,EAC3B,QAAQ,EAAE,QAAQ,EAClB,aAAa,EACX,oBAAC,WAAW,IACV,cAAc,EAAE,KAAK,EACrB,mBAAmB,EAAE,mBAAmB,EACxC,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAE,CAAC,cAAc,CAAC,EAC3B,iBAAiB,EAAE,QAAQ,CAAC,EAAE,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;YAC7D,0DAA0D;YAC1D,gBAAgB,EAAE,EAAE;YACpB,0DAA0D;YAC1D,kBAAkB,EAAE,YAAY,EAChC,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,WAAW,kCACN,WAAW;gBACd,6DAA6D;gBAC7D,4BAA4B,EAAE,UAAU,EACxC,2BAA2B,EAAE,UAAU,EACvC,oCAAoC,EAAE,UAAU,EAChD,2BAA2B,EAAE,EAAE,EAC/B,+BAA+B,EAAE,EAAE,EACnC,gCAAgC,EAAE,UAAU,KAE9C,eAAe,EAAE,eAAe,EAChC,gBAAgB,EAAE,gBAAgB,EAClC,iBAAiB,EAAE,iBAAiB,EACpC,SAAS,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,QAAQ,CAAC,OAAO,0CAAE,WAAW,EAAE,CAAA,EAAA,EAChD,QAAQ,EAAE,GAAG,EAAE;;gBACb,QAAQ,CAAC,eAAe,CAAC,cAAc,EAAE,gBAAgB,CAAC,CAAC,CAAC;gBAC5D,MAAA,QAAQ,CAAC,OAAO,0CAAE,WAAW,EAAE,CAAC;YAClC,CAAC,GACD,EAEJ,YAAY,EAAE,MAAA,WAAW,CAAC,eAAe,mCAAI,EAAE,EAC/C,sBAAsB,EAAE,MAAA,WAAW,CAAC,gBAAgB,mCAAI,EAAE,EAC1D,sBAAsB,EAAE,CAAC,CAAC,gBAAgB,EAC1C,YAAY,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC;QAC5C,mFAAmF;QACnF,wCAAwC;QACxC,cAAc,EAAE,SAAS,EACzB,cAAc,EAAE,EAAE,EAClB,kBAAkB,EAAE,EAAE,EACtB,sBAAsB,EAAE,GAAG,EAAE,GAAE,CAAC,EAChC,SAAS,EAAE,KAAK,GAChB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EACpB,KAAK,EAAE,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,EACzC,aAAa,GAId,EAAE,EAAE;IACH,IAAI,aAAa,EAAE;QACjB,aAAa,IAAI,GAAG,CAAC;KACtB;IACD,MAAM,qBAAqB,GAAG,QAAQ,KAAK,GAAG,IAAI,aAAa,CAAC;IAChE,MAAM,YAAY,GAAG,qBAAqB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,GAAG,GAAG,CAAC;IACjE,OAAO,CACL;QACG,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,aAAa;QACnC,8BAAM,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,IAAG,YAAY,CAAQ;QAC/D,KAAK,CACL,CACJ,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { useRef, useState } from 'react';\n\nimport { DropdownStatusProps } from '../internal/components/dropdown-status/interfaces';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport FilteringToken, { FilteringTokenRef } from './filtering-token';\nimport { getFormattedToken } from './i18n-utils';\nimport {\n  FormattedToken,\n  GroupText,\n  I18nStrings,\n  InternalFilteringOption,\n  InternalFilteringProperty,\n  InternalFreeTextFiltering,\n  InternalToken,\n  JoinOperation,\n  LoadItemsDetail,\n  Token,\n} from './interfaces';\nimport { TokenEditor } from './token-editor';\nimport { matchTokenValue } from './utils';\n\nimport styles from './styles.css.js';\n\ninterface TokenProps {\n  asyncProperties?: boolean;\n  asyncProps: DropdownStatusProps;\n  customGroupsText: readonly GroupText[];\n  disabled?: boolean;\n  freeTextFiltering: InternalFreeTextFiltering;\n  expandToViewport?: boolean;\n  filteringProperties: readonly InternalFilteringProperty[];\n  filteringOptions: readonly InternalFilteringOption[];\n  first?: boolean;\n  hideOperations?: boolean;\n  i18nStrings: I18nStrings;\n  onLoadItems?: NonCancelableEventHandler<LoadItemsDetail>;\n  operation: JoinOperation;\n  removeToken: () => void;\n  setOperation: (newOperation: JoinOperation) => void;\n  setToken: (newToken: Token) => void;\n  token: InternalToken;\n}\n\nconst emptyHandler = () => {};\nconst emptyLabel = () => '';\n\nexport const TokenButton = ({\n  token,\n  operation = 'and',\n  first,\n  removeToken,\n  setToken,\n  setOperation,\n  filteringProperties,\n  filteringOptions,\n  asyncProps,\n  onLoadItems,\n  i18nStrings,\n  asyncProperties,\n  hideOperations,\n  customGroupsText,\n  disabled,\n  freeTextFiltering,\n  expandToViewport,\n}: TokenProps) => {\n  const tokenRef = useRef<FilteringTokenRef>(null);\n  const formattedToken = getFormattedToken(token, i18nStrings);\n  const [temporaryToken, setTemporaryToken] = useState<InternalToken>(token);\n  return (\n    <FilteringToken\n      ref={tokenRef}\n      tokens={[\n        {\n          content: (\n            <span className={styles['token-trigger']}>\n              <TokenTrigger token={formattedToken} allProperties={token.property === null} />\n            </span>\n          ),\n          ariaLabel: `${formattedToken.propertyLabel} ${formattedToken.operator} ${formattedToken.value}`,\n          dismissAriaLabel: i18nStrings?.removeTokenButtonAriaLabel?.(formattedToken) ?? '',\n        },\n      ]}\n      showOperation={!first && !hideOperations}\n      operation={operation}\n      andText={i18nStrings.operationAndText ?? ''}\n      orText={i18nStrings.operationOrText ?? ''}\n      operationAriaLabel={i18nStrings.tokenOperatorAriaLabel ?? ''}\n      onChangeOperation={setOperation}\n      onDismissToken={removeToken}\n      disabled={disabled}\n      editorContent={\n        <TokenEditor\n          supportsGroups={false}\n          filteringProperties={filteringProperties}\n          filteringOptions={filteringOptions}\n          tempGroup={[temporaryToken]}\n          onChangeTempGroup={newGroup => setTemporaryToken(newGroup[0])}\n          // This property will be needed when supportsGroups={true}\n          standaloneTokens={[]}\n          // This property will be needed when supportsGroups={true}\n          onChangeStandalone={emptyHandler}\n          asyncProps={asyncProps}\n          onLoadItems={onLoadItems}\n          i18nStrings={{\n            ...i18nStrings,\n            // These properties will be needed when supportsGroups={true}\n            tokenEditorTokenActionsLabel: emptyLabel,\n            tokenEditorTokenRemoveLabel: emptyLabel,\n            tokenEditorTokenRemoveFromGroupLabel: emptyLabel,\n            tokenEditorAddNewTokenLabel: '',\n            tokenEditorAddTokenActionsLabel: '',\n            tokenEditorAddExistingTokenLabel: emptyLabel,\n          }}\n          asyncProperties={asyncProperties}\n          customGroupsText={customGroupsText}\n          freeTextFiltering={freeTextFiltering}\n          onDismiss={() => tokenRef.current?.closeEditor()}\n          onSubmit={() => {\n            setToken(matchTokenValue(temporaryToken, filteringOptions));\n            tokenRef.current?.closeEditor();\n          }}\n        />\n      }\n      editorHeader={i18nStrings.editTokenHeader ?? ''}\n      editorDismissAriaLabel={i18nStrings.dismissAriaLabel ?? ''}\n      editorExpandToViewport={!!expandToViewport}\n      onEditorOpen={() => setTemporaryToken(token)}\n      // The properties below are only relevant for grouped tokens that are not supported\n      // by the property filter component yet.\n      groupOperation={operation}\n      groupAriaLabel={''}\n      groupEditAriaLabel={''}\n      onChangeGroupOperation={() => {}}\n      hasGroups={false}\n    />\n  );\n};\n\nconst TokenTrigger = ({\n  token: { propertyLabel, operator, value },\n  allProperties,\n}: {\n  token: FormattedToken;\n  allProperties: boolean;\n}) => {\n  if (propertyLabel) {\n    propertyLabel += ' ';\n  }\n  const freeTextContainsToken = operator === ':' && allProperties;\n  const operatorText = freeTextContainsToken ? '' : operator + ' ';\n  return (\n    <>\n      {allProperties ? '' : propertyLabel}\n      <span className={styles['token-operator']}>{operatorText}</span>\n      {value}\n    </>\n  );\n};\n"]}
+{"version":3,"file":"token.js","sourceRoot":"","sources":["../../../src/property-filter/token.tsx"],"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 React, { useRef, useState } from 'react';\n\nimport { DropdownStatusProps } from '../internal/components/dropdown-status/interfaces';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport FilteringToken, { FilteringTokenRef } from './filtering-token';\nimport { getFormattedToken } from './i18n-utils';\nimport {\n  FormattedToken,\n  GroupText,\n  I18nStrings,\n  InternalFilteringOption,\n  InternalFilteringProperty,\n  InternalFreeTextFiltering,\n  InternalToken,\n  JoinOperation,\n  LoadItemsDetail,\n  Token,\n} from './interfaces';\nimport { TokenEditor } from './token-editor';\nimport { matchTokenValue } from './utils';\n\nimport styles from './styles.css.js';\n\ninterface TokenProps {\n  asyncProperties?: boolean;\n  asyncProps: DropdownStatusProps;\n  customGroupsText: readonly GroupText[];\n  disabled?: boolean;\n  freeTextFiltering: InternalFreeTextFiltering;\n  expandToViewport?: boolean;\n  filteringProperties: readonly InternalFilteringProperty[];\n  filteringOptions: readonly InternalFilteringOption[];\n  first?: boolean;\n  hideOperations?: boolean;\n  i18nStrings: I18nStrings;\n  onLoadItems?: NonCancelableEventHandler<LoadItemsDetail>;\n  operation: JoinOperation;\n  removeToken: () => void;\n  setOperation: (newOperation: JoinOperation) => void;\n  setToken: (newToken: Token) => void;\n  token: InternalToken;\n  enableTokenGroups: boolean;\n}\n\nconst emptyHandler = () => {};\n\nexport const TokenButton = ({\n  token,\n  operation = 'and',\n  first,\n  removeToken,\n  setToken,\n  setOperation,\n  filteringProperties,\n  filteringOptions,\n  asyncProps,\n  onLoadItems,\n  i18nStrings,\n  asyncProperties,\n  hideOperations,\n  customGroupsText,\n  disabled,\n  freeTextFiltering,\n  expandToViewport,\n  enableTokenGroups,\n}: TokenProps) => {\n  const tokenRef = useRef<FilteringTokenRef>(null);\n  const formattedToken = getFormattedToken(token, i18nStrings);\n  const [temporaryToken, setTemporaryToken] = useState<InternalToken>(token);\n  return (\n    <FilteringToken\n      ref={tokenRef}\n      tokens={[\n        {\n          content: (\n            <span className={styles['token-trigger']}>\n              <TokenTrigger token={formattedToken} allProperties={token.property === null} />\n            </span>\n          ),\n          ariaLabel: `${formattedToken.propertyLabel} ${formattedToken.operator} ${formattedToken.value}`,\n          dismissAriaLabel: i18nStrings?.removeTokenButtonAriaLabel?.(formattedToken) ?? '',\n        },\n      ]}\n      showOperation={!first && !hideOperations}\n      operation={operation}\n      andText={i18nStrings.operationAndText ?? ''}\n      orText={i18nStrings.operationOrText ?? ''}\n      operationAriaLabel={i18nStrings.tokenOperatorAriaLabel ?? ''}\n      onChangeOperation={setOperation}\n      onDismissToken={removeToken}\n      disabled={disabled}\n      editorContent={\n        <TokenEditor\n          supportsGroups={enableTokenGroups}\n          filteringProperties={filteringProperties}\n          filteringOptions={filteringOptions}\n          tempGroup={[temporaryToken]}\n          onChangeTempGroup={newGroup => setTemporaryToken(newGroup[0])}\n          // This property will be needed when supportsGroups={true}\n          standaloneTokens={[]}\n          // This property will be needed when supportsGroups={true}\n          onChangeStandalone={emptyHandler}\n          asyncProps={asyncProps}\n          onLoadItems={onLoadItems}\n          i18nStrings={i18nStrings}\n          asyncProperties={asyncProperties}\n          customGroupsText={customGroupsText}\n          freeTextFiltering={freeTextFiltering}\n          onDismiss={() => tokenRef.current?.closeEditor()}\n          onSubmit={() => {\n            setToken(matchTokenValue(temporaryToken, filteringOptions));\n            tokenRef.current?.closeEditor();\n          }}\n        />\n      }\n      editorHeader={i18nStrings.editTokenHeader ?? ''}\n      editorDismissAriaLabel={i18nStrings.dismissAriaLabel ?? ''}\n      editorExpandToViewport={!!expandToViewport}\n      onEditorOpen={() => setTemporaryToken(token)}\n      // The properties below are only relevant for grouped tokens that are not supported\n      // by the property filter component yet.\n      groupOperation={operation}\n      groupAriaLabel={''}\n      groupEditAriaLabel={''}\n      onChangeGroupOperation={() => {}}\n      hasGroups={false}\n      popoverSize={enableTokenGroups ? 'content' : 'large'}\n    />\n  );\n};\n\nconst TokenTrigger = ({\n  token: { propertyLabel, operator, value },\n  allProperties,\n}: {\n  token: FormattedToken;\n  allProperties: boolean;\n}) => {\n  if (propertyLabel) {\n    propertyLabel += ' ';\n  }\n  const freeTextContainsToken = operator === ':' && allProperties;\n  const operatorText = freeTextContainsToken ? '' : operator + ' ';\n  return (\n    <>\n      {allProperties ? '' : propertyLabel}\n      <span className={styles['token-operator']}>{operatorText}</span>\n      {value}\n    </>\n  );\n};\n"]}

package/side-navigation/implementation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/side-navigation/implementation.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAMnD,MAAM,MAAM,2BAA2B,GAAG,mBAAmB,GAAG,0BAA0B,CAAC;AAE3F,wBAAgB,4BAA4B,CAAC,EAC3C,MAAM,EACN,UAAU,EACV,KAAU,EACV,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,2BAA2B,eAuD7B;AAED,eAAO,MAAM,8BAA8B,mGAA0D,CAAC"}
+{"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/side-navigation/implementation.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAMnD,MAAM,MAAM,2BAA2B,GAAG,mBAAmB,GAAG,0BAA0B,CAAC;AAE3F,wBAAgB,4BAA4B,CAAC,EAC3C,MAAM,EACN,UAAU,EACV,KAAU,EACV,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,2BAA2B,eAwD7B;AAED,eAAO,MAAM,8BAA8B,mGAA0D,CAAC"}

package/side-navigation/implementation.js

@@ -3,7 +3,7 @@ import { __rest } from "tslib";
 // SPDX-License-Identifier: Apache-2.0
 import React, { useCallback, useEffect, useMemo } from 'react';
 import clsx from 'clsx';
-import { isAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';
+import { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';
 import { getBaseProps } from '../internal/base-component';
 import { fireCancelableEvent, fireNonCancelableEvent } from '../internal/events';
 import { isDevelopment } from '../internal/is-development';
@@ -14,6 +14,7 @@ import styles from './styles.css.js';
 export function SideNavigationImplementation(_a) {
     var { header, activeHref, items = [], onFollow, onChange, __internalRootRef } = _a, props = __rest(_a, ["header", "activeHref", "items", "onFollow", "onChange", "__internalRootRef"]);
     const baseProps = getBaseProps(props);
+    const isToolbar = useAppLayoutToolbarEnabled();
     const parentMap = useMemo(() => generateExpandableItemsMapping(items), [items]);
     if (isDevelopment) {
         // This code should be wiped in production anyway.
@@ -28,7 +29,7 @@ export function SideNavigationImplementation(_a) {
     const onFollowHandler = useCallback((item, sourceEvent) => {
         fireCancelableEvent(onFollow, item, sourceEvent);
     }, [onFollow]);
-    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, baseProps.className, isAppLayoutToolbarEnabled() && styles['with-toolbar']), ref: __internalRootRef }),
+    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, baseProps.className, isToolbar && styles['with-toolbar']), ref: __internalRootRef }),
         header && (React.createElement(Header, { definition: header, activeHref: activeHref, fireChange: onChangeHandler, fireFollow: onFollowHandler })),
         items && (React.createElement("div", { className: styles['list-container'] },
             React.createElement(NavigationItemsList, { variant: "root", items: items, fireFollow: onFollowHandler, fireChange: onChangeHandler, activeHref: activeHref })))));

package/side-navigation/implementation.js.map

@@ -1 +1 @@
-{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/side-navigation/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,yBAAyB,EAAE,MAAM,mCAAmC,CAAC;AAC9E,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAEjF,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAEhE,OAAO,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAE,8BAA8B,EAAE,MAAM,QAAQ,CAAC;AAE7E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,4BAA4B,CAAC,EAQf;QARe,EAC3C,MAAM,EACN,UAAU,EACV,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,QAAQ,EACR,iBAAiB,OAEW,EADzB,KAAK,cAPmC,8EAQ5C,CADS;IAER,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,8BAA8B,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEhF,IAAI,aAAa,EAAE;QACjB,kDAAkD;QAClD,sDAAsD;QACtD,SAAS,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;KACtD;IAED,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,IAA2E,EAAE,QAAiB,EAAE,EAAE;QACjG,wGAAwG;QACxG,oEAAoE;QACpE,sBAAsB,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,iBAAiB,EAAE,SAAS,CAAC,GAAG,CAAC,IAAI,CAAE,EAAE,CAAC,CAAC;IAC1G,CAAC,EACD,CAAC,QAAQ,EAAE,SAAS,CAAC,CACtB,CAAC;IAEF,MAAM,eAAe,GAAG,WAAW,CACjC,CACE,IAI2C,EAC3C,WAAyC,EACzC,EAAE;QACF,mBAAmB,CAAC,QAAQ,EAAE,IAAI,EAAE,WAAW,CAAC,CAAC;IACnD,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,EAAE,yBAAyB,EAAE,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,EACxG,GAAG,EAAE,iBAAiB;QAErB,MAAM,IAAI,CACT,oBAAC,MAAM,IAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,eAAe,EAAE,UAAU,EAAE,eAAe,GAAI,CACjH;QACA,KAAK,IAAI,CACR,6BAAK,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC;YACtC,oBAAC,mBAAmB,IAClB,OAAO,EAAC,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,eAAe,EAC3B,UAAU,EAAE,eAAe,EAC3B,UAAU,EAAE,UAAU,GACtB,CACE,CACP,CACG,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,8BAA8B,GAAG,yBAAyB,CAAC,4BAA4B,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useMemo } from 'react';\nimport clsx from 'clsx';\n\nimport { isAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireCancelableEvent, fireNonCancelableEvent } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { isDevelopment } from '../internal/is-development';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport { SideNavigationProps } from './interfaces';\nimport { Header, NavigationItemsList } from './parts';\nimport { checkDuplicateHrefs, generateExpandableItemsMapping } from './util';\n\nimport styles from './styles.css.js';\n\nexport type SideNavigationInternalProps = SideNavigationProps & InternalBaseComponentProps;\n\nexport function SideNavigationImplementation({\n  header,\n  activeHref,\n  items = [],\n  onFollow,\n  onChange,\n  __internalRootRef,\n  ...props\n}: SideNavigationInternalProps) {\n  const baseProps = getBaseProps(props);\n  const parentMap = useMemo(() => generateExpandableItemsMapping(items), [items]);\n\n  if (isDevelopment) {\n    // This code should be wiped in production anyway.\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    useEffect(() => checkDuplicateHrefs(items), [items]);\n  }\n\n  const onChangeHandler = useCallback(\n    (item: SideNavigationProps.Section | SideNavigationProps.ExpandableLinkGroup, expanded: boolean) => {\n      // generateExpandableItemsMapping walks through the entire tree, so we're certain about getting a value.\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n      fireNonCancelableEvent(onChange, { item, expanded: expanded, expandableParents: parentMap.get(item)! });\n    },\n    [onChange, parentMap]\n  );\n\n  const onFollowHandler = useCallback(\n    (\n      item:\n        | SideNavigationProps.Link\n        | SideNavigationProps.Header\n        | SideNavigationProps.LinkGroup\n        | SideNavigationProps.ExpandableLinkGroup,\n      sourceEvent: React.SyntheticEvent | Event\n    ) => {\n      fireCancelableEvent(onFollow, item, sourceEvent);\n    },\n    [onFollow]\n  );\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(styles.root, baseProps.className, isAppLayoutToolbarEnabled() && styles['with-toolbar'])}\n      ref={__internalRootRef}\n    >\n      {header && (\n        <Header definition={header} activeHref={activeHref} fireChange={onChangeHandler} fireFollow={onFollowHandler} />\n      )}\n      {items && (\n        <div className={styles['list-container']}>\n          <NavigationItemsList\n            variant=\"root\"\n            items={items}\n            fireFollow={onFollowHandler}\n            fireChange={onChangeHandler}\n            activeHref={activeHref}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const createWidgetizedSideNavigation = createWidgetizedComponent(SideNavigationImplementation);\n"]}
+{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/side-navigation/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAEjF,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAEhE,OAAO,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAE,8BAA8B,EAAE,MAAM,QAAQ,CAAC;AAE7E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,4BAA4B,CAAC,EAQf;QARe,EAC3C,MAAM,EACN,UAAU,EACV,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,QAAQ,EACR,iBAAiB,OAEW,EADzB,KAAK,cAPmC,8EAQ5C,CADS;IAER,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,8BAA8B,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEhF,IAAI,aAAa,EAAE;QACjB,kDAAkD;QAClD,sDAAsD;QACtD,SAAS,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;KACtD;IAED,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,IAA2E,EAAE,QAAiB,EAAE,EAAE;QACjG,wGAAwG;QACxG,oEAAoE;QACpE,sBAAsB,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,iBAAiB,EAAE,SAAS,CAAC,GAAG,CAAC,IAAI,CAAE,EAAE,CAAC,CAAC;IAC1G,CAAC,EACD,CAAC,QAAQ,EAAE,SAAS,CAAC,CACtB,CAAC;IAEF,MAAM,eAAe,GAAG,WAAW,CACjC,CACE,IAI2C,EAC3C,WAAyC,EACzC,EAAE;QACF,mBAAmB,CAAC,QAAQ,EAAE,IAAI,EAAE,WAAW,CAAC,CAAC;IACnD,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,EAAE,SAAS,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,EACtF,GAAG,EAAE,iBAAiB;QAErB,MAAM,IAAI,CACT,oBAAC,MAAM,IAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,eAAe,EAAE,UAAU,EAAE,eAAe,GAAI,CACjH;QACA,KAAK,IAAI,CACR,6BAAK,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC;YACtC,oBAAC,mBAAmB,IAClB,OAAO,EAAC,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,eAAe,EAC3B,UAAU,EAAE,eAAe,EAC3B,UAAU,EAAE,UAAU,GACtB,CACE,CACP,CACG,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,8BAA8B,GAAG,yBAAyB,CAAC,4BAA4B,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useMemo } from 'react';\nimport clsx from 'clsx';\n\nimport { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireCancelableEvent, fireNonCancelableEvent } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { isDevelopment } from '../internal/is-development';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport { SideNavigationProps } from './interfaces';\nimport { Header, NavigationItemsList } from './parts';\nimport { checkDuplicateHrefs, generateExpandableItemsMapping } from './util';\n\nimport styles from './styles.css.js';\n\nexport type SideNavigationInternalProps = SideNavigationProps & InternalBaseComponentProps;\n\nexport function SideNavigationImplementation({\n  header,\n  activeHref,\n  items = [],\n  onFollow,\n  onChange,\n  __internalRootRef,\n  ...props\n}: SideNavigationInternalProps) {\n  const baseProps = getBaseProps(props);\n  const isToolbar = useAppLayoutToolbarEnabled();\n  const parentMap = useMemo(() => generateExpandableItemsMapping(items), [items]);\n\n  if (isDevelopment) {\n    // This code should be wiped in production anyway.\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    useEffect(() => checkDuplicateHrefs(items), [items]);\n  }\n\n  const onChangeHandler = useCallback(\n    (item: SideNavigationProps.Section | SideNavigationProps.ExpandableLinkGroup, expanded: boolean) => {\n      // generateExpandableItemsMapping walks through the entire tree, so we're certain about getting a value.\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n      fireNonCancelableEvent(onChange, { item, expanded: expanded, expandableParents: parentMap.get(item)! });\n    },\n    [onChange, parentMap]\n  );\n\n  const onFollowHandler = useCallback(\n    (\n      item:\n        | SideNavigationProps.Link\n        | SideNavigationProps.Header\n        | SideNavigationProps.LinkGroup\n        | SideNavigationProps.ExpandableLinkGroup,\n      sourceEvent: React.SyntheticEvent | Event\n    ) => {\n      fireCancelableEvent(onFollow, item, sourceEvent);\n    },\n    [onFollow]\n  );\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(styles.root, baseProps.className, isToolbar && styles['with-toolbar'])}\n      ref={__internalRootRef}\n    >\n      {header && (\n        <Header definition={header} activeHref={activeHref} fireChange={onChangeHandler} fireFollow={onFollowHandler} />\n      )}\n      {items && (\n        <div className={styles['list-container']}>\n          <NavigationItemsList\n            variant=\"root\"\n            items={items}\n            fireFollow={onFollowHandler}\n            fireChange={onChangeHandler}\n            activeHref={activeHref}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const createWidgetizedSideNavigation = createWidgetizedComponent(SideNavigationImplementation);\n"]}

package/split-panel/bottom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"bottom.d.ts","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAKrE,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAKtD,UAAU,4BAA6B,SAAQ,sBAAsB;IACnE,KAAK,EAAE,gBAAgB,CAAC;IACxB,uBAAuB,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACxC,iBAAiB,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC;CACpD;AAED,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,MAAM,EACN,KAAK,EACL,uBAAuB,EACvB,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACT,EAAE,4BAA4B,eAuD9B"}
+{"version":3,"file":"bottom.d.ts","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAKrE,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAKtD,UAAU,4BAA6B,SAAQ,sBAAsB;IACnE,KAAK,EAAE,gBAAgB,CAAC;IACxB,uBAAuB,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACxC,iBAAiB,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC;CACpD;AAED,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,MAAM,EACN,KAAK,EACL,uBAAuB,EACvB,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACT,EAAE,4BAA4B,eAwD9B"}

package/split-panel/bottom.js

@@ -3,7 +3,7 @@
 import React, { useEffect, useRef } from 'react';
 import clsx from 'clsx';
 import { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';
-import { isAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';
+import { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';
 import { useSplitPanelContext } from '../internal/context/split-panel-context';
 import { useMergeRefs } from '../internal/hooks/use-merge-refs';
 import { useMobile } from '../internal/hooks/use-mobile';
@@ -12,6 +12,7 @@ import styles from './styles.css.js';
 import testUtilStyles from './test-classes/styles.css.js';
 export function SplitPanelContentBottom({ baseProps, isOpen, state, transitioningElementRef, splitPanelRef, cappedSize, header, resizeHandle, children, appLayoutMaxWidth, panelHeaderId, onToggle, }) {
     const isRefresh = useVisualRefresh();
+    const isToolbar = useAppLayoutToolbarEnabled();
     const { bottomOffset, leftOffset, rightOffset, disableContentPaddings, contentWrapperPaddings, reportHeaderHeight } = useSplitPanelContext();
     const transitionContentBottomRef = useMergeRefs(splitPanelRef || null, transitioningElementRef);
     const isMobile = useMobile();
@@ -34,7 +35,7 @@ export function SplitPanelContentBottom({ baseProps, isOpen, state, transitionin
             [styles['drawer-disable-content-paddings']]: disableContentPaddings,
             [styles.animating]: isRefresh && (state === 'entering' || state === 'exiting'),
             [styles.refresh]: isRefresh,
-            [styles['with-toolbar']]: isAppLayoutToolbarEnabled(),
+            [styles['with-toolbar']]: isToolbar,
         }), onClick: () => !isOpen && onToggle(), style: {
             insetBlockEnd: bottomOffset,
             insetInlineStart: leftOffset,