box-ui-elements 23.3.1-beta.1 → 23.4.0-beta.2

package/es/features/metadata-instance-fields/MetadataField.js.map

@@ -1 +1 @@
-{"version":3,"file":"MetadataField.js","names":["React","FormattedMessage","InlineError","TextMetadataField","EnumMetadataField","DateMetadataField","FloatMetadataField","IntegerMetadataField","MultiSelectMetadataField","ReadOnlyMetadataField","messages","FIELD_TYPE_ENUM","FIELD_TYPE_FLOAT","FIELD_TYPE_INTEGER","FIELD_TYPE_STRING","FIELD_TYPE_DATE","FIELD_TYPE_MULTISELECT","MetadataField","blurExceptionClassNames","dataKey","dataValue","displayName","description","error","isHidden","canEdit","onChange","onRemove","options","type","createElement","Error","title","invalidMetadataFieldType"],"sources":["../../../src/features/metadata-instance-fields/MetadataField.js"],"sourcesContent":["// @flow\nimport * as React from 'react';\nimport { FormattedMessage } from 'react-intl';\n\nimport InlineError from '../../components/inline-error/InlineError';\n\nimport TextMetadataField from './TextMetadataField';\nimport EnumMetadataField from './EnumMetadataField';\nimport DateMetadataField from './DateMetadataField';\nimport FloatMetadataField from './FloatMetadataField';\nimport IntegerMetadataField from './IntegerMetadataField';\nimport MultiSelectMetadataField from './MultiSelectMetadataField';\nimport ReadOnlyMetadataField from './ReadOnlyMetadataField';\nimport messages from './messages';\nimport type { MetadataFieldValue, MetadataTemplateFieldOption, MetadataFieldType } from '../../common/types/metadata';\n\nimport {\n    FIELD_TYPE_ENUM,\n    FIELD_TYPE_FLOAT,\n    FIELD_TYPE_INTEGER,\n    FIELD_TYPE_STRING,\n    FIELD_TYPE_DATE,\n    FIELD_TYPE_MULTISELECT,\n} from './constants';\n\ntype Props = {\n    blurExceptionClassNames?: Array<string>,\n    canEdit: boolean,\n    dataKey: string,\n    dataValue?: MetadataFieldValue,\n    description?: string,\n    displayName: string,\n    error?: React.Node,\n    isHidden?: boolean,\n    onChange?: (key: string, value: MetadataFieldValue) => void,\n    onRemove?: (key: string) => void,\n    options?: Array<MetadataTemplateFieldOption>,\n    type: MetadataFieldType,\n};\n\nconst MetadataField = ({\n    blurExceptionClassNames,\n    dataKey,\n    dataValue,\n    displayName,\n    description,\n    error,\n    isHidden,\n    canEdit,\n    onChange,\n    onRemove,\n    options,\n    type,\n}: Props) => {\n    if (isHidden) {\n        return null;\n    }\n\n    if (!canEdit) {\n        return (\n            <ReadOnlyMetadataField\n                dataValue={dataValue}\n                description={description}\n                displayName={displayName}\n                type={type}\n            />\n        );\n    }\n\n    if (!onChange || !onRemove) {\n        throw new Error('Need to have onChange and onRemove');\n    }\n\n    switch (type) {\n        case FIELD_TYPE_STRING:\n            return (\n                <TextMetadataField\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                />\n            );\n\n        case FIELD_TYPE_FLOAT:\n            return (\n                <FloatMetadataField\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    error={error}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                    type={type}\n                />\n            );\n\n        case FIELD_TYPE_INTEGER:\n            return (\n                <IntegerMetadataField\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    error={error}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                    type={type}\n                />\n            );\n\n        case FIELD_TYPE_ENUM:\n            return (\n                <EnumMetadataField\n                    blurExceptionClassNames={blurExceptionClassNames}\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                    options={options}\n                />\n            );\n\n        case FIELD_TYPE_MULTISELECT:\n            return (\n                <MultiSelectMetadataField\n                    blurExceptionClassNames={blurExceptionClassNames}\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                    options={options}\n                />\n            );\n\n        case FIELD_TYPE_DATE:\n            return (\n                <DateMetadataField\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                />\n            );\n\n        default:\n            return (\n                <InlineError title={type}>\n                    <FormattedMessage {...messages.invalidMetadataFieldType} />\n                </InlineError>\n            );\n    }\n};\n\nexport default MetadataField;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"MetadataField.js","names":["React","FormattedMessage","InlineError","TextMetadataField","EnumMetadataField","DateMetadataField","FloatMetadataField","IntegerMetadataField","MultiSelectMetadataField","ReadOnlyMetadataField","messages","FIELD_TYPE_ENUM","FIELD_TYPE_FLOAT","FIELD_TYPE_INTEGER","FIELD_TYPE_STRING","FIELD_TYPE_DATE","FIELD_TYPE_MULTISELECT","MetadataField","blurExceptionClassNames","dataKey","dataValue","displayName","description","error","isDisabled","isHidden","canEdit","onChange","onRemove","options","type","createElement","Error","title","invalidMetadataFieldType"],"sources":["../../../src/features/metadata-instance-fields/MetadataField.js"],"sourcesContent":["// @flow\nimport * as React from 'react';\nimport { FormattedMessage } from 'react-intl';\n\nimport InlineError from '../../components/inline-error/InlineError';\n\nimport TextMetadataField from './TextMetadataField';\nimport EnumMetadataField from './EnumMetadataField';\nimport DateMetadataField from './DateMetadataField';\nimport FloatMetadataField from './FloatMetadataField';\nimport IntegerMetadataField from './IntegerMetadataField';\nimport MultiSelectMetadataField from './MultiSelectMetadataField';\nimport ReadOnlyMetadataField from './ReadOnlyMetadataField';\nimport messages from './messages';\nimport type { MetadataFieldValue, MetadataTemplateFieldOption, MetadataFieldType } from '../../common/types/metadata';\n\nimport {\n    FIELD_TYPE_ENUM,\n    FIELD_TYPE_FLOAT,\n    FIELD_TYPE_INTEGER,\n    FIELD_TYPE_STRING,\n    FIELD_TYPE_DATE,\n    FIELD_TYPE_MULTISELECT,\n} from './constants';\n\ntype Props = {\n    blurExceptionClassNames?: Array<string>,\n    canEdit: boolean,\n    dataKey: string,\n    dataValue?: MetadataFieldValue,\n    description?: string,\n    displayName: string,\n    error?: React.Node,\n    isDisabled?: boolean,\n    isHidden?: boolean,\n    onChange?: (key: string, value: MetadataFieldValue) => void,\n    onRemove?: (key: string) => void,\n    options?: Array<MetadataTemplateFieldOption>,\n    type: MetadataFieldType,\n};\n\nconst MetadataField = ({\n    blurExceptionClassNames,\n    dataKey,\n    dataValue,\n    displayName,\n    description,\n    error,\n    isDisabled,\n    isHidden,\n    canEdit,\n    onChange,\n    onRemove,\n    options,\n    type,\n}: Props) => {\n    if (isHidden) {\n        return null;\n    }\n\n    if (!canEdit) {\n        return (\n            <ReadOnlyMetadataField\n                dataValue={dataValue}\n                description={description}\n                displayName={displayName}\n                type={type}\n            />\n        );\n    }\n\n    if (!onChange || !onRemove) {\n        throw new Error('Need to have onChange and onRemove');\n    }\n\n    switch (type) {\n        case FIELD_TYPE_STRING:\n            return (\n                <TextMetadataField\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    isDisabled={isDisabled}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                />\n            );\n\n        case FIELD_TYPE_FLOAT:\n            return (\n                <FloatMetadataField\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    error={error}\n                    isDisabled={isDisabled}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                    type={type}\n                />\n            );\n\n        case FIELD_TYPE_INTEGER:\n            return (\n                <IntegerMetadataField\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    error={error}\n                    isDisabled={isDisabled}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                    type={type}\n                />\n            );\n\n        case FIELD_TYPE_ENUM:\n            return (\n                <EnumMetadataField\n                    blurExceptionClassNames={blurExceptionClassNames}\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    isDisabled={isDisabled}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                    options={options}\n                />\n            );\n\n        case FIELD_TYPE_MULTISELECT:\n            return (\n                <MultiSelectMetadataField\n                    blurExceptionClassNames={blurExceptionClassNames}\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    isDisabled={isDisabled}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                    options={options}\n                />\n            );\n\n        case FIELD_TYPE_DATE:\n            return (\n                <DateMetadataField\n                    dataKey={dataKey}\n                    dataValue={dataValue}\n                    description={description}\n                    displayName={displayName}\n                    isDisabled={isDisabled}\n                    onChange={onChange}\n                    onRemove={onRemove}\n                />\n            );\n\n        default:\n            return (\n                <InlineError title={type}>\n                    <FormattedMessage {...messages.invalidMetadataFieldType} />\n                </InlineError>\n            );\n    }\n};\n\nexport default MetadataField;\n"],"mappings":"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","ignoreList":[]}

package/es/features/metadata-instance-fields/MultiSelectMetadataField.js

@@ -10,6 +10,7 @@ const MultiSelectMetadataField = ({
   dataValue,
   displayName,
   description,
+  isDisabled,
   onChange,
   onRemove,
   options = []
@@ -23,6 +24,7 @@ const MultiSelectMetadataField = ({
     className: "bdl-MultiSelectMetadataField-desc"
   }, description), /*#__PURE__*/React.createElement(MultiSelect, {
     blurExceptionClassNames: blurExceptionClassNames,
+    isDisabled: isDisabled,
     isEscapedWithReference: true,
     isScrollable: true,
     onChange: selectedOptions => {

package/es/features/metadata-instance-fields/MultiSelectMetadataField.js.flow

@@ -18,6 +18,7 @@ type Props = {
     dataValue?: MetadataFieldValue,
     description?: string,
     displayName: string,
+    isDisabled?: boolean,
     onChange: (key: string, value: MetadataFieldValue) => void,
     onRemove: (key: string) => void,
     options?: Array<MetadataTemplateFieldOption>,
@@ -29,6 +30,7 @@ const MultiSelectMetadataField = ({
     dataValue,
     displayName,
     description,
+    isDisabled,
     onChange,
     onRemove,
     options = [],
@@ -41,6 +43,7 @@ const MultiSelectMetadataField = ({
                 {!!description && <i className="bdl-MultiSelectMetadataField-desc">{description}</i>}
                 <MultiSelect
                     blurExceptionClassNames={blurExceptionClassNames}
+                    isDisabled={isDisabled}
                     isEscapedWithReference
                     isScrollable
                     onChange={(selectedOptions: Array<SelectOptionProp>) => {

package/es/features/metadata-instance-fields/MultiSelectMetadataField.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelectMetadataField.js","names":["React","FormattedMessage","Label","MultiSelect","messages","MultiSelectMetadataField","blurExceptionClassNames","dataKey","dataValue","displayName","description","onChange","onRemove","options","placeholder","createElement","metadataFieldMultiSelectValue","className","text","isEscapedWithReference","isScrollable","selectedOptions","length","map","value","option","displayText","key","selectedValues","MultiSelectMetadataFieldBase"],"sources":["../../../src/features/metadata-instance-fields/MultiSelectMetadataField.js"],"sourcesContent":["// @flow\nimport * as React from 'react';\nimport { FormattedMessage } from 'react-intl';\n\nimport Label from '../../components/label/Label';\nimport MultiSelect from '../../components/select-field/MultiSelectField';\nimport type { SelectOptionProp } from '../../components/select-field/props';\n\nimport messages from './messages';\n\nimport type { MetadataFieldValue, MetadataTemplateFieldOption } from '../../common/types/metadata';\n\nimport './MultiSelectMetadataField.scss';\n\ntype Props = {\n    blurExceptionClassNames?: Array<string>,\n    dataKey: string,\n    dataValue?: MetadataFieldValue,\n    description?: string,\n    displayName: string,\n    onChange: (key: string, value: MetadataFieldValue) => void,\n    onRemove: (key: string) => void,\n    options?: Array<MetadataTemplateFieldOption>,\n};\n\nconst MultiSelectMetadataField = ({\n    blurExceptionClassNames,\n    dataKey,\n    dataValue,\n    displayName,\n    description,\n    onChange,\n    onRemove,\n    options = [],\n}: Props) => {\n    const placeholder = <FormattedMessage {...messages.metadataFieldMultiSelectValue} />;\n\n    return (\n        <div className=\"bdl-MultiSelectMetadataField\">\n            <Label text={displayName}>\n                {!!description && <i className=\"bdl-MultiSelectMetadataField-desc\">{description}</i>}\n                <MultiSelect\n                    blurExceptionClassNames={blurExceptionClassNames}\n                    isEscapedWithReference\n                    isScrollable\n                    onChange={(selectedOptions: Array<SelectOptionProp>) => {\n                        if (selectedOptions.length) {\n                            onChange(\n                                dataKey,\n                                selectedOptions.map(({ value }) => value),\n                            );\n                        } else {\n                            onRemove(dataKey);\n                        }\n                    }}\n                    options={options.map(option => ({\n                        displayText: option.key,\n                        value: option.key,\n                    }))}\n                    placeholder={placeholder}\n                    selectedValues={dataValue}\n                />\n            </Label>\n        </div>\n    );\n};\n\nexport { MultiSelectMetadataField as MultiSelectMetadataFieldBase };\nexport default MultiSelectMetadataField;\n"],"mappings":"AACA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,YAAY;AAE7C,OAAOC,KAAK,MAAM,8BAA8B;AAChD,OAAOC,WAAW,MAAM,gDAAgD;AAGxE,OAAOC,QAAQ,MAAM,YAAY;AAIjC,OAAO,iCAAiC;AAaxC,MAAMC,wBAAwB,GAAGA,CAAC;EAC9BC,uBAAuB;EACvBC,OAAO;EACPC,SAAS;EACTC,WAAW;EACXC,WAAW;EACXC,QAAQ;EACRC,QAAQ;EACRC,OAAO,GAAG;AACP,CAAC,KAAK;EACT,MAAMC,WAAW,gBAAGd,KAAA,CAAAe,aAAA,CAACd,gBAAgB,EAAKG,QAAQ,CAACY,6BAAgC,CAAC;EAEpF,oBACIhB,KAAA,CAAAe,aAAA;IAAKE,SAAS,EAAC;EAA8B,gBACzCjB,KAAA,CAAAe,aAAA,CAACb,KAAK;IAACgB,IAAI,EAAET;EAAY,GACpB,CAAC,CAACC,WAAW,iBAAIV,KAAA,CAAAe,aAAA;IAAGE,SAAS,EAAC;EAAmC,GAAEP,WAAe,CAAC,eACpFV,KAAA,CAAAe,aAAA,CAACZ,WAAW;IACRG,uBAAuB,EAAEA,uBAAwB;IACjDa,sBAAsB;IACtBC,YAAY;IACZT,QAAQ,EAAGU,eAAwC,IAAK;MACpD,IAAIA,eAAe,CAACC,MAAM,EAAE;QACxBX,QAAQ,CACJJ,OAAO,EACPc,eAAe,CAACE,GAAG,CAAC,CAAC;UAAEC;QAAM,CAAC,KAAKA,KAAK,CAC5C,CAAC;MACL,CAAC,MAAM;QACHZ,QAAQ,CAACL,OAAO,CAAC;MACrB;IACJ,CAAE;IACFM,OAAO,EAAEA,OAAO,CAACU,GAAG,CAACE,MAAM,KAAK;MAC5BC,WAAW,EAAED,MAAM,CAACE,GAAG;MACvBH,KAAK,EAAEC,MAAM,CAACE;IAClB,CAAC,CAAC,CAAE;IACJb,WAAW,EAAEA,WAAY;IACzBc,cAAc,EAAEpB;EAAU,CAC7B,CACE,CACN,CAAC;AAEd,CAAC;AAED,SAASH,wBAAwB,IAAIwB,4BAA4B;AACjE,eAAexB,wBAAwB","ignoreList":[]}
+{"version":3,"file":"MultiSelectMetadataField.js","names":["React","FormattedMessage","Label","MultiSelect","messages","MultiSelectMetadataField","blurExceptionClassNames","dataKey","dataValue","displayName","description","isDisabled","onChange","onRemove","options","placeholder","createElement","metadataFieldMultiSelectValue","className","text","isEscapedWithReference","isScrollable","selectedOptions","length","map","value","option","displayText","key","selectedValues","MultiSelectMetadataFieldBase"],"sources":["../../../src/features/metadata-instance-fields/MultiSelectMetadataField.js"],"sourcesContent":["// @flow\nimport * as React from 'react';\nimport { FormattedMessage } from 'react-intl';\n\nimport Label from '../../components/label/Label';\nimport MultiSelect from '../../components/select-field/MultiSelectField';\nimport type { SelectOptionProp } from '../../components/select-field/props';\n\nimport messages from './messages';\n\nimport type { MetadataFieldValue, MetadataTemplateFieldOption } from '../../common/types/metadata';\n\nimport './MultiSelectMetadataField.scss';\n\ntype Props = {\n    blurExceptionClassNames?: Array<string>,\n    dataKey: string,\n    dataValue?: MetadataFieldValue,\n    description?: string,\n    displayName: string,\n    isDisabled?: boolean,\n    onChange: (key: string, value: MetadataFieldValue) => void,\n    onRemove: (key: string) => void,\n    options?: Array<MetadataTemplateFieldOption>,\n};\n\nconst MultiSelectMetadataField = ({\n    blurExceptionClassNames,\n    dataKey,\n    dataValue,\n    displayName,\n    description,\n    isDisabled,\n    onChange,\n    onRemove,\n    options = [],\n}: Props) => {\n    const placeholder = <FormattedMessage {...messages.metadataFieldMultiSelectValue} />;\n\n    return (\n        <div className=\"bdl-MultiSelectMetadataField\">\n            <Label text={displayName}>\n                {!!description && <i className=\"bdl-MultiSelectMetadataField-desc\">{description}</i>}\n                <MultiSelect\n                    blurExceptionClassNames={blurExceptionClassNames}\n                    isDisabled={isDisabled}\n                    isEscapedWithReference\n                    isScrollable\n                    onChange={(selectedOptions: Array<SelectOptionProp>) => {\n                        if (selectedOptions.length) {\n                            onChange(\n                                dataKey,\n                                selectedOptions.map(({ value }) => value),\n                            );\n                        } else {\n                            onRemove(dataKey);\n                        }\n                    }}\n                    options={options.map(option => ({\n                        displayText: option.key,\n                        value: option.key,\n                    }))}\n                    placeholder={placeholder}\n                    selectedValues={dataValue}\n                />\n            </Label>\n        </div>\n    );\n};\n\nexport { MultiSelectMetadataField as MultiSelectMetadataFieldBase };\nexport default MultiSelectMetadataField;\n"],"mappings":"AACA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,YAAY;AAE7C,OAAOC,KAAK,MAAM,8BAA8B;AAChD,OAAOC,WAAW,MAAM,gDAAgD;AAGxE,OAAOC,QAAQ,MAAM,YAAY;AAIjC,OAAO,iCAAiC;AAcxC,MAAMC,wBAAwB,GAAGA,CAAC;EAC9BC,uBAAuB;EACvBC,OAAO;EACPC,SAAS;EACTC,WAAW;EACXC,WAAW;EACXC,UAAU;EACVC,QAAQ;EACRC,QAAQ;EACRC,OAAO,GAAG;AACP,CAAC,KAAK;EACT,MAAMC,WAAW,gBAAGf,KAAA,CAAAgB,aAAA,CAACf,gBAAgB,EAAKG,QAAQ,CAACa,6BAAgC,CAAC;EAEpF,oBACIjB,KAAA,CAAAgB,aAAA;IAAKE,SAAS,EAAC;EAA8B,gBACzClB,KAAA,CAAAgB,aAAA,CAACd,KAAK;IAACiB,IAAI,EAAEV;EAAY,GACpB,CAAC,CAACC,WAAW,iBAAIV,KAAA,CAAAgB,aAAA;IAAGE,SAAS,EAAC;EAAmC,GAAER,WAAe,CAAC,eACpFV,KAAA,CAAAgB,aAAA,CAACb,WAAW;IACRG,uBAAuB,EAAEA,uBAAwB;IACjDK,UAAU,EAAEA,UAAW;IACvBS,sBAAsB;IACtBC,YAAY;IACZT,QAAQ,EAAGU,eAAwC,IAAK;MACpD,IAAIA,eAAe,CAACC,MAAM,EAAE;QACxBX,QAAQ,CACJL,OAAO,EACPe,eAAe,CAACE,GAAG,CAAC,CAAC;UAAEC;QAAM,CAAC,KAAKA,KAAK,CAC5C,CAAC;MACL,CAAC,MAAM;QACHZ,QAAQ,CAACN,OAAO,CAAC;MACrB;IACJ,CAAE;IACFO,OAAO,EAAEA,OAAO,CAACU,GAAG,CAACE,MAAM,KAAK;MAC5BC,WAAW,EAAED,MAAM,CAACE,GAAG;MACvBH,KAAK,EAAEC,MAAM,CAACE;IAClB,CAAC,CAAC,CAAE;IACJb,WAAW,EAAEA,WAAY;IACzBc,cAAc,EAAErB;EAAU,CAC7B,CACE,CACN,CAAC;AAEd,CAAC;AAED,SAASH,wBAAwB,IAAIyB,4BAA4B;AACjE,eAAezB,wBAAwB","ignoreList":[]}

package/es/features/metadata-instance-fields/TextMetadataField.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { injectIntl } from 'react-intl';
+import { useIntl } from 'react-intl';
 import TextInput from '../../components/text-input';
 import messages from './messages';
 import './TextMetadataField.scss';
@@ -9,11 +9,14 @@ const TextMetadataField = ({
   displayName,
   description,
   error,
-  intl,
+  isDisabled,
   onChange,
   onRemove,
   type = 'text'
 }) => {
+  const {
+    formatMessage
+  } = useIntl();
   let value = '';
   if (typeof dataValue === 'number') {
     value = dataValue;
@@ -25,6 +28,7 @@ const TextMetadataField = ({
     description: description,
     error: error,
     hideOptionalLabel: true,
+    disabled: isDisabled,
     label: displayName,
     name: dataKey,
     onChange: event => {
@@ -35,11 +39,10 @@ const TextMetadataField = ({
         onRemove(dataKey);
       }
     },
-    placeholder: intl.formatMessage(messages.metadataFieldSetValue),
+    placeholder: formatMessage(messages.metadataFieldSetValue),
     type: type,
     value: value
   });
 };
-export { TextMetadataField as TextMetadataFieldBase };
-export default injectIntl(TextMetadataField);
+export default TextMetadataField;
 //# sourceMappingURL=TextMetadataField.js.map

package/es/features/metadata-instance-fields/TextMetadataField.js.flow

@@ -1,6 +1,6 @@
 // @flow
 import * as React from 'react';
-import { injectIntl } from 'react-intl';
+import { useIntl } from 'react-intl';
 
 import TextInput from '../../components/text-input';
 
@@ -14,7 +14,7 @@ type Props = {
     description?: string,
     displayName: string,
     error?: React.Node,
-    intl: any,
+    isDisabled?: boolean,
     onChange: (key: string, value: MetadataFieldValue) => void,
     onRemove: (key: string) => void,
     type?: string,
@@ -26,11 +26,13 @@ const TextMetadataField = ({
     displayName,
     description,
     error,
-    intl,
+    isDisabled,
     onChange,
     onRemove,
     type = 'text',
 }: Props) => {
+    const { formatMessage } = useIntl();
+
     let value = '';
 
     if (typeof dataValue === 'number') {
@@ -45,6 +47,7 @@ const TextMetadataField = ({
             description={description}
             error={error}
             hideOptionalLabel
+            disabled={isDisabled}
             label={displayName}
             name={dataKey}
             onChange={(event: SyntheticKeyboardEvent<HTMLInputElement>) => {
@@ -55,12 +58,11 @@ const TextMetadataField = ({
                     onRemove(dataKey);
                 }
             }}
-            placeholder={intl.formatMessage(messages.metadataFieldSetValue)}
+            placeholder={formatMessage(messages.metadataFieldSetValue)}
             type={type}
             value={value}
         />
     );
 };
 
-export { TextMetadataField as TextMetadataFieldBase };
-export default injectIntl(TextMetadataField);
+export default TextMetadataField;

package/es/features/metadata-instance-fields/TextMetadataField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextMetadataField.js","names":["React","injectIntl","TextInput","messages","TextMetadataField","dataKey","dataValue","displayName","description","error","intl","onChange","onRemove","type","value","createElement","className","hideOptionalLabel","label","name","event","currentTarget","placeholder","formatMessage","metadataFieldSetValue","TextMetadataFieldBase"],"sources":["../../../src/features/metadata-instance-fields/TextMetadataField.js"],"sourcesContent":["// @flow\nimport * as React from 'react';\nimport { injectIntl } from 'react-intl';\n\nimport TextInput from '../../components/text-input';\n\nimport messages from './messages';\nimport type { MetadataFieldValue } from '../../common/types/metadata';\nimport './TextMetadataField.scss';\n\ntype Props = {\n    dataKey: string,\n    dataValue?: MetadataFieldValue,\n    description?: string,\n    displayName: string,\n    error?: React.Node,\n    intl: any,\n    onChange: (key: string, value: MetadataFieldValue) => void,\n    onRemove: (key: string) => void,\n    type?: string,\n};\n\nconst TextMetadataField = ({\n    dataKey,\n    dataValue,\n    displayName,\n    description,\n    error,\n    intl,\n    onChange,\n    onRemove,\n    type = 'text',\n}: Props) => {\n    let value = '';\n\n    if (typeof dataValue === 'number') {\n        value = dataValue;\n    } else if (dataValue) {\n        value = dataValue;\n    }\n\n    return (\n        <TextInput\n            className=\"bdl-TextMetadataField\"\n            description={description}\n            error={error}\n            hideOptionalLabel\n            label={displayName}\n            name={dataKey}\n            onChange={(event: SyntheticKeyboardEvent<HTMLInputElement>) => {\n                const currentTarget = (event.currentTarget: HTMLInputElement);\n                if (currentTarget.value) {\n                    onChange(dataKey, currentTarget.value);\n                } else {\n                    onRemove(dataKey);\n                }\n            }}\n            placeholder={intl.formatMessage(messages.metadataFieldSetValue)}\n            type={type}\n            value={value}\n        />\n    );\n};\n\nexport { TextMetadataField as TextMetadataFieldBase };\nexport default injectIntl(TextMetadataField);\n"],"mappings":"AACA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,YAAY;AAEvC,OAAOC,SAAS,MAAM,6BAA6B;AAEnD,OAAOC,QAAQ,MAAM,YAAY;AAEjC,OAAO,0BAA0B;AAcjC,MAAMC,iBAAiB,GAAGA,CAAC;EACvBC,OAAO;EACPC,SAAS;EACTC,WAAW;EACXC,WAAW;EACXC,KAAK;EACLC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,IAAI,GAAG;AACJ,CAAC,KAAK;EACT,IAAIC,KAAK,GAAG,EAAE;EAEd,IAAI,OAAOR,SAAS,KAAK,QAAQ,EAAE;IAC/BQ,KAAK,GAAGR,SAAS;EACrB,CAAC,MAAM,IAAIA,SAAS,EAAE;IAClBQ,KAAK,GAAGR,SAAS;EACrB;EAEA,oBACIN,KAAA,CAAAe,aAAA,CAACb,SAAS;IACNc,SAAS,EAAC,uBAAuB;IACjCR,WAAW,EAAEA,WAAY;IACzBC,KAAK,EAAEA,KAAM;IACbQ,iBAAiB;IACjBC,KAAK,EAAEX,WAAY;IACnBY,IAAI,EAAEd,OAAQ;IACdM,QAAQ,EAAGS,KAA+C,IAAK;MAC3D,MAAMC,aAAa,GAAID,KAAK,CAACC,aAAgC;MAC7D,IAAIA,aAAa,CAACP,KAAK,EAAE;QACrBH,QAAQ,CAACN,OAAO,EAAEgB,aAAa,CAACP,KAAK,CAAC;MAC1C,CAAC,MAAM;QACHF,QAAQ,CAACP,OAAO,CAAC;MACrB;IACJ,CAAE;IACFiB,WAAW,EAAEZ,IAAI,CAACa,aAAa,CAACpB,QAAQ,CAACqB,qBAAqB,CAAE;IAChEX,IAAI,EAAEA,IAAK;IACXC,KAAK,EAAEA;EAAM,CAChB,CAAC;AAEV,CAAC;AAED,SAASV,iBAAiB,IAAIqB,qBAAqB;AACnD,eAAexB,UAAU,CAACG,iBAAiB,CAAC","ignoreList":[]}
+{"version":3,"file":"TextMetadataField.js","names":["React","useIntl","TextInput","messages","TextMetadataField","dataKey","dataValue","displayName","description","error","isDisabled","onChange","onRemove","type","formatMessage","value","createElement","className","hideOptionalLabel","disabled","label","name","event","currentTarget","placeholder","metadataFieldSetValue"],"sources":["../../../src/features/metadata-instance-fields/TextMetadataField.js"],"sourcesContent":["// @flow\nimport * as React from 'react';\nimport { useIntl } from 'react-intl';\n\nimport TextInput from '../../components/text-input';\n\nimport messages from './messages';\nimport type { MetadataFieldValue } from '../../common/types/metadata';\nimport './TextMetadataField.scss';\n\ntype Props = {\n    dataKey: string,\n    dataValue?: MetadataFieldValue,\n    description?: string,\n    displayName: string,\n    error?: React.Node,\n    isDisabled?: boolean,\n    onChange: (key: string, value: MetadataFieldValue) => void,\n    onRemove: (key: string) => void,\n    type?: string,\n};\n\nconst TextMetadataField = ({\n    dataKey,\n    dataValue,\n    displayName,\n    description,\n    error,\n    isDisabled,\n    onChange,\n    onRemove,\n    type = 'text',\n}: Props) => {\n    const { formatMessage } = useIntl();\n\n    let value = '';\n\n    if (typeof dataValue === 'number') {\n        value = dataValue;\n    } else if (dataValue) {\n        value = dataValue;\n    }\n\n    return (\n        <TextInput\n            className=\"bdl-TextMetadataField\"\n            description={description}\n            error={error}\n            hideOptionalLabel\n            disabled={isDisabled}\n            label={displayName}\n            name={dataKey}\n            onChange={(event: SyntheticKeyboardEvent<HTMLInputElement>) => {\n                const currentTarget = (event.currentTarget: HTMLInputElement);\n                if (currentTarget.value) {\n                    onChange(dataKey, currentTarget.value);\n                } else {\n                    onRemove(dataKey);\n                }\n            }}\n            placeholder={formatMessage(messages.metadataFieldSetValue)}\n            type={type}\n            value={value}\n        />\n    );\n};\n\nexport default TextMetadataField;\n"],"mappings":"AACA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,OAAO,QAAQ,YAAY;AAEpC,OAAOC,SAAS,MAAM,6BAA6B;AAEnD,OAAOC,QAAQ,MAAM,YAAY;AAEjC,OAAO,0BAA0B;AAcjC,MAAMC,iBAAiB,GAAGA,CAAC;EACvBC,OAAO;EACPC,SAAS;EACTC,WAAW;EACXC,WAAW;EACXC,KAAK;EACLC,UAAU;EACVC,QAAQ;EACRC,QAAQ;EACRC,IAAI,GAAG;AACJ,CAAC,KAAK;EACT,MAAM;IAAEC;EAAc,CAAC,GAAGb,OAAO,CAAC,CAAC;EAEnC,IAAIc,KAAK,GAAG,EAAE;EAEd,IAAI,OAAOT,SAAS,KAAK,QAAQ,EAAE;IAC/BS,KAAK,GAAGT,SAAS;EACrB,CAAC,MAAM,IAAIA,SAAS,EAAE;IAClBS,KAAK,GAAGT,SAAS;EACrB;EAEA,oBACIN,KAAA,CAAAgB,aAAA,CAACd,SAAS;IACNe,SAAS,EAAC,uBAAuB;IACjCT,WAAW,EAAEA,WAAY;IACzBC,KAAK,EAAEA,KAAM;IACbS,iBAAiB;IACjBC,QAAQ,EAAET,UAAW;IACrBU,KAAK,EAAEb,WAAY;IACnBc,IAAI,EAAEhB,OAAQ;IACdM,QAAQ,EAAGW,KAA+C,IAAK;MAC3D,MAAMC,aAAa,GAAID,KAAK,CAACC,aAAgC;MAC7D,IAAIA,aAAa,CAACR,KAAK,EAAE;QACrBJ,QAAQ,CAACN,OAAO,EAAEkB,aAAa,CAACR,KAAK,CAAC;MAC1C,CAAC,MAAM;QACHH,QAAQ,CAACP,OAAO,CAAC;MACrB;IACJ,CAAE;IACFmB,WAAW,EAAEV,aAAa,CAACX,QAAQ,CAACsB,qBAAqB,CAAE;IAC3DZ,IAAI,EAAEA,IAAK;IACXE,KAAK,EAAEA;EAAM,CAChB,CAAC;AAEV,CAAC;AAED,eAAeX,iBAAiB","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "box-ui-elements",
-    "version": "23.3.1-beta.1",
+    "version": "23.4.0-beta.2",
     "description": "Box UI Elements",
     "author": "Box (https://www.box.com/)",
     "license": "SEE LICENSE IN LICENSE",

package/src/common/types/metadata.js

@@ -90,6 +90,7 @@ type MetadataType = {
 type MetadataCascadePolicy = {
     canEdit?: boolean,
     id?: string,
+    cascadePolicyType?: string,
 };
 
 type MetadataCascadingPolicyData = {

package/src/components/notification/Notification.js

@@ -3,9 +3,13 @@ import * as React from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
 import classNames from 'classnames';
 
+// $FlowFixMe
+import { Information, Check, AlertTriangle, AlertBadge, XMark } from '@box/blueprint-web-assets/icons/Medium';
+
 import InfoBadge16 from '../../icon/line/InfoBadge16';
 import CircleCheck16 from '../../icon/line/CircleCheck16';
 import TriangleAlert16 from '../../icon/line/TriangleAlert16';
+
 import XBadge16 from '../../icon/line/XBadge16';
 import X16 from '../../icon/fill/X16';
 
@@ -30,10 +34,10 @@ const DURATION_TIMES = {
 };
 
 const ICON_RENDERER: { [string]: Function } = {
-    [TYPE_DEFAULT]: () => <InfoBadge16 />,
-    [TYPE_ERROR]: () => <XBadge16 />,
-    [TYPE_INFO]: () => <CircleCheck16 />,
-    [TYPE_WARN]: () => <TriangleAlert16 />,
+    [TYPE_DEFAULT]: useV2Icons => (useV2Icons ? <Information /> : <InfoBadge16 />),
+    [TYPE_ERROR]: useV2Icons => (useV2Icons ? <AlertBadge /> : <XBadge16 />),
+    [TYPE_INFO]: useV2Icons => (useV2Icons ? <Check /> : <CircleCheck16 />),
+    [TYPE_WARN]: useV2Icons => (useV2Icons ? <AlertTriangle /> : <TriangleAlert16 />),
 };
 
 const messages = defineMessages({
@@ -69,6 +73,7 @@ type Props = {
      */
     type: NotificationType,
     overflow?: 'wrap' | 'ellipsis',
+    useV2Icons?: boolean,
 };
 
 class Notification extends React.Component<Props> {
@@ -101,14 +106,16 @@ class Notification extends React.Component<Props> {
 
     render() {
         const contents = this.getChildren();
-        const { intl, type, overflow, className } = this.props;
+        const { intl, type, overflow, className, useV2Icons } = this.props;
         const { formatMessage } = intl;
         const classes = classNames('notification', type, overflow, className);
+        const iconRenderer = ICON_RENDERER[type](useV2Icons);
+        const iconColor = useV2Icons ? '#222' : '#fff';
 
         return (
             <div className={classes}>
-                {React.cloneElement(ICON_RENDERER[type](), {
-                    color: '#fff',
+                {React.cloneElement(iconRenderer, {
+                    color: iconColor,
                     height: 20,
                     width: 20,
                 })}
@@ -119,7 +126,7 @@ class Notification extends React.Component<Props> {
                     onClick={this.onClose}
                     type="button"
                 >
-                    <X16 />
+                    {useV2Icons ? <XMark height={32} width={32} /> : <X16 />}
                 </button>
             </div>
         );

package/src/components/notification/__tests__/Notification.test.js

@@ -46,7 +46,7 @@ describe('components/notification/Notification', () => {
             expect(component.find('div.notification').hasClass(type)).toBe(true);
         });
 
-        test('should render a correct icon when initialized', () => {
+        test('should render local icons per notification type', () => {
             const component = mount(<Notification type={type}>test</Notification>);
             const infoBadge16Count = type === TYPE_DEFAULT ? 1 : 0;
             const CircleCheck16Count = type === TYPE_INFO ? 1 : 0;
@@ -57,6 +57,26 @@ describe('components/notification/Notification', () => {
             expect(component.find('XBadge16').length).toBe(XBadge16Count);
             expect(component.find('CircleCheck16').length).toBe(CircleCheck16Count);
             expect(component.find('TriangleAlert16').length).toBe(TriangleAlert16Count);
+
+            // Does not render v2 icons
+            expect(component.find(`svg[role="img"]`).length).toBe(0);
+        });
+
+        test('should render v2 icons when useV2Icons is true', () => {
+            const component = mount(
+                <Notification type={type} useV2Icons={true}>
+                    test
+                </Notification>,
+            );
+
+            // Type icon and Close button
+            expect(component.find(`svg[role="img"]`).length).toBe(2);
+
+            // Does not render local icons
+            expect(component.find('InfoBadge16').length).toBe(0);
+            expect(component.find('XBadge16').length).toBe(0);
+            expect(component.find('CircleCheck16').length).toBe(0);
+            expect(component.find('TriangleAlert16').length).toBe(0);
         });
     });
 

package/src/features/metadata-instance-editor/CascadePolicy.js

@@ -34,10 +34,12 @@ const agents = [
 type Props = {
     canEdit: boolean,
     canUseAIFolderExtraction: boolean,
+    canUseAIFolderExtractionAgentSelector: boolean,
     isAIFolderExtractionEnabled: boolean,
     isCascadingEnabled: boolean,
     isCascadingOverwritten: boolean,
     isCustomMetadata: boolean,
+    isExistingAIExtractionCascadePolicy: boolean,
     onAIFolderExtractionToggle: (value: boolean) => void,
     onCascadeModeChange: (value: boolean) => void,
     onCascadeToggle: (value: boolean) => void,
@@ -47,10 +49,12 @@ type Props = {
 const CascadePolicy = ({
     canEdit,
     canUseAIFolderExtraction,
+    canUseAIFolderExtractionAgentSelector,
     isCascadingEnabled,
     isCascadingOverwritten,
     isCustomMetadata,
     isAIFolderExtractionEnabled,
+    isExistingAIExtractionCascadePolicy,
     onAIFolderExtractionToggle,
     onCascadeToggle,
     onCascadeModeChange,
@@ -65,7 +69,7 @@ const CascadePolicy = ({
     return canEdit ? (
         <>
             <div className="metadata-cascade-editor">
-                <div className="metadata-cascade-enable">
+                <div className="metadata-cascade-enable" data-testid="metadata-cascade-enable">
                     <div>
                         <FormattedMessage tagName="strong" {...messages.enableCascadePolicy} />
                         {!isCustomMetadata && (
@@ -131,6 +135,7 @@ const CascadePolicy = ({
                             <Toggle
                                 className="metadata-cascade-toggle"
                                 isOn={isAIFolderExtractionEnabled}
+                                isDisabled={isExistingAIExtractionCascadePolicy}
                                 label=""
                                 onChange={e => onAIFolderExtractionToggle(e.target.checked)}
                             />
@@ -142,17 +147,19 @@ const CascadePolicy = ({
                                 <FormattedMessage {...messages.aiAutofillLearnMore} />
                             </Link>
                         </div>
-                        <div className="metadata-cascade-ai-agent-selector">
-                            <TooltipProvider>
-                                <BoxAiAgentSelector
-                                    agents={agents}
-                                    onErrorAction={() => {}}
-                                    requestState="success"
-                                    selectedAgent={agents[0]}
-                                    variant="sidebar"
-                                />
-                            </TooltipProvider>
-                        </div>
+                        {canUseAIFolderExtractionAgentSelector && (
+                            <div className="metadata-cascade-ai-agent-selector">
+                                <TooltipProvider>
+                                    <BoxAiAgentSelector
+                                        agents={agents}
+                                        onErrorAction={() => {}}
+                                        requestState="success"
+                                        selectedAgent={agents[0]}
+                                        variant="sidebar"
+                                    />
+                                </TooltipProvider>
+                            </div>
+                        )}
                         <InlineNotice className="metadata-cascade-ai-notice" variant="info">
                             <FormattedMessage
                                 {...messages.aiAutofillNotice}

package/src/features/metadata-instance-editor/Instance.js

@@ -24,7 +24,7 @@ import MetadataInstanceConfirmDialog from './MetadataInstanceConfirmDialog';
 import Footer from './Footer';
 import messages from './messages';
 import { FIELD_TYPE_FLOAT, FIELD_TYPE_INTEGER } from '../metadata-instance-fields/constants';
-import TEMPLATE_CUSTOM_PROPERTIES from './constants';
+import { CASCADE_POLICY_TYPE_AI_EXTRACT, TEMPLATE_CUSTOM_PROPERTIES } from './constants';
 import {
     JSON_PATCH_OP_REMOVE,
     JSON_PATCH_OP_ADD,
@@ -48,6 +48,7 @@ import './Instance.scss';
 type Props = {
     canEdit: boolean,
     canUseAIFolderExtraction?: boolean,
+    canUseAIFolderExtractionAgentSelector?: boolean,
     cascadePolicy?: MetadataCascadePolicy, // eslint-disable-line
     data: MetadataFields,
     hasError: boolean,
@@ -210,7 +211,13 @@ class Instance extends React.PureComponent<Props, State> {
             isCascadingPolicyApplicable,
             onSave,
         }: Props = this.props;
-        const { data: currentData, errors, isCascadingEnabled, isCascadingOverwritten }: State = this.state;
+        const {
+            data: currentData,
+            errors,
+            isAIFolderExtractionEnabled,
+            isCascadingEnabled,
+            isCascadingOverwritten,
+        }: State = this.state;
 
         if (!this.isEditing() || !isDirty || !onSave || Object.keys(errors).length) {
             return;
@@ -219,7 +226,8 @@ class Instance extends React.PureComponent<Props, State> {
         this.setState({
             isBusy: true,
             isEditing: false,
-            shouldShowCascadeOptions: false,
+            // reset state if cascading policy is removed
+            isAIFolderExtractionEnabled: isCascadingEnabled ? isAIFolderExtractionEnabled : false,
         });
         onSave(
             id,
@@ -230,6 +238,7 @@ class Instance extends React.PureComponent<Props, State> {
                       id: cascadePolicy ? cascadePolicy.id : undefined,
                       isEnabled: isCascadingEnabled,
                       overwrite: isCascadingOverwritten,
+                      isAIFolderExtractionEnabled,
                   }
                 : undefined,
             cloneDeep(currentData),
@@ -339,12 +348,12 @@ class Instance extends React.PureComponent<Props, State> {
      * @return {Object} - react state
      */
     getState(props: Props): State {
-        const isCascadingEnabled = this.isCascadingEnabled(props);
+        const isCascadingEnabled = this.isCascadingEnabledThroughProps(props);
 
         return {
             data: cloneDeep(props.data),
             errors: {},
-            isAIFolderExtractionEnabled: false,
+            isAIFolderExtractionEnabled: this.isAIFolderExtractionEnabledThroughProps(props),
             isBusy: false,
             isCascadingEnabled,
             isCascadingOverwritten: false,
@@ -420,13 +429,16 @@ class Instance extends React.PureComponent<Props, State> {
      */
     setDirty = (type?: string): void => {
         const { id, isCascadingPolicyApplicable, onModification }: Props = this.props;
-        const { data, isCascadingEnabled, isCascadingOverwritten } = this.state;
+        const { data, isCascadingEnabled, isCascadingOverwritten, isAIFolderExtractionEnabled } = this.state;
         const hasDataChanged = !isEqual(data, this.props.data);
         let hasCascadingChanged = false;
 
         if (isCascadingPolicyApplicable) {
             // isCascadingOverwritten always starts out as false, so true signifies a change
-            hasCascadingChanged = isCascadingOverwritten || isCascadingEnabled !== this.isCascadingEnabled(this.props);
+            hasCascadingChanged =
+                isCascadingOverwritten ||
+                isCascadingEnabled !== this.isCascadingEnabledThroughProps(this.props) ||
+                isAIFolderExtractionEnabled !== this.isAIFolderExtractionEnabledThroughProps(this.props);
         }
 
         // Callback to parent to tell that something is dirty
@@ -442,19 +454,30 @@ class Instance extends React.PureComponent<Props, State> {
     fieldKeyToTypeMap: Object;
 
     /**
-     * Determines if cascading policy is enabled based on
+     * Determines if cascading policy is enabled through props based on
      * whether it has an id or not.
      *
      * @param {Object} props - component props
      * @return {boolean} true if cascading policy is enabled
      */
-    isCascadingEnabled(props: Props) {
+    isCascadingEnabledThroughProps(props: Props) {
         if (props.cascadePolicy) {
             return !!props.cascadePolicy.id;
         }
         return false;
     }
 
+    /**
+     * Determines if ai extraction is enabled based on
+     * if cascade policy type is ai_extract
+     *
+     * @param {Object} props - component props
+     * @return {boolean} true if ai extraction is enabled
+     */
+    isAIFolderExtractionEnabledThroughProps({ cascadePolicy }: Props) {
+        return cascadePolicy?.cascadePolicyType === CASCADE_POLICY_TYPE_AI_EXTRACT;
+    }
+
     /**
      * Toggles the edit mode
      *
@@ -590,6 +613,7 @@ class Instance extends React.PureComponent<Props, State> {
     render() {
         const {
             canUseAIFolderExtraction = false,
+            canUseAIFolderExtractionAgentSelector = false,
             cascadePolicy = {},
             isDirty,
             isCascadingPolicyApplicable,
@@ -617,6 +641,9 @@ class Instance extends React.PureComponent<Props, State> {
         // Animate short and tall cards at consistent speeds.
         const animationDuration = (fields.length + 1) * 50;
 
+        const isExistingAIExtractionCascadePolicy =
+            this.isCascadingEnabledThroughProps(this.props) && this.isAIFolderExtractionEnabledThroughProps(this.props);
+
         return (
             <div ref={this.collapsibleRef}>
                 <Collapsible
@@ -647,10 +674,14 @@ class Instance extends React.PureComponent<Props, State> {
                                         <CascadePolicy
                                             canEdit={isEditing && !!cascadePolicy.canEdit}
                                             canUseAIFolderExtraction={canUseAIFolderExtraction}
+                                            canUseAIFolderExtractionAgentSelector={
+                                                canUseAIFolderExtractionAgentSelector
+                                            }
                                             isAIFolderExtractionEnabled={isAIFolderExtractionEnabled}
                                             isCascadingEnabled={isCascadingEnabled}
                                             isCascadingOverwritten={isCascadingOverwritten}
                                             isCustomMetadata={isProperties}
+                                            isExistingAIExtractionCascadePolicy={isExistingAIExtractionCascadePolicy}
                                             onAIFolderExtractionToggle={this.onAIFolderExtractionToggle}
                                             onCascadeModeChange={this.onCascadeModeChange}
                                             onCascadeToggle={this.onCascadeToggle}
@@ -669,6 +700,7 @@ class Instance extends React.PureComponent<Props, State> {
                                             canEdit={isEditing}
                                             data={data}
                                             errors={errors}
+                                            isDisabled={isAIFolderExtractionEnabled}
                                             onFieldChange={this.onFieldChange}
                                             onFieldRemove={this.onFieldRemove}
                                             template={template}

package/src/features/metadata-instance-editor/Instances.js

@@ -7,6 +7,7 @@ import type { JSONPatchOperations } from '../../common/types/api';
 
 type Props = {
     canUseAIFolderExtraction?: boolean,
+    canUseAIFolderExtractionAgentSelector?: boolean,
     editors?: Array<MetadataEditor>,
     isCascadingPolicyApplicable?: boolean,
     onModification?: (id: string, isDirty: boolean) => void,
@@ -22,6 +23,7 @@ type Props = {
 
 const Instances = ({
     canUseAIFolderExtraction = false,
+    canUseAIFolderExtractionAgentSelector = false,
     isCascadingPolicyApplicable = false,
     editors = [],
     onModification,
@@ -37,6 +39,7 @@ const Instances = ({
                 <Instance
                     canEdit={instance.canEdit}
                     canUseAIFolderExtraction={canUseAIFolderExtraction}
+                    canUseAIFolderExtractionAgentSelector={canUseAIFolderExtractionAgentSelector}
                     cascadePolicy={instance.cascadePolicy}
                     data={instance.data}
                     hasError={hasError}

package/src/features/metadata-instance-editor/MetadataInstanceEditor.js

@@ -15,6 +15,7 @@ type Props = {
     blurExceptionClassNames?: Array<string>,
     canAdd: boolean,
     canUseAIFolderExtraction?: boolean,
+    canUseAIFolderExtractionAgentSelector?: boolean,
     editors?: Array<MetadataEditor>,
     isCascadingPolicyApplicable?: boolean,
     isDropdownBusy?: boolean,
@@ -37,6 +38,7 @@ const MetadataInstanceEditor = ({
     blurExceptionClassNames,
     canAdd,
     canUseAIFolderExtraction = false,
+    canUseAIFolderExtractionAgentSelector = false,
     isCascadingPolicyApplicable = false,
     isDropdownBusy,
     editors = [],
@@ -64,6 +66,7 @@ const MetadataInstanceEditor = ({
                 <ScrollWrapper>
                     <Instances
                         canUseAIFolderExtraction={canUseAIFolderExtraction}
+                        canUseAIFolderExtractionAgentSelector={canUseAIFolderExtractionAgentSelector}
                         editors={editors}
                         isCascadingPolicyApplicable={isCascadingPolicyApplicable}
                         onModification={onModification}

package/src/features/metadata-instance-editor/TemplateDropdown.js

@@ -13,7 +13,7 @@ import { Flyout, Overlay } from '../../components/flyout';
 
 import MenuToggle from '../../components/dropdown-menu/MenuToggle';
 import messages from './messages';
-import TEMPLATE_CUSTOM_PROPERTIES from './constants';
+import { TEMPLATE_CUSTOM_PROPERTIES } from './constants';
 import type { MetadataTemplate } from '../../common/types/metadata';
 import './TemplateDropdown.scss';