@backstage/plugin-scaffolder 1.36.3-next.1 → 1.37.0

package/dist/components/fields/EntityNamePicker/EntityNamePicker.esm.js

@@ -1,10 +1,13 @@
 import { jsx } from 'react/jsx-runtime';
-import TextField from '@material-ui/core/TextField';
+import MuiTextField from '@material-ui/core/TextField';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { scaffolderTranslationRef } from '../../../translation.esm.js';
+import { useScaffolderTheme } from '@backstage/plugin-scaffolder-react/alpha';
+import { TextField } from '@backstage/ui';
 export { EntityNamePickerSchema } from './schema.esm.js';
 
 const EntityNamePicker = (props) => {
+  const theme = useScaffolderTheme();
   const { t } = useTranslationRef(scaffolderTranslationRef);
   const {
     onChange,
@@ -15,12 +18,30 @@ const EntityNamePicker = (props) => {
     },
     rawErrors,
     formData,
+    uiSchema,
     uiSchema: { "ui:autofocus": autoFocus },
     idSchema,
     placeholder
   } = props;
+  if (theme === "bui") {
+    return /* @__PURE__ */ jsx(
+      TextField,
+      {
+        id: idSchema?.$id,
+        label: title,
+        description: uiSchema["ui:description"] ?? description,
+        secondaryLabel: required ? "Required" : void 0,
+        placeholder,
+        isRequired: required,
+        value: formData ?? "",
+        onChange,
+        isInvalid: rawErrors?.length > 0 && !formData,
+        autoFocus
+      }
+    );
+  }
   return /* @__PURE__ */ jsx(
-    TextField,
+    MuiTextField,
     {
       id: idSchema?.$id,
       label: title,

package/dist/components/fields/EntityNamePicker/EntityNamePicker.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityNamePicker.esm.js","sources":["../../../../src/components/fields/EntityNamePicker/EntityNamePicker.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { EntityNamePickerProps } from './schema';\nimport TextField from '@material-ui/core/TextField';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { scaffolderTranslationRef } from '../../../translation';\n\nexport { EntityNamePickerSchema } from './schema';\n\n/**\n * EntityName Picker\n */\nexport const EntityNamePicker = (props: EntityNamePickerProps) => {\n  const { t } = useTranslationRef(scaffolderTranslationRef);\n  const {\n    onChange,\n    required,\n    schema: {\n      title = t('fields.entityNamePicker.title'),\n      description = t('fields.entityNamePicker.description'),\n    },\n    rawErrors,\n    formData,\n    uiSchema: { 'ui:autofocus': autoFocus },\n    idSchema,\n    placeholder,\n  } = props;\n\n  return (\n    <TextField\n      id={idSchema?.$id}\n      label={title}\n      placeholder={placeholder}\n      helperText={description}\n      required={required}\n      value={formData ?? ''}\n      onChange={({ target: { value } }) => onChange(value)}\n      margin=\"normal\"\n      error={rawErrors?.length > 0 && !formData}\n      inputProps={{ autoFocus }}\n      FormHelperTextProps={{ margin: 'dense', style: { marginLeft: 0 } }}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;AAyBO,MAAM,gBAAA,GAAmB,CAAC,KAAA,KAAiC;AAChE,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,KAAA,GAAQ,EAAE,+BAA+B,CAAA;AAAA,MACzC,WAAA,GAAc,EAAE,qCAAqC;AAAA,KACvD;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA,EAAU,EAAE,cAAA,EAAgB,SAAA,EAAU;AAAA,IACtC,QAAA;AAAA,IACA;AAAA,GACF,GAAI,KAAA;AAEJ,EAAA,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,IAAI,QAAA,EAAU,GAAA;AAAA,MACd,KAAA,EAAO,KAAA;AAAA,MACP,WAAA;AAAA,MACA,UAAA,EAAY,WAAA;AAAA,MACZ,QAAA;AAAA,MACA,OAAO,QAAA,IAAY,EAAA;AAAA,MACnB,QAAA,EAAU,CAAC,EAAE,MAAA,EAAQ,EAAE,KAAA,EAAM,EAAE,KAAM,QAAA,CAAS,KAAK,CAAA;AAAA,MACnD,MAAA,EAAO,QAAA;AAAA,MACP,KAAA,EAAO,SAAA,EAAW,MAAA,GAAS,CAAA,IAAK,CAAC,QAAA;AAAA,MACjC,UAAA,EAAY,EAAE,SAAA,EAAU;AAAA,MACxB,mBAAA,EAAqB,EAAE,MAAA,EAAQ,OAAA,EAAS,OAAO,EAAE,UAAA,EAAY,GAAE;AAAE;AAAA,GACnE;AAEJ;;;;"}
+{"version":3,"file":"EntityNamePicker.esm.js","sources":["../../../../src/components/fields/EntityNamePicker/EntityNamePicker.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { EntityNamePickerProps } from './schema';\nimport MuiTextField from '@material-ui/core/TextField';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { scaffolderTranslationRef } from '../../../translation';\nimport { useScaffolderTheme } from '@backstage/plugin-scaffolder-react/alpha';\nimport { TextField as BuiTextField } from '@backstage/ui';\n\nexport { EntityNamePickerSchema } from './schema';\n\n/**\n * EntityName Picker\n */\nexport const EntityNamePicker = (props: EntityNamePickerProps) => {\n  const theme = useScaffolderTheme();\n  const { t } = useTranslationRef(scaffolderTranslationRef);\n  const {\n    onChange,\n    required,\n    schema: {\n      title = t('fields.entityNamePicker.title'),\n      description = t('fields.entityNamePicker.description'),\n    },\n    rawErrors,\n    formData,\n    uiSchema,\n    uiSchema: { 'ui:autofocus': autoFocus },\n    idSchema,\n    placeholder,\n  } = props;\n\n  if (theme === 'bui') {\n    return (\n      <BuiTextField\n        id={idSchema?.$id}\n        label={title}\n        description={uiSchema['ui:description'] ?? description}\n        secondaryLabel={required ? 'Required' : undefined}\n        placeholder={placeholder}\n        isRequired={required}\n        value={formData ?? ''}\n        onChange={onChange}\n        isInvalid={rawErrors?.length > 0 && !formData}\n        // eslint-disable-next-line jsx-a11y/no-autofocus\n        autoFocus={autoFocus}\n      />\n    );\n  }\n\n  return (\n    <MuiTextField\n      id={idSchema?.$id}\n      label={title}\n      placeholder={placeholder}\n      helperText={description}\n      required={required}\n      value={formData ?? ''}\n      onChange={({ target: { value } }) => onChange(value)}\n      margin=\"normal\"\n      error={rawErrors?.length > 0 && !formData}\n      inputProps={{ autoFocus }}\n      FormHelperTextProps={{ margin: 'dense', style: { marginLeft: 0 } }}\n    />\n  );\n};\n"],"names":["BuiTextField"],"mappings":";;;;;;;;AA2BO,MAAM,gBAAA,GAAmB,CAAC,KAAA,KAAiC;AAChE,EAAA,MAAM,QAAQ,kBAAA,EAAmB;AACjC,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,KAAA,GAAQ,EAAE,+BAA+B,CAAA;AAAA,MACzC,WAAA,GAAc,EAAE,qCAAqC;AAAA,KACvD;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA,EAAU,EAAE,cAAA,EAAgB,SAAA,EAAU;AAAA,IACtC,QAAA;AAAA,IACA;AAAA,GACF,GAAI,KAAA;AAEJ,EAAA,IAAI,UAAU,KAAA,EAAO;AACnB,IAAA,uBACE,GAAA;AAAA,MAACA,SAAA;AAAA,MAAA;AAAA,QACC,IAAI,QAAA,EAAU,GAAA;AAAA,QACd,KAAA,EAAO,KAAA;AAAA,QACP,WAAA,EAAa,QAAA,CAAS,gBAAgB,CAAA,IAAK,WAAA;AAAA,QAC3C,cAAA,EAAgB,WAAW,UAAA,GAAa,MAAA;AAAA,QACxC,WAAA;AAAA,QACA,UAAA,EAAY,QAAA;AAAA,QACZ,OAAO,QAAA,IAAY,EAAA;AAAA,QACnB,QAAA;AAAA,QACA,SAAA,EAAW,SAAA,EAAW,MAAA,GAAS,CAAA,IAAK,CAAC,QAAA;AAAA,QAErC;AAAA;AAAA,KACF;AAAA,EAEJ;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,IAAI,QAAA,EAAU,GAAA;AAAA,MACd,KAAA,EAAO,KAAA;AAAA,MACP,WAAA;AAAA,MACA,UAAA,EAAY,WAAA;AAAA,MACZ,QAAA;AAAA,MACA,OAAO,QAAA,IAAY,EAAA;AAAA,MACnB,QAAA,EAAU,CAAC,EAAE,MAAA,EAAQ,EAAE,KAAA,EAAM,EAAE,KAAM,QAAA,CAAS,KAAK,CAAA;AAAA,MACnD,MAAA,EAAO,QAAA;AAAA,MACP,KAAA,EAAO,SAAA,EAAW,MAAA,GAAS,CAAA,IAAK,CAAC,QAAA;AAAA,MACjC,UAAA,EAAY,EAAE,SAAA,EAAU;AAAA,MACxB,mBAAA,EAAqB,EAAE,MAAA,EAAQ,OAAA,EAAS,OAAO,EAAE,UAAA,EAAY,GAAE;AAAE;AAAA,GACnE;AAEJ;;;;"}

package/dist/components/fields/EntityPicker/EntityPicker.esm.js

@@ -3,17 +3,19 @@ import { CATALOG_FILTER_EXISTS } from '@backstage/catalog-client';
 import { stringifyEntityRef, parseEntityRef } from '@backstage/catalog-model';
 import { useApi } from '@backstage/core-plugin-api';
 import { catalogApiRef, entityPresentationApiRef, EntityDisplayName } from '@backstage/plugin-catalog-react';
-import TextField from '@material-ui/core/TextField';
-import Autocomplete, { createFilterOptions } from '@material-ui/lab/Autocomplete';
-import { useCallback, useEffect } from 'react';
+import MuiTextField from '@material-ui/core/TextField';
+import MuiAutocomplete, { createFilterOptions } from '@material-ui/lab/Autocomplete';
+import { useCallback, useMemo, useState, useEffect, useRef } from 'react';
 import useAsync from 'react-use/esm/useAsync';
 import { VirtualizedListbox } from '../VirtualizedListbox.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { scaffolderTranslationRef } from '../../../translation.esm.js';
-import { ScaffolderField } from '@backstage/plugin-scaffolder-react/alpha';
+import { useScaffolderTheme, ScaffolderField } from '@backstage/plugin-scaffolder-react/alpha';
+import { Autocomplete } from '../Autocomplete/Autocomplete.esm.js';
 export { EntityPickerSchema } from './schema.esm.js';
 
 const EntityPicker = (props) => {
+  const theme = useScaffolderTheme();
   const { t } = useTranslationRef(scaffolderTranslationRef);
   const {
     onChange,
@@ -98,11 +100,125 @@ const EntityPicker = (props) => {
     [onChange, formData, defaultKind, defaultNamespace, allowArbitraryValues]
   );
   const selectedEntity = entities?.catalogEntities.find((e) => stringifyEntityRef(e) === formData) ?? (allowArbitraryValues && formData ? getLabel(formData) : "");
+  const buiOptions = useMemo(
+    () => (entities?.catalogEntities || []).map((entity) => {
+      const entityRef = stringifyEntityRef(entity);
+      const presentation = entities?.entityRefToPresentation.get(entityRef);
+      return {
+        value: entityRef,
+        label: presentation?.primaryTitle || entityRef
+      };
+    }),
+    [entities]
+  );
+  const [inputValue, setInputValue] = useState(formData || "");
+  useEffect(() => {
+    if (formData) {
+      const opt = buiOptions.find((o) => o.value === formData);
+      setInputValue(opt?.label || formData);
+    } else {
+      setInputValue("");
+    }
+  }, [formData, buiOptions]);
+  const selectedKey = formData && buiOptions.some((o) => o.value === formData) ? formData : null;
+  const lastCommittedRef = useRef(formData);
+  useEffect(() => {
+    lastCommittedRef.current = formData;
+  }, [formData]);
+  const handleSelectionChange = useCallback(
+    (key) => {
+      if (key !== null) {
+        const value = String(key);
+        lastCommittedRef.current = value;
+        onChange(value);
+      } else if (allowArbitraryValues && inputValue) {
+        let entityRef = inputValue;
+        try {
+          entityRef = stringifyEntityRef(
+            parseEntityRef(inputValue, { defaultKind, defaultNamespace })
+          );
+        } catch {
+        }
+        lastCommittedRef.current = entityRef;
+        onChange(entityRef);
+      } else {
+        lastCommittedRef.current = void 0;
+        onChange(void 0);
+      }
+    },
+    [onChange, allowArbitraryValues, inputValue, defaultKind, defaultNamespace]
+  );
+  const handleBlur = useCallback(() => {
+    if (allowArbitraryValues && inputValue) {
+      let entityRef = inputValue;
+      try {
+        entityRef = stringifyEntityRef(
+          parseEntityRef(inputValue, { defaultKind, defaultNamespace })
+        );
+      } catch {
+      }
+      if (lastCommittedRef.current !== entityRef) {
+        lastCommittedRef.current = entityRef;
+        onChange(entityRef);
+      }
+    }
+  }, [
+    allowArbitraryValues,
+    inputValue,
+    defaultKind,
+    defaultNamespace,
+    onChange
+  ]);
   useEffect(() => {
-    if (required && !allowArbitraryValues && entities?.catalogEntities.length === 1 && selectedEntity === "") {
-      onChange(stringifyEntityRef(entities.catalogEntities[0]));
+    if (theme === "bui") {
+      if (required && !allowArbitraryValues && entities?.catalogEntities.length === 1 && !formData) {
+        onChange(stringifyEntityRef(entities.catalogEntities[0]));
+      }
+    } else {
+      if (required && !allowArbitraryValues && entities?.catalogEntities.length === 1 && selectedEntity === "") {
+        onChange(stringifyEntityRef(entities.catalogEntities[0]));
+      }
     }
-  }, [entities, onChange, selectedEntity, required, allowArbitraryValues]);
+  }, [
+    entities,
+    onChange,
+    selectedEntity,
+    formData,
+    required,
+    allowArbitraryValues,
+    theme
+  ]);
+  if (theme === "bui") {
+    const isAutoSelected = required && !allowArbitraryValues && entities?.catalogEntities.length === 1;
+    return /* @__PURE__ */ jsx(
+      ScaffolderField,
+      {
+        rawErrors,
+        rawDescription: uiSchema["ui:description"] ?? description,
+        required,
+        disabled: isDisabled,
+        errors,
+        children: /* @__PURE__ */ jsx(
+          Autocomplete,
+          {
+            id: idSchema?.$id,
+            label: title,
+            isRequired: required,
+            isDisabled: isDisabled || isAutoSelected,
+            selectedKey,
+            inputValue,
+            onInputChange: setInputValue,
+            onSelectionChange: handleSelectionChange,
+            onBlur: handleBlur,
+            isLoading: loading,
+            options: buiOptions,
+            allowsCustomValue: allowArbitraryValues,
+            isInvalid: rawErrors && rawErrors.length > 0
+          }
+        )
+      }
+    );
+  }
   return /* @__PURE__ */ jsx(
     ScaffolderField,
     {
@@ -112,7 +228,7 @@ const EntityPicker = (props) => {
       disabled: isDisabled,
       errors,
       children: /* @__PURE__ */ jsx(
-        Autocomplete,
+        MuiAutocomplete,
         {
           disabled: isDisabled || required && !allowArbitraryValues && entities?.catalogEntities.length === 1,
           id: idSchema?.$id,
@@ -127,7 +243,7 @@ const EntityPicker = (props) => {
           autoSelect,
           freeSolo: allowArbitraryValues,
           renderInput: (params) => /* @__PURE__ */ jsx(
-            TextField,
+            MuiTextField,
             {
               ...params,
               label: title,

package/dist/components/fields/EntityPicker/EntityPicker.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityPicker.esm.js","sources":["../../../../src/components/fields/EntityPicker/EntityPicker.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport {\n  type EntityFilterQuery,\n  CATALOG_FILTER_EXISTS,\n} from '@backstage/catalog-client';\nimport {\n  Entity,\n  parseEntityRef,\n  stringifyEntityRef,\n} from '@backstage/catalog-model';\nimport { useApi } from '@backstage/core-plugin-api';\nimport {\n  EntityDisplayName,\n  EntityRefPresentationSnapshot,\n  catalogApiRef,\n  entityPresentationApiRef,\n} from '@backstage/plugin-catalog-react';\nimport TextField from '@material-ui/core/TextField';\nimport Autocomplete, {\n  AutocompleteChangeReason,\n  createFilterOptions,\n} from '@material-ui/lab/Autocomplete';\nimport { useCallback, useEffect } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport {\n  EntityPickerFilterQueryValue,\n  EntityPickerProps,\n  EntityPickerUiOptions,\n  EntityPickerFilterQuery,\n} from './schema';\nimport { VirtualizedListbox } from '../VirtualizedListbox';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { scaffolderTranslationRef } from '../../../translation';\nimport { ScaffolderField } from '@backstage/plugin-scaffolder-react/alpha';\n\nexport { EntityPickerSchema } from './schema';\n\n/**\n * The underlying component that is rendered in the form for the `EntityPicker`\n * field extension.\n *\n * @public\n */\nexport const EntityPicker = (props: EntityPickerProps) => {\n  const { t } = useTranslationRef(scaffolderTranslationRef);\n  const {\n    onChange,\n    schema: {\n      title = t('fields.entityPicker.title'),\n      description = t('fields.entityPicker.description'),\n    },\n    required,\n    uiSchema,\n    rawErrors,\n    formData,\n    idSchema,\n    errors,\n  } = props;\n  const catalogFilter = buildCatalogFilter(uiSchema);\n  const defaultKind = uiSchema['ui:options']?.defaultKind;\n  const defaultNamespace =\n    uiSchema['ui:options']?.defaultNamespace || undefined;\n  const autoSelect = uiSchema?.['ui:options']?.autoSelect ?? true;\n  const isDisabled = uiSchema?.['ui:disabled'] ?? false;\n\n  const catalogApi = useApi(catalogApiRef);\n  const entityPresentationApi = useApi(entityPresentationApiRef);\n\n  const { value: entities, loading } = useAsync(async () => {\n    const fields = [\n      'kind',\n      'metadata.name',\n      'metadata.namespace',\n      'metadata.title',\n      'metadata.description',\n      'spec.profile.displayName',\n      'spec.type',\n    ];\n    const { items } = await catalogApi.getEntities(\n      catalogFilter\n        ? { filter: catalogFilter, fields }\n        : { filter: undefined, fields },\n    );\n\n    const entityRefToPresentation = new Map<\n      string,\n      EntityRefPresentationSnapshot\n    >(\n      await Promise.all(\n        items.map(async item => {\n          const presentation = await entityPresentationApi.forEntity(item)\n            .promise;\n          return [stringifyEntityRef(item), presentation] as [\n            string,\n            EntityRefPresentationSnapshot,\n          ];\n        }),\n      ),\n    );\n\n    return { catalogEntities: items, entityRefToPresentation };\n  });\n\n  const allowArbitraryValues =\n    uiSchema['ui:options']?.allowArbitraryValues ?? true;\n\n  const getLabel = useCallback(\n    (freeSoloValue: string) => {\n      try {\n        // Will throw if defaultKind or defaultNamespace are not set\n        const parsedRef = parseEntityRef(freeSoloValue, {\n          defaultKind,\n          defaultNamespace,\n        });\n\n        return stringifyEntityRef(parsedRef);\n      } catch (err) {\n        return freeSoloValue;\n      }\n    },\n    [defaultKind, defaultNamespace],\n  );\n\n  const onSelect = useCallback(\n    (_: any, ref: string | Entity | null, reason: AutocompleteChangeReason) => {\n      // ref can either be a string from free solo entry or\n      if (typeof ref !== 'string') {\n        // if ref does not exist: pass 'undefined' to trigger validation for required value\n        onChange(ref ? stringifyEntityRef(ref as Entity) : undefined);\n      } else {\n        if (reason === 'blur' || reason === 'create-option') {\n          // Add in default namespace, etc.\n          let entityRef = ref;\n          try {\n            // Attempt to parse the entity ref into it's full form.\n            entityRef = stringifyEntityRef(\n              parseEntityRef(ref as string, {\n                defaultKind,\n                defaultNamespace,\n              }),\n            );\n          } catch (err) {\n            // If the passed in value isn't an entity ref, do nothing.\n          }\n          // We need to check against formData here as that's the previous value for this field.\n          if (formData !== ref || allowArbitraryValues) {\n            onChange(entityRef);\n          }\n        }\n      }\n    },\n    [onChange, formData, defaultKind, defaultNamespace, allowArbitraryValues],\n  );\n\n  // Since free solo can be enabled, attempt to parse as a full entity ref first, then fall\n  // back to the given value.\n  const selectedEntity =\n    entities?.catalogEntities.find(e => stringifyEntityRef(e) === formData) ??\n    (allowArbitraryValues && formData ? getLabel(formData) : '');\n\n  useEffect(() => {\n    if (\n      required &&\n      !allowArbitraryValues &&\n      entities?.catalogEntities.length === 1 &&\n      selectedEntity === ''\n    ) {\n      onChange(stringifyEntityRef(entities.catalogEntities[0]));\n    }\n  }, [entities, onChange, selectedEntity, required, allowArbitraryValues]);\n\n  return (\n    <ScaffolderField\n      rawErrors={rawErrors}\n      rawDescription={uiSchema['ui:description'] ?? description}\n      required={required}\n      disabled={isDisabled}\n      errors={errors}\n    >\n      <Autocomplete\n        disabled={\n          isDisabled ||\n          (required &&\n            !allowArbitraryValues &&\n            entities?.catalogEntities.length === 1)\n        }\n        id={idSchema?.$id}\n        value={selectedEntity}\n        loading={loading}\n        onChange={onSelect}\n        options={entities?.catalogEntities || []}\n        getOptionLabel={option =>\n          // option can be a string due to freeSolo.\n          typeof option === 'string'\n            ? option\n            : entities?.entityRefToPresentation.get(stringifyEntityRef(option))\n                ?.entityRef!\n        }\n        autoSelect={autoSelect}\n        freeSolo={allowArbitraryValues}\n        renderInput={params => (\n          <TextField\n            {...params}\n            label={title}\n            margin=\"dense\"\n            variant=\"outlined\"\n            required={required}\n            disabled={isDisabled}\n            InputProps={params.InputProps}\n          />\n        )}\n        renderOption={option => <EntityDisplayName entityRef={option} />}\n        filterOptions={createFilterOptions<Entity>({\n          stringify: option =>\n            entities?.entityRefToPresentation.get(stringifyEntityRef(option))\n              ?.primaryTitle!,\n        })}\n        ListboxComponent={VirtualizedListbox}\n      />\n    </ScaffolderField>\n  );\n};\n\n/**\n * Converts a especial `{exists: true}` value to the `CATALOG_FILTER_EXISTS` symbol.\n *\n * @param value - The value to convert.\n * @returns The converted value.\n */\nfunction convertOpsValues(\n  value: Exclude<EntityPickerFilterQueryValue, Array<any>>,\n): string | symbol {\n  if (typeof value === 'object' && value.exists) {\n    return CATALOG_FILTER_EXISTS;\n  }\n  return value?.toString();\n}\n\n/**\n * Converts schema filters to entity filter query, replacing `{exists:true}` values\n * with the constant `CATALOG_FILTER_EXISTS`.\n *\n * @param schemaFilters - An object containing schema filters with keys as filter names\n * and values as filter values.\n * @returns An object with the same keys as the input object, but with `{exists:true}` values\n * transformed to `CATALOG_FILTER_EXISTS` symbol.\n */\nfunction convertSchemaFiltersToQuery(\n  schemaFilters: EntityPickerFilterQuery,\n): Exclude<EntityFilterQuery, Array<any>> {\n  const query: EntityFilterQuery = {};\n\n  for (const [key, value] of Object.entries(schemaFilters)) {\n    if (Array.isArray(value)) {\n      query[key] = value;\n    } else {\n      query[key] = convertOpsValues(value);\n    }\n  }\n\n  return query;\n}\n\n/**\n * Builds an `EntityFilterQuery` based on the `uiSchema` passed in.\n * If `catalogFilter` is specified in the `uiSchema`, it is converted to a `EntityFilterQuery`.\n * If `allowedKinds` is specified in the `uiSchema` will support the legacy `allowedKinds` option.\n *\n * @param uiSchema The `uiSchema` of an `EntityPicker` component.\n * @returns An `EntityFilterQuery` based on the `uiSchema`, or `undefined` if `catalogFilter` is not specified in the `uiSchema`.\n */\nfunction buildCatalogFilter(\n  uiSchema: EntityPickerProps['uiSchema'],\n): EntityFilterQuery | undefined {\n  const allowedKinds = uiSchema['ui:options']?.allowedKinds;\n\n  const catalogFilter: EntityPickerUiOptions['catalogFilter'] | undefined =\n    uiSchema['ui:options']?.catalogFilter ||\n    (allowedKinds && { kind: allowedKinds });\n\n  if (!catalogFilter) {\n    return undefined;\n  }\n\n  if (Array.isArray(catalogFilter)) {\n    return catalogFilter.map(convertSchemaFiltersToQuery);\n  }\n\n  return convertSchemaFiltersToQuery(catalogFilter);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAyDO,MAAM,YAAA,GAAe,CAAC,KAAA,KAA6B;AACxD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,KAAA,GAAQ,EAAE,2BAA2B,CAAA;AAAA,MACrC,WAAA,GAAc,EAAE,iCAAiC;AAAA,KACnD;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,GACF,GAAI,KAAA;AACJ,EAAA,MAAM,aAAA,GAAgB,mBAAmB,QAAQ,CAAA;AACjD,EAAA,MAAM,WAAA,GAAc,QAAA,CAAS,YAAY,CAAA,EAAG,WAAA;AAC5C,EAAA,MAAM,gBAAA,GACJ,QAAA,CAAS,YAAY,CAAA,EAAG,gBAAA,IAAoB,MAAA;AAC9C,EAAA,MAAM,UAAA,GAAa,QAAA,GAAW,YAAY,CAAA,EAAG,UAAA,IAAc,IAAA;AAC3D,EAAA,MAAM,UAAA,GAAa,QAAA,GAAW,aAAa,CAAA,IAAK,KAAA;AAEhD,EAAA,MAAM,UAAA,GAAa,OAAO,aAAa,CAAA;AACvC,EAAA,MAAM,qBAAA,GAAwB,OAAO,wBAAwB,CAAA;AAE7D,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,OAAA,EAAQ,GAAI,SAAS,YAAY;AACxD,IAAA,MAAM,MAAA,GAAS;AAAA,MACb,MAAA;AAAA,MACA,eAAA;AAAA,MACA,oBAAA;AAAA,MACA,gBAAA;AAAA,MACA,sBAAA;AAAA,MACA,0BAAA;AAAA,MACA;AAAA,KACF;AACA,IAAA,MAAM,EAAE,KAAA,EAAM,GAAI,MAAM,UAAA,CAAW,WAAA;AAAA,MACjC,aAAA,GACI,EAAE,MAAA,EAAQ,aAAA,EAAe,QAAO,GAChC,EAAE,MAAA,EAAQ,MAAA,EAAW,MAAA;AAAO,KAClC;AAEA,IAAA,MAAM,0BAA0B,IAAI,GAAA;AAAA,MAIlC,MAAM,OAAA,CAAQ,GAAA;AAAA,QACZ,KAAA,CAAM,GAAA,CAAI,OAAM,IAAA,KAAQ;AACtB,UAAA,MAAM,YAAA,GAAe,MAAM,qBAAA,CAAsB,SAAA,CAAU,IAAI,CAAA,CAC5D,OAAA;AACH,UAAA,OAAO,CAAC,kBAAA,CAAmB,IAAI,CAAA,EAAG,YAAY,CAAA;AAAA,QAIhD,CAAC;AAAA;AACH,KACF;AAEA,IAAA,OAAO,EAAE,eAAA,EAAiB,KAAA,EAAO,uBAAA,EAAwB;AAAA,EAC3D,CAAC,CAAA;AAED,EAAA,MAAM,oBAAA,GACJ,QAAA,CAAS,YAAY,CAAA,EAAG,oBAAA,IAAwB,IAAA;AAElD,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,aAAA,KAA0B;AACzB,MAAA,IAAI;AAEF,QAAA,MAAM,SAAA,GAAY,eAAe,aAAA,EAAe;AAAA,UAC9C,WAAA;AAAA,UACA;AAAA,SACD,CAAA;AAED,QAAA,OAAO,mBAAmB,SAAS,CAAA;AAAA,MACrC,SAAS,GAAA,EAAK;AACZ,QAAA,OAAO,aAAA;AAAA,MACT;AAAA,IACF,CAAA;AAAA,IACA,CAAC,aAAa,gBAAgB;AAAA,GAChC;AAEA,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,CAAA,EAAQ,GAAA,EAA6B,MAAA,KAAqC;AAEzE,MAAA,IAAI,OAAO,QAAQ,QAAA,EAAU;AAE3B,QAAA,QAAA,CAAS,GAAA,GAAM,kBAAA,CAAmB,GAAa,CAAA,GAAI,MAAS,CAAA;AAAA,MAC9D,CAAA,MAAO;AACL,QAAA,IAAI,MAAA,KAAW,MAAA,IAAU,MAAA,KAAW,eAAA,EAAiB;AAEnD,UAAA,IAAI,SAAA,GAAY,GAAA;AAChB,UAAA,IAAI;AAEF,YAAA,SAAA,GAAY,kBAAA;AAAA,cACV,eAAe,GAAA,EAAe;AAAA,gBAC5B,WAAA;AAAA,gBACA;AAAA,eACD;AAAA,aACH;AAAA,UACF,SAAS,GAAA,EAAK;AAAA,UAEd;AAEA,UAAA,IAAI,QAAA,KAAa,OAAO,oBAAA,EAAsB;AAC5C,YAAA,QAAA,CAAS,SAAS,CAAA;AAAA,UACpB;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAA;AAAA,IACA,CAAC,QAAA,EAAU,QAAA,EAAU,WAAA,EAAa,kBAAkB,oBAAoB;AAAA,GAC1E;AAIA,EAAA,MAAM,cAAA,GACJ,QAAA,EAAU,eAAA,CAAgB,IAAA,CAAK,OAAK,kBAAA,CAAmB,CAAC,CAAA,KAAM,QAAQ,CAAA,KACrE,oBAAA,IAAwB,QAAA,GAAW,QAAA,CAAS,QAAQ,CAAA,GAAI,EAAA,CAAA;AAE3D,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IACE,QAAA,IACA,CAAC,oBAAA,IACD,QAAA,EAAU,gBAAgB,MAAA,KAAW,CAAA,IACrC,mBAAmB,EAAA,EACnB;AACA,MAAA,QAAA,CAAS,kBAAA,CAAmB,QAAA,CAAS,eAAA,CAAgB,CAAC,CAAC,CAAC,CAAA;AAAA,IAC1D;AAAA,EACF,GAAG,CAAC,QAAA,EAAU,UAAU,cAAA,EAAgB,QAAA,EAAU,oBAAoB,CAAC,CAAA;AAEvE,EAAA,uBACE,GAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,cAAA,EAAgB,QAAA,CAAS,gBAAgB,CAAA,IAAK,WAAA;AAAA,MAC9C,QAAA;AAAA,MACA,QAAA,EAAU,UAAA;AAAA,MACV,MAAA;AAAA,MAEA,QAAA,kBAAA,GAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,UACE,UAAA,IACC,QAAA,IACC,CAAC,oBAAA,IACD,QAAA,EAAU,gBAAgB,MAAA,KAAW,CAAA;AAAA,UAEzC,IAAI,QAAA,EAAU,GAAA;AAAA,UACd,KAAA,EAAO,cAAA;AAAA,UACP,OAAA;AAAA,UACA,QAAA,EAAU,QAAA;AAAA,UACV,OAAA,EAAS,QAAA,EAAU,eAAA,IAAmB,EAAC;AAAA,UACvC,cAAA,EAAgB,CAAA,MAAA;AAAA;AAAA,YAEd,OAAO,MAAA,KAAW,QAAA,GACd,MAAA,GACA,QAAA,EAAU,wBAAwB,GAAA,CAAI,kBAAA,CAAmB,MAAM,CAAC,CAAA,EAC5D;AAAA,WAAA;AAAA,UAEV,UAAA;AAAA,UACA,QAAA,EAAU,oBAAA;AAAA,UACV,aAAa,CAAA,MAAA,qBACX,GAAA;AAAA,YAAC,SAAA;AAAA,YAAA;AAAA,cACE,GAAG,MAAA;AAAA,cACJ,KAAA,EAAO,KAAA;AAAA,cACP,MAAA,EAAO,OAAA;AAAA,cACP,OAAA,EAAQ,UAAA;AAAA,cACR,QAAA;AAAA,cACA,QAAA,EAAU,UAAA;AAAA,cACV,YAAY,MAAA,CAAO;AAAA;AAAA,WACrB;AAAA,UAEF,YAAA,EAAc,CAAA,MAAA,qBAAU,GAAA,CAAC,iBAAA,EAAA,EAAkB,WAAW,MAAA,EAAQ,CAAA;AAAA,UAC9D,eAAe,mBAAA,CAA4B;AAAA,YACzC,SAAA,EAAW,YACT,QAAA,EAAU,uBAAA,CAAwB,IAAI,kBAAA,CAAmB,MAAM,CAAC,CAAA,EAC5D;AAAA,WACP,CAAA;AAAA,UACD,gBAAA,EAAkB;AAAA;AAAA;AACpB;AAAA,GACF;AAEJ;AAQA,SAAS,iBACP,KAAA,EACiB;AACjB,EAAA,IAAI,OAAO,KAAA,KAAU,QAAA,IAAY,KAAA,CAAM,MAAA,EAAQ;AAC7C,IAAA,OAAO,qBAAA;AAAA,EACT;AACA,EAAA,OAAO,OAAO,QAAA,EAAS;AACzB;AAWA,SAAS,4BACP,aAAA,EACwC;AACxC,EAAA,MAAM,QAA2B,EAAC;AAElC,EAAA,KAAA,MAAW,CAAC,GAAA,EAAK,KAAK,KAAK,MAAA,CAAO,OAAA,CAAQ,aAAa,CAAA,EAAG;AACxD,IAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,KAAK,CAAA,EAAG;AACxB,MAAA,KAAA,CAAM,GAAG,CAAA,GAAI,KAAA;AAAA,IACf,CAAA,MAAO;AACL,MAAA,KAAA,CAAM,GAAG,CAAA,GAAI,gBAAA,CAAiB,KAAK,CAAA;AAAA,IACrC;AAAA,EACF;AAEA,EAAA,OAAO,KAAA;AACT;AAUA,SAAS,mBACP,QAAA,EAC+B;AAC/B,EAAA,MAAM,YAAA,GAAe,QAAA,CAAS,YAAY,CAAA,EAAG,YAAA;AAE7C,EAAA,MAAM,aAAA,GACJ,SAAS,YAAY,CAAA,EAAG,iBACvB,YAAA,IAAgB,EAAE,MAAM,YAAA,EAAa;AAExC,EAAA,IAAI,CAAC,aAAA,EAAe;AAClB,IAAA,OAAO,MAAA;AAAA,EACT;AAEA,EAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,aAAa,CAAA,EAAG;AAChC,IAAA,OAAO,aAAA,CAAc,IAAI,2BAA2B,CAAA;AAAA,EACtD;AAEA,EAAA,OAAO,4BAA4B,aAAa,CAAA;AAClD;;;;"}
+{"version":3,"file":"EntityPicker.esm.js","sources":["../../../../src/components/fields/EntityPicker/EntityPicker.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport {\n  type EntityFilterQuery,\n  CATALOG_FILTER_EXISTS,\n} from '@backstage/catalog-client';\nimport {\n  Entity,\n  parseEntityRef,\n  stringifyEntityRef,\n} from '@backstage/catalog-model';\nimport { useApi } from '@backstage/core-plugin-api';\nimport {\n  EntityDisplayName,\n  EntityRefPresentationSnapshot,\n  catalogApiRef,\n  entityPresentationApiRef,\n} from '@backstage/plugin-catalog-react';\nimport TextField from '@material-ui/core/TextField';\nimport Autocomplete, {\n  AutocompleteChangeReason,\n  createFilterOptions,\n} from '@material-ui/lab/Autocomplete';\nimport {\n  type Key,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport {\n  EntityPickerFilterQueryValue,\n  EntityPickerProps,\n  EntityPickerUiOptions,\n  EntityPickerFilterQuery,\n} from './schema';\nimport { VirtualizedListbox } from '../VirtualizedListbox';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { scaffolderTranslationRef } from '../../../translation';\nimport {\n  ScaffolderField,\n  useScaffolderTheme,\n} from '@backstage/plugin-scaffolder-react/alpha';\nimport { Autocomplete as BuiAutocomplete } from '../Autocomplete';\n\nexport { EntityPickerSchema } from './schema';\n\n/**\n * The underlying component that is rendered in the form for the `EntityPicker`\n * field extension.\n *\n * @public\n */\nexport const EntityPicker = (props: EntityPickerProps) => {\n  const theme = useScaffolderTheme();\n  const { t } = useTranslationRef(scaffolderTranslationRef);\n  const {\n    onChange,\n    schema: {\n      title = t('fields.entityPicker.title'),\n      description = t('fields.entityPicker.description'),\n    },\n    required,\n    uiSchema,\n    rawErrors,\n    formData,\n    idSchema,\n    errors,\n  } = props;\n  const catalogFilter = buildCatalogFilter(uiSchema);\n  const defaultKind = uiSchema['ui:options']?.defaultKind;\n  const defaultNamespace =\n    uiSchema['ui:options']?.defaultNamespace || undefined;\n  const autoSelect = uiSchema?.['ui:options']?.autoSelect ?? true;\n  const isDisabled = uiSchema?.['ui:disabled'] ?? false;\n\n  const catalogApi = useApi(catalogApiRef);\n  const entityPresentationApi = useApi(entityPresentationApiRef);\n\n  const { value: entities, loading } = useAsync(async () => {\n    const fields = [\n      'kind',\n      'metadata.name',\n      'metadata.namespace',\n      'metadata.title',\n      'metadata.description',\n      'spec.profile.displayName',\n      'spec.type',\n    ];\n    const { items } = await catalogApi.getEntities(\n      catalogFilter\n        ? { filter: catalogFilter, fields }\n        : { filter: undefined, fields },\n    );\n\n    const entityRefToPresentation = new Map<\n      string,\n      EntityRefPresentationSnapshot\n    >(\n      await Promise.all(\n        items.map(async item => {\n          const presentation = await entityPresentationApi.forEntity(item)\n            .promise;\n          return [stringifyEntityRef(item), presentation] as [\n            string,\n            EntityRefPresentationSnapshot,\n          ];\n        }),\n      ),\n    );\n\n    return { catalogEntities: items, entityRefToPresentation };\n  });\n\n  const allowArbitraryValues =\n    uiSchema['ui:options']?.allowArbitraryValues ?? true;\n\n  const getLabel = useCallback(\n    (freeSoloValue: string) => {\n      try {\n        // Will throw if defaultKind or defaultNamespace are not set\n        const parsedRef = parseEntityRef(freeSoloValue, {\n          defaultKind,\n          defaultNamespace,\n        });\n\n        return stringifyEntityRef(parsedRef);\n      } catch (err) {\n        return freeSoloValue;\n      }\n    },\n    [defaultKind, defaultNamespace],\n  );\n\n  const onSelect = useCallback(\n    (_: any, ref: string | Entity | null, reason: AutocompleteChangeReason) => {\n      // ref can either be a string from free solo entry or\n      if (typeof ref !== 'string') {\n        // if ref does not exist: pass 'undefined' to trigger validation for required value\n        onChange(ref ? stringifyEntityRef(ref as Entity) : undefined);\n      } else {\n        if (reason === 'blur' || reason === 'create-option') {\n          // Add in default namespace, etc.\n          let entityRef = ref;\n          try {\n            // Attempt to parse the entity ref into it's full form.\n            entityRef = stringifyEntityRef(\n              parseEntityRef(ref as string, {\n                defaultKind,\n                defaultNamespace,\n              }),\n            );\n          } catch (err) {\n            // If the passed in value isn't an entity ref, do nothing.\n          }\n          // We need to check against formData here as that's the previous value for this field.\n          if (formData !== ref || allowArbitraryValues) {\n            onChange(entityRef);\n          }\n        }\n      }\n    },\n    [onChange, formData, defaultKind, defaultNamespace, allowArbitraryValues],\n  );\n\n  // Since free solo can be enabled, attempt to parse as a full entity ref first, then\n  // fall back to the given value.\n  const selectedEntity =\n    entities?.catalogEntities.find(e => stringifyEntityRef(e) === formData) ??\n    (allowArbitraryValues && formData ? getLabel(formData) : '');\n\n  // BUI: options for autocomplete\n  const buiOptions = useMemo(\n    () =>\n      (entities?.catalogEntities || []).map(entity => {\n        const entityRef = stringifyEntityRef(entity);\n        const presentation = entities?.entityRefToPresentation.get(entityRef);\n        return {\n          value: entityRef,\n          label: presentation?.primaryTitle || entityRef,\n        };\n      }),\n    [entities],\n  );\n\n  // BUI: controlled input value\n  const [inputValue, setInputValue] = useState(formData || '');\n\n  useEffect(() => {\n    if (formData) {\n      const opt = buiOptions.find(o => o.value === formData);\n      setInputValue(opt?.label || formData);\n    } else {\n      setInputValue('');\n    }\n  }, [formData, buiOptions]);\n\n  const selectedKey =\n    formData && buiOptions.some(o => o.value === formData) ? formData : null;\n\n  const lastCommittedRef = useRef(formData);\n\n  useEffect(() => {\n    lastCommittedRef.current = formData;\n  }, [formData]);\n\n  const handleSelectionChange = useCallback(\n    (key: Key | null) => {\n      if (key !== null) {\n        const value = String(key);\n        lastCommittedRef.current = value;\n        onChange(value);\n      } else if (allowArbitraryValues && inputValue) {\n        let entityRef = inputValue;\n        try {\n          entityRef = stringifyEntityRef(\n            parseEntityRef(inputValue, { defaultKind, defaultNamespace }),\n          );\n        } catch {\n          // If the input isn't a valid entity ref, use it as-is\n        }\n        lastCommittedRef.current = entityRef;\n        onChange(entityRef);\n      } else {\n        lastCommittedRef.current = undefined;\n        onChange(undefined);\n      }\n    },\n    [onChange, allowArbitraryValues, inputValue, defaultKind, defaultNamespace],\n  );\n\n  const handleBlur = useCallback(() => {\n    if (allowArbitraryValues && inputValue) {\n      let entityRef = inputValue;\n      try {\n        entityRef = stringifyEntityRef(\n          parseEntityRef(inputValue, { defaultKind, defaultNamespace }),\n        );\n      } catch {\n        // If the input isn't a valid entity ref, use it as-is\n      }\n      if (lastCommittedRef.current !== entityRef) {\n        lastCommittedRef.current = entityRef;\n        onChange(entityRef);\n      }\n    }\n  }, [\n    allowArbitraryValues,\n    inputValue,\n    defaultKind,\n    defaultNamespace,\n    onChange,\n  ]);\n\n  // Auto-select when only one entity and required\n  useEffect(() => {\n    if (theme === 'bui') {\n      if (\n        required &&\n        !allowArbitraryValues &&\n        entities?.catalogEntities.length === 1 &&\n        !formData\n      ) {\n        onChange(stringifyEntityRef(entities.catalogEntities[0]));\n      }\n    } else {\n      if (\n        required &&\n        !allowArbitraryValues &&\n        entities?.catalogEntities.length === 1 &&\n        selectedEntity === ''\n      ) {\n        onChange(stringifyEntityRef(entities.catalogEntities[0]));\n      }\n    }\n  }, [\n    entities,\n    onChange,\n    selectedEntity,\n    formData,\n    required,\n    allowArbitraryValues,\n    theme,\n  ]);\n\n  if (theme === 'bui') {\n    const isAutoSelected =\n      required &&\n      !allowArbitraryValues &&\n      entities?.catalogEntities.length === 1;\n\n    return (\n      <ScaffolderField\n        rawErrors={rawErrors}\n        rawDescription={uiSchema['ui:description'] ?? description}\n        required={required}\n        disabled={isDisabled}\n        errors={errors}\n      >\n        <BuiAutocomplete\n          id={idSchema?.$id}\n          label={title}\n          isRequired={required}\n          isDisabled={isDisabled || isAutoSelected}\n          selectedKey={selectedKey}\n          inputValue={inputValue}\n          onInputChange={setInputValue}\n          onSelectionChange={handleSelectionChange}\n          onBlur={handleBlur}\n          isLoading={loading}\n          options={buiOptions}\n          allowsCustomValue={allowArbitraryValues}\n          isInvalid={rawErrors && rawErrors.length > 0}\n        />\n      </ScaffolderField>\n    );\n  }\n\n  return (\n    <ScaffolderField\n      rawErrors={rawErrors}\n      rawDescription={uiSchema['ui:description'] ?? description}\n      required={required}\n      disabled={isDisabled}\n      errors={errors}\n    >\n      <Autocomplete\n        disabled={\n          isDisabled ||\n          (required &&\n            !allowArbitraryValues &&\n            entities?.catalogEntities.length === 1)\n        }\n        id={idSchema?.$id}\n        value={selectedEntity}\n        loading={loading}\n        onChange={onSelect}\n        options={entities?.catalogEntities || []}\n        getOptionLabel={option =>\n          // option can be a string due to freeSolo.\n          typeof option === 'string'\n            ? option\n            : entities?.entityRefToPresentation.get(stringifyEntityRef(option))\n                ?.entityRef!\n        }\n        autoSelect={autoSelect}\n        freeSolo={allowArbitraryValues}\n        renderInput={params => (\n          <TextField\n            {...params}\n            label={title}\n            margin=\"dense\"\n            variant=\"outlined\"\n            required={required}\n            disabled={isDisabled}\n            InputProps={params.InputProps}\n          />\n        )}\n        renderOption={option => <EntityDisplayName entityRef={option} />}\n        filterOptions={createFilterOptions<Entity>({\n          stringify: option =>\n            entities?.entityRefToPresentation.get(stringifyEntityRef(option))\n              ?.primaryTitle!,\n        })}\n        ListboxComponent={VirtualizedListbox}\n      />\n    </ScaffolderField>\n  );\n};\n\n/**\n * Converts a especial `{exists: true}` value to the `CATALOG_FILTER_EXISTS` symbol.\n *\n * @param value - The value to convert.\n * @returns The converted value.\n */\nfunction convertOpsValues(\n  value: Exclude<EntityPickerFilterQueryValue, Array<any>>,\n): string | symbol {\n  if (typeof value === 'object' && value.exists) {\n    return CATALOG_FILTER_EXISTS;\n  }\n  return value?.toString();\n}\n\n/**\n * Converts schema filters to entity filter query, replacing `{exists:true}` values\n * with the constant `CATALOG_FILTER_EXISTS`.\n *\n * @param schemaFilters - An object containing schema filters with keys as filter names\n * and values as filter values.\n * @returns An object with the same keys as the input object, but with `{exists:true}` values\n * transformed to `CATALOG_FILTER_EXISTS` symbol.\n */\nfunction convertSchemaFiltersToQuery(\n  schemaFilters: EntityPickerFilterQuery,\n): Exclude<EntityFilterQuery, Array<any>> {\n  const query: EntityFilterQuery = {};\n\n  for (const [key, value] of Object.entries(schemaFilters)) {\n    if (Array.isArray(value)) {\n      query[key] = value;\n    } else {\n      query[key] = convertOpsValues(value);\n    }\n  }\n\n  return query;\n}\n\n/**\n * Builds an `EntityFilterQuery` based on the `uiSchema` passed in.\n * If `catalogFilter` is specified in the `uiSchema`, it is converted to a `EntityFilterQuery`.\n * If `allowedKinds` is specified in the `uiSchema` will support the legacy `allowedKinds` option.\n *\n * @param uiSchema The `uiSchema` of an `EntityPicker` component.\n * @returns An `EntityFilterQuery` based on the `uiSchema`, or `undefined` if `catalogFilter` is not specified in the `uiSchema`.\n */\nfunction buildCatalogFilter(\n  uiSchema: EntityPickerProps['uiSchema'],\n): EntityFilterQuery | undefined {\n  const allowedKinds = uiSchema['ui:options']?.allowedKinds;\n\n  const catalogFilter: EntityPickerUiOptions['catalogFilter'] | undefined =\n    uiSchema['ui:options']?.catalogFilter ||\n    (allowedKinds && { kind: allowedKinds });\n\n  if (!catalogFilter) {\n    return undefined;\n  }\n\n  if (Array.isArray(catalogFilter)) {\n    return catalogFilter.map(convertSchemaFiltersToQuery);\n  }\n\n  return convertSchemaFiltersToQuery(catalogFilter);\n}\n"],"names":["BuiAutocomplete","Autocomplete","TextField"],"mappings":"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"}

package/dist/components/fields/EntityTagsPicker/EntityTagsPicker.esm.js

@@ -1,18 +1,21 @@
-import { jsx } from 'react/jsx-runtime';
-import { useState } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState, useMemo, useCallback } from 'react';
 import useAsync from 'react-use/esm/useAsync';
 import useEffectOnce from 'react-use/esm/useEffectOnce';
 import { makeValidator } from '@backstage/catalog-model';
 import { useApi } from '@backstage/core-plugin-api';
 import { catalogApiRef } from '@backstage/plugin-catalog-react';
-import TextField from '@material-ui/core/TextField';
-import Autocomplete from '@material-ui/lab/Autocomplete';
+import MuiTextField from '@material-ui/core/TextField';
+import MuiAutocomplete from '@material-ui/lab/Autocomplete';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { scaffolderTranslationRef } from '../../../translation.esm.js';
-import { ScaffolderField } from '@backstage/plugin-scaffolder-react/alpha';
+import { useScaffolderTheme, ScaffolderField } from '@backstage/plugin-scaffolder-react/alpha';
+import { Autocomplete } from '../Autocomplete/Autocomplete.esm.js';
+import { chipStyle, chipRemoveStyle } from '../buiChipStyles.esm.js';
 export { EntityTagsPickerSchema } from './schema.esm.js';
 
 const EntityTagsPicker = (props) => {
+  const theme = useScaffolderTheme();
   const { t } = useTranslationRef(scaffolderTranslationRef);
   const {
     formData,
@@ -67,7 +70,103 @@ const EntityTagsPicker = (props) => {
       onChange(values || []);
     }
   };
+  const buiTagOptions = useMemo(() => {
+    if (!existingTags) return [];
+    return Object.keys(existingTags).sort(
+      (a, b) => showCounts ? existingTags[b] - existingTags[a] : a.localeCompare(b)
+    );
+  }, [existingTags, showCounts]);
+  const selectedTags = useMemo(() => formData || [], [formData]);
+  const availableOptions = useMemo(
+    () => buiTagOptions.filter((tag) => !selectedTags.includes(tag)).map((tag) => ({
+      value: tag,
+      label: showCounts && existingTags ? `${tag} (${existingTags[tag]})` : tag
+    })),
+    [buiTagOptions, selectedTags, showCounts, existingTags]
+  );
+  const handleSelectionChange = useCallback(
+    (key) => {
+      if (key !== null) {
+        const tag = String(key);
+        if (!selectedTags.includes(tag)) {
+          onChange([...selectedTags, tag]);
+        }
+        setInputValue("");
+        setInputError(false);
+      } else if (inputValue) {
+        const newTag = inputValue.toLocaleLowerCase("en-US").trim();
+        const isValid = tagValidator(newTag);
+        const isDuplicate = selectedTags.includes(newTag);
+        setInputError(!isValid);
+        if (isValid && !isDuplicate) {
+          onChange([...selectedTags, newTag]);
+          setInputValue("");
+        }
+      }
+    },
+    [selectedTags, onChange, inputValue, tagValidator]
+  );
+  const handleRemove = useCallback(
+    (tag) => {
+      onChange(selectedTags.filter((item) => item !== tag));
+    },
+    [selectedTags, onChange]
+  );
   useEffectOnce(() => onChange(formData || []));
+  if (theme === "bui") {
+    return /* @__PURE__ */ jsx(
+      ScaffolderField,
+      {
+        rawErrors,
+        rawDescription: helperText ?? uiSchema["ui:description"] ?? description,
+        required,
+        disabled: isDisabled,
+        errors,
+        children: /* @__PURE__ */ jsxs("div", { children: [
+          selectedTags.length > 0 && /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: {
+                display: "flex",
+                flexWrap: "wrap",
+                gap: "var(--bui-space-1)",
+                marginBottom: "var(--bui-space-2)"
+              },
+              children: selectedTags.map((tag) => /* @__PURE__ */ jsxs("span", { style: chipStyle, children: [
+                tag,
+                !isDisabled && /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => handleRemove(tag),
+                    style: chipRemoveStyle,
+                    "aria-label": `Remove ${tag}`,
+                    children: "\xD7"
+                  }
+                )
+              ] }, tag))
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Autocomplete,
+            {
+              label: title,
+              isRequired: required,
+              isDisabled,
+              selectedKey: null,
+              inputValue,
+              onInputChange: setInputValue,
+              onSelectionChange: handleSelectionChange,
+              isLoading: loading,
+              options: availableOptions,
+              allowsCustomValue: true,
+              isInvalid: inputError || rawErrors && rawErrors.length > 0
+            }
+          )
+        ] })
+      }
+    );
+  }
   return /* @__PURE__ */ jsx(
     ScaffolderField,
     {
@@ -77,7 +176,7 @@ const EntityTagsPicker = (props) => {
       disabled: isDisabled,
       errors,
       children: /* @__PURE__ */ jsx(
-        Autocomplete,
+        MuiAutocomplete,
         {
           multiple: true,
           freeSolo: true,
@@ -91,7 +190,7 @@ const EntityTagsPicker = (props) => {
           ChipProps: { size: "small" },
           renderOption: (option) => showCounts ? `${option} (${existingTags?.[option]})` : option,
           renderInput: (params) => /* @__PURE__ */ jsx(
-            TextField,
+            MuiTextField,
             {
               ...params,
               label: title,

package/dist/components/fields/EntityTagsPicker/EntityTagsPicker.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityTagsPicker.esm.js","sources":["../../../../src/components/fields/EntityTagsPicker/EntityTagsPicker.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { ChangeEvent, useState } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport useEffectOnce from 'react-use/esm/useEffectOnce';\nimport { GetEntityFacetsRequest } from '@backstage/catalog-client';\nimport { makeValidator } from '@backstage/catalog-model';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport TextField from '@material-ui/core/TextField';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport { EntityTagsPickerProps } from './schema';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { scaffolderTranslationRef } from '../../../translation';\nimport { ScaffolderField } from '@backstage/plugin-scaffolder-react/alpha';\n\nexport { EntityTagsPickerSchema } from './schema';\n\n/**\n * The underlying component that is rendered in the form for the `EntityTagsPicker`\n * field extension.\n *\n * @public\n */\nexport const EntityTagsPicker = (props: EntityTagsPickerProps) => {\n  const { t } = useTranslationRef(scaffolderTranslationRef);\n  const {\n    formData,\n    onChange,\n    schema: {\n      title = t('fields.entityTagsPicker.title'),\n      description = t('fields.entityTagsPicker.description'),\n    },\n    uiSchema,\n    rawErrors,\n    required,\n    errors,\n  } = props;\n  const catalogApi = useApi(catalogApiRef);\n  const [tagOptions, setTagOptions] = useState<string[]>([]);\n  const [inputValue, setInputValue] = useState('');\n  const [inputError, setInputError] = useState(false);\n  const tagValidator = makeValidator().isValidTag;\n  const kinds = uiSchema['ui:options']?.kinds;\n  const showCounts = uiSchema['ui:options']?.showCounts;\n  const helperText = uiSchema['ui:options']?.helperText;\n  const isDisabled = uiSchema?.['ui:disabled'] ?? false;\n\n  const { loading, value: existingTags } = useAsync(async () => {\n    const facet = 'metadata.tags';\n    const tagsRequest: GetEntityFacetsRequest = { facets: [facet] };\n    if (kinds) {\n      tagsRequest.filter = { kind: kinds };\n    }\n\n    const { facets } = await catalogApi.getEntityFacets(tagsRequest);\n\n    const tagFacets = Object.fromEntries(\n      facets[facet].map(({ value, count }) => [value, count]),\n    );\n\n    setTagOptions(\n      Object.keys(tagFacets).sort((a, b) =>\n        showCounts ? tagFacets[b] - tagFacets[a] : a.localeCompare(b),\n      ),\n    );\n\n    return tagFacets;\n  });\n\n  const setTags = (_: ChangeEvent<{}>, values: string[] | null) => {\n    // Reset error state in case all tags were removed\n    let hasError = false;\n    let addDuplicate = false;\n    const currentTags = formData || [];\n\n    // If adding a new tag\n    if (values?.length && currentTags.length < values.length) {\n      const newTag = (values[values.length - 1] = values[values.length - 1]\n        .toLocaleLowerCase('en-US')\n        .trim());\n      hasError = !tagValidator(newTag);\n      addDuplicate = currentTags.indexOf(newTag) !== -1;\n    }\n\n    setInputError(hasError);\n    setInputValue(!hasError ? '' : inputValue);\n    if (!hasError && !addDuplicate) {\n      onChange(values || []);\n    }\n  };\n\n  // Initialize field to always return an array\n  useEffectOnce(() => onChange(formData || []));\n\n  return (\n    <ScaffolderField\n      rawErrors={rawErrors}\n      rawDescription={helperText ?? uiSchema['ui:description'] ?? description}\n      required={required}\n      disabled={isDisabled}\n      errors={errors}\n    >\n      <Autocomplete\n        multiple\n        freeSolo\n        filterSelectedOptions\n        onChange={setTags}\n        disabled={isDisabled}\n        value={formData || []}\n        inputValue={inputValue}\n        loading={loading}\n        options={tagOptions}\n        ChipProps={{ size: 'small' }}\n        renderOption={option =>\n          showCounts ? `${option} (${existingTags?.[option]})` : option\n        }\n        renderInput={params => (\n          <TextField\n            {...params}\n            label={title}\n            disabled={isDisabled}\n            onChange={e => setInputValue(e.target.value)}\n            error={inputError}\n            FormHelperTextProps={{ margin: 'dense', style: { marginLeft: 0 } }}\n          />\n        )}\n      />\n    </ScaffolderField>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"EntityTagsPicker.esm.js","sources":["../../../../src/components/fields/EntityTagsPicker/EntityTagsPicker.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { type Key, ChangeEvent, useCallback, useMemo, useState } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport useEffectOnce from 'react-use/esm/useEffectOnce';\nimport { GetEntityFacetsRequest } from '@backstage/catalog-client';\nimport { makeValidator } from '@backstage/catalog-model';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport TextField from '@material-ui/core/TextField';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport { EntityTagsPickerProps } from './schema';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { scaffolderTranslationRef } from '../../../translation';\nimport {\n  ScaffolderField,\n  useScaffolderTheme,\n} from '@backstage/plugin-scaffolder-react/alpha';\nimport { Autocomplete as BuiAutocomplete } from '../Autocomplete';\nimport { chipStyle, chipRemoveStyle } from '../buiChipStyles';\n\nexport { EntityTagsPickerSchema } from './schema';\n\n/**\n * The underlying component that is rendered in the form for the `EntityTagsPicker`\n * field extension.\n *\n * @public\n */\nexport const EntityTagsPicker = (props: EntityTagsPickerProps) => {\n  const theme = useScaffolderTheme();\n  const { t } = useTranslationRef(scaffolderTranslationRef);\n  const {\n    formData,\n    onChange,\n    schema: {\n      title = t('fields.entityTagsPicker.title'),\n      description = t('fields.entityTagsPicker.description'),\n    },\n    uiSchema,\n    rawErrors,\n    required,\n    errors,\n  } = props;\n  const catalogApi = useApi(catalogApiRef);\n  const [tagOptions, setTagOptions] = useState<string[]>([]);\n  const [inputValue, setInputValue] = useState('');\n  const [inputError, setInputError] = useState(false);\n  const tagValidator = makeValidator().isValidTag;\n  const kinds = uiSchema['ui:options']?.kinds;\n  const showCounts = uiSchema['ui:options']?.showCounts;\n  const helperText = uiSchema['ui:options']?.helperText;\n  const isDisabled = uiSchema?.['ui:disabled'] ?? false;\n\n  const { loading, value: existingTags } = useAsync(async () => {\n    const facet = 'metadata.tags';\n    const tagsRequest: GetEntityFacetsRequest = { facets: [facet] };\n    if (kinds) {\n      tagsRequest.filter = { kind: kinds };\n    }\n\n    const { facets } = await catalogApi.getEntityFacets(tagsRequest);\n\n    const tagFacets = Object.fromEntries(\n      facets[facet].map(({ value, count }) => [value, count]),\n    );\n\n    setTagOptions(\n      Object.keys(tagFacets).sort((a, b) =>\n        showCounts ? tagFacets[b] - tagFacets[a] : a.localeCompare(b),\n      ),\n    );\n\n    return tagFacets;\n  });\n\n  const setTags = (_: ChangeEvent<{}>, values: string[] | null) => {\n    // Reset error state in case all tags were removed\n    let hasError = false;\n    let addDuplicate = false;\n    const currentTags = formData || [];\n\n    // If adding a new tag\n    if (values?.length && currentTags.length < values.length) {\n      const newTag = (values[values.length - 1] = values[values.length - 1]\n        .toLocaleLowerCase('en-US')\n        .trim());\n      hasError = !tagValidator(newTag);\n      addDuplicate = currentTags.indexOf(newTag) !== -1;\n    }\n\n    setInputError(hasError);\n    setInputValue(!hasError ? '' : inputValue);\n    if (!hasError && !addDuplicate) {\n      onChange(values || []);\n    }\n  };\n\n  // BUI: computed tag options\n  const buiTagOptions = useMemo(() => {\n    if (!existingTags) return [];\n    return Object.keys(existingTags).sort((a, b) =>\n      showCounts ? existingTags[b] - existingTags[a] : a.localeCompare(b),\n    );\n  }, [existingTags, showCounts]);\n\n  const selectedTags = useMemo(() => formData || [], [formData]);\n  const availableOptions = useMemo(\n    () =>\n      buiTagOptions\n        .filter(tag => !selectedTags.includes(tag))\n        .map(tag => ({\n          value: tag,\n          label:\n            showCounts && existingTags ? `${tag} (${existingTags[tag]})` : tag,\n        })),\n    [buiTagOptions, selectedTags, showCounts, existingTags],\n  );\n\n  const handleSelectionChange = useCallback(\n    (key: Key | null) => {\n      if (key !== null) {\n        const tag = String(key);\n        if (!selectedTags.includes(tag)) {\n          onChange([...selectedTags, tag]);\n        }\n        setInputValue('');\n        setInputError(false);\n      } else if (inputValue) {\n        const newTag = inputValue.toLocaleLowerCase('en-US').trim();\n        const isValid = tagValidator(newTag);\n        const isDuplicate = selectedTags.includes(newTag);\n        setInputError(!isValid);\n\n        if (isValid && !isDuplicate) {\n          onChange([...selectedTags, newTag]);\n          setInputValue('');\n        }\n      }\n    },\n    [selectedTags, onChange, inputValue, tagValidator],\n  );\n\n  const handleRemove = useCallback(\n    (tag: string) => {\n      onChange(selectedTags.filter(item => item !== tag));\n    },\n    [selectedTags, onChange],\n  );\n\n  // Initialize field to always return an array\n  useEffectOnce(() => onChange(formData || []));\n\n  if (theme === 'bui') {\n    return (\n      <ScaffolderField\n        rawErrors={rawErrors}\n        rawDescription={\n          (helperText as string) ?? uiSchema['ui:description'] ?? description\n        }\n        required={required}\n        disabled={isDisabled}\n        errors={errors}\n      >\n        <div>\n          {selectedTags.length > 0 && (\n            <div\n              style={{\n                display: 'flex',\n                flexWrap: 'wrap',\n                gap: 'var(--bui-space-1)',\n                marginBottom: 'var(--bui-space-2)',\n              }}\n            >\n              {selectedTags.map(tag => (\n                <span key={tag} style={chipStyle}>\n                  {tag}\n                  {!isDisabled && (\n                    <button\n                      type=\"button\"\n                      onClick={() => handleRemove(tag)}\n                      style={chipRemoveStyle}\n                      aria-label={`Remove ${tag}`}\n                    >\n                      &times;\n                    </button>\n                  )}\n                </span>\n              ))}\n            </div>\n          )}\n          <BuiAutocomplete\n            label={title}\n            isRequired={required}\n            isDisabled={isDisabled}\n            selectedKey={null}\n            inputValue={inputValue}\n            onInputChange={setInputValue}\n            onSelectionChange={handleSelectionChange}\n            isLoading={loading}\n            options={availableOptions}\n            allowsCustomValue\n            isInvalid={inputError || (rawErrors && rawErrors.length > 0)}\n          />\n        </div>\n      </ScaffolderField>\n    );\n  }\n\n  return (\n    <ScaffolderField\n      rawErrors={rawErrors}\n      rawDescription={helperText ?? uiSchema['ui:description'] ?? description}\n      required={required}\n      disabled={isDisabled}\n      errors={errors}\n    >\n      <Autocomplete\n        multiple\n        freeSolo\n        filterSelectedOptions\n        onChange={setTags}\n        disabled={isDisabled}\n        value={formData || []}\n        inputValue={inputValue}\n        loading={loading}\n        options={tagOptions}\n        ChipProps={{ size: 'small' }}\n        renderOption={option =>\n          showCounts ? `${option} (${existingTags?.[option]})` : option\n        }\n        renderInput={params => (\n          <TextField\n            {...params}\n            label={title}\n            disabled={isDisabled}\n            onChange={e => setInputValue(e.target.value)}\n            error={inputError}\n            FormHelperTextProps={{ margin: 'dense', style: { marginLeft: 0 } }}\n          />\n        )}\n      />\n    </ScaffolderField>\n  );\n};\n"],"names":["BuiAutocomplete","Autocomplete","TextField"],"mappings":"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"}