@backstage/plugin-scaffolder-react 1.20.2-next.0 → 1.21.0-next.1

package/dist/next/components/Form/BuiTheme/widgets/TextareaWidget.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextareaWidget.esm.js","sources":["../../../../../../src/next/components/Form/BuiTheme/widgets/TextareaWidget.tsx"],"sourcesContent":["/*\n * Copyright 2026 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 { CSSProperties, ChangeEvent } from 'react';\nimport {\n  ariaDescribedByIds,\n  FormContextType,\n  RJSFSchema,\n  StrictRJSFSchema,\n  WidgetProps,\n} from '@rjsf/utils';\nimport { FieldLabel } from '@backstage/ui';\n\n// Matches the outlined style used by BUI PasswordField: sits on the same\n// neutral-1 surface as the form and uses a visible border to read as an input.\nconst baseStyle: CSSProperties = {\n  display: 'flex',\n  alignItems: 'flex-start',\n  padding: 'var(--bui-space-3)',\n  borderRadius: 'var(--bui-radius-3)',\n  border: '1px solid var(--bui-border-2)',\n  backgroundColor: 'var(--bui-bg-neutral-1)',\n  fontSize: 'var(--bui-font-size-3)',\n  fontFamily: 'var(--bui-font-regular)',\n  fontWeight: 400,\n  lineHeight: '1.5',\n  color: 'var(--bui-fg-primary)',\n  transition: 'border-color 0.2s ease-in-out',\n  width: '100%',\n  resize: 'vertical',\n  boxSizing: 'border-box' as const,\n  outline: 'none',\n  WebkitAppearance: 'none' as const,\n  MozAppearance: 'none' as const,\n  appearance: 'none' as const,\n};\n\nexport default function TextareaWidget<\n  T = any,\n  S extends StrictRJSFSchema = RJSFSchema,\n  F extends FormContextType = any,\n>({\n  id,\n  options = {},\n  placeholder,\n  required,\n  value,\n  disabled,\n  readonly,\n  label,\n  autofocus,\n  onChange: onFieldChange,\n  onBlur: onFieldBlur,\n  onFocus: onFieldFocus,\n  schema,\n  rawErrors = [],\n}: WidgetProps<T, S, F>) {\n  const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) =>\n    onFieldChange(\n      event.target.value === '' ? options.emptyValue : event.target.value,\n    );\n  const handleBlur = () => onFieldBlur(id, value);\n  const handleFocus = () => onFieldFocus(id, value);\n\n  const hasError = rawErrors.length > 0;\n\n  return (\n    <>\n      {(label || schema.title) && (\n        <FieldLabel\n          label={label || schema.title}\n          secondaryLabel={required ? 'Required' : undefined}\n          htmlFor={id}\n        />\n      )}\n      <textarea\n        id={id}\n        name={id}\n        placeholder={placeholder}\n        // eslint-disable-next-line jsx-a11y/no-autofocus\n        autoFocus={autofocus}\n        disabled={disabled}\n        readOnly={readonly}\n        value={value || ''}\n        rows={(options.rows as number) || 3}\n        onChange={handleChange}\n        onBlur={handleBlur}\n        onFocus={handleFocus}\n        aria-describedby={ariaDescribedByIds<T>(id)}\n        aria-invalid={hasError}\n        style={{\n          ...baseStyle,\n          ...(disabled && {\n            opacity: 0.5,\n            cursor: 'not-allowed',\n            borderColor: 'var(--bui-border-disabled)',\n          }),\n          ...(hasError && {\n            borderColor: 'var(--bui-fg-danger)',\n          }),\n        }}\n      />\n    </>\n  );\n}\n"],"names":[],"mappings":";;;;AA2BA,MAAM,SAAA,GAA2B;AAAA,EAC/B,OAAA,EAAS,MAAA;AAAA,EACT,UAAA,EAAY,YAAA;AAAA,EACZ,OAAA,EAAS,oBAAA;AAAA,EACT,YAAA,EAAc,qBAAA;AAAA,EACd,MAAA,EAAQ,+BAAA;AAAA,EACR,eAAA,EAAiB,yBAAA;AAAA,EACjB,QAAA,EAAU,wBAAA;AAAA,EACV,UAAA,EAAY,yBAAA;AAAA,EACZ,UAAA,EAAY,GAAA;AAAA,EACZ,UAAA,EAAY,KAAA;AAAA,EACZ,KAAA,EAAO,uBAAA;AAAA,EACP,UAAA,EAAY,+BAAA;AAAA,EACZ,KAAA,EAAO,MAAA;AAAA,EACP,MAAA,EAAQ,UAAA;AAAA,EACR,SAAA,EAAW,YAAA;AAAA,EACX,OAAA,EAAS,MAAA;AAAA,EACT,gBAAA,EAAkB,MAAA;AAAA,EAClB,aAAA,EAAe,MAAA;AAAA,EACf,UAAA,EAAY;AACd,CAAA;AAEA,SAAwB,cAAA,CAItB;AAAA,EACA,EAAA;AAAA,EACA,UAAU,EAAC;AAAA,EACX,WAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA,EAAU,aAAA;AAAA,EACV,MAAA,EAAQ,WAAA;AAAA,EACR,OAAA,EAAS,YAAA;AAAA,EACT,MAAA;AAAA,EACA,YAAY;AACd,CAAA,EAAyB;AACvB,EAAA,MAAM,YAAA,GAAe,CAAC,KAAA,KACpB,aAAA;AAAA,IACE,MAAM,MAAA,CAAO,KAAA,KAAU,KAAK,OAAA,CAAQ,UAAA,GAAa,MAAM,MAAA,CAAO;AAAA,GAChE;AACF,EAAA,MAAM,UAAA,GAAa,MAAM,WAAA,CAAY,EAAA,EAAI,KAAK,CAAA;AAC9C,EAAA,MAAM,WAAA,GAAc,MAAM,YAAA,CAAa,EAAA,EAAI,KAAK,CAAA;AAEhD,EAAA,MAAM,QAAA,GAAW,UAAU,MAAA,GAAS,CAAA;AAEpC,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACI,QAAA,EAAA;AAAA,IAAA,CAAA,KAAA,IAAS,OAAO,KAAA,qBAChB,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,SAAS,MAAA,CAAO,KAAA;AAAA,QACvB,cAAA,EAAgB,WAAW,UAAA,GAAa,MAAA;AAAA,QACxC,OAAA,EAAS;AAAA;AAAA,KACX;AAAA,oBAEF,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,IAAA,EAAM,EAAA;AAAA,QACN,WAAA;AAAA,QAEA,SAAA,EAAW,SAAA;AAAA,QACX,QAAA;AAAA,QACA,QAAA,EAAU,QAAA;AAAA,QACV,OAAO,KAAA,IAAS,EAAA;AAAA,QAChB,IAAA,EAAO,QAAQ,IAAA,IAAmB,CAAA;AAAA,QAClC,QAAA,EAAU,YAAA;AAAA,QACV,MAAA,EAAQ,UAAA;AAAA,QACR,OAAA,EAAS,WAAA;AAAA,QACT,kBAAA,EAAkB,mBAAsB,EAAE,CAAA;AAAA,QAC1C,cAAA,EAAc,QAAA;AAAA,QACd,KAAA,EAAO;AAAA,UACL,GAAG,SAAA;AAAA,UACH,GAAI,QAAA,IAAY;AAAA,YACd,OAAA,EAAS,GAAA;AAAA,YACT,MAAA,EAAQ,aAAA;AAAA,YACR,WAAA,EAAa;AAAA,WACf;AAAA,UACA,GAAI,QAAA,IAAY;AAAA,YACd,WAAA,EAAa;AAAA;AACf;AACF;AAAA;AACF,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/next/components/Form/BuiTheme/widgets/TimeWidget.esm.js

@@ -0,0 +1,9 @@
+import { jsx } from 'react/jsx-runtime';
+import DateInput from './DateInput.esm.js';
+
+function TimeWidget(props) {
+  return /* @__PURE__ */ jsx(DateInput, { ...props, inputType: "time" });
+}
+
+export { TimeWidget as default };
+//# sourceMappingURL=TimeWidget.esm.js.map

package/dist/next/components/Form/BuiTheme/widgets/TimeWidget.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeWidget.esm.js","sources":["../../../../../../src/next/components/Form/BuiTheme/widgets/TimeWidget.tsx"],"sourcesContent":["/*\n * Copyright 2026 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  FormContextType,\n  RJSFSchema,\n  StrictRJSFSchema,\n  WidgetProps,\n} from '@rjsf/utils';\nimport DateInput from './DateInput';\n\nexport default function TimeWidget<\n  T = any,\n  S extends StrictRJSFSchema = RJSFSchema,\n  F extends FormContextType = any,\n>(props: WidgetProps<T, S, F>) {\n  return <DateInput {...props} inputType=\"time\" />;\n}\n"],"names":[],"mappings":";;;AAuBA,SAAwB,WAItB,KAAA,EAA6B;AAC7B,EAAA,uBAAO,GAAA,CAAC,SAAA,EAAA,EAAW,GAAG,KAAA,EAAO,WAAU,MAAA,EAAO,CAAA;AAChD;;;;"}

package/dist/next/components/Form/BuiTheme/widgets/URLWidget.esm.js

@@ -0,0 +1,9 @@
+import { jsx } from 'react/jsx-runtime';
+import BaseInputTemplate from './BaseInputTemplate.esm.js';
+
+function URLWidget(props) {
+  return /* @__PURE__ */ jsx(BaseInputTemplate, { ...props, type: "url" });
+}
+
+export { URLWidget as default };
+//# sourceMappingURL=URLWidget.esm.js.map

package/dist/next/components/Form/BuiTheme/widgets/URLWidget.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"URLWidget.esm.js","sources":["../../../../../../src/next/components/Form/BuiTheme/widgets/URLWidget.tsx"],"sourcesContent":["/*\n * Copyright 2026 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  FormContextType,\n  RJSFSchema,\n  StrictRJSFSchema,\n  WidgetProps,\n} from '@rjsf/utils';\nimport BaseInputTemplate from './BaseInputTemplate';\n\nexport default function URLWidget<\n  T = any,\n  S extends StrictRJSFSchema = RJSFSchema,\n  F extends FormContextType = any,\n>(props: WidgetProps<T, S, F>) {\n  return <BaseInputTemplate {...props} type=\"url\" />;\n}\n"],"names":[],"mappings":";;;AAuBA,SAAwB,UAItB,KAAA,EAA6B;AAC7B,EAAA,uBAAO,GAAA,CAAC,iBAAA,EAAA,EAAmB,GAAG,KAAA,EAAO,MAAK,KAAA,EAAM,CAAA;AAClD;;;;"}

package/dist/next/components/Form/BuiTheme/widgets/index.esm.js

@@ -0,0 +1,42 @@
+import BaseInputTemplate from './BaseInputTemplate.esm.js';
+import CheckboxWidget from './CheckboxWidget.esm.js';
+import CheckboxesWidget from './CheckboxesWidget.esm.js';
+import ColorWidget from './ColorWidget.esm.js';
+import DateWidget from './DateWidget.esm.js';
+import DateTimeWidget from './DateTimeWidget.esm.js';
+import EmailWidget from './EmailWidget.esm.js';
+import FileWidget from './FileWidget.esm.js';
+import HiddenWidget from './HiddenWidget.esm.js';
+import PasswordWidget from './PasswordWidget.esm.js';
+import RadioWidget from './RadioWidget.esm.js';
+import RangeWidget from './RangeWidget.esm.js';
+import SelectWidget from './SelectWidget.esm.js';
+import TextareaWidget from './TextareaWidget.esm.js';
+import TextWidget from './TextWidget.esm.js';
+import TimeWidget from './TimeWidget.esm.js';
+import URLWidget from './URLWidget.esm.js';
+
+function generateBuiWidgets() {
+  return {
+    BaseInput: BaseInputTemplate,
+    CheckboxWidget,
+    CheckboxesWidget,
+    ColorWidget,
+    DateWidget,
+    DateTimeWidget,
+    EmailWidget,
+    FileWidget,
+    HiddenWidget,
+    PasswordWidget,
+    RadioWidget,
+    RangeWidget,
+    SelectWidget,
+    TextareaWidget,
+    TextWidget,
+    TimeWidget,
+    URLWidget
+  };
+}
+
+export { generateBuiWidgets };
+//# sourceMappingURL=index.esm.js.map

package/dist/next/components/Form/BuiTheme/widgets/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../../../../../src/next/components/Form/BuiTheme/widgets/index.ts"],"sourcesContent":["/*\n * Copyright 2026 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  FormContextType,\n  RegistryWidgetsType,\n  RJSFSchema,\n  StrictRJSFSchema,\n} from '@rjsf/utils';\n\nimport BaseInputTemplate from './BaseInputTemplate';\nimport CheckboxWidget from './CheckboxWidget';\nimport CheckboxesWidget from './CheckboxesWidget';\nimport ColorWidget from './ColorWidget';\nimport DateWidget from './DateWidget';\nimport DateTimeWidget from './DateTimeWidget';\nimport EmailWidget from './EmailWidget';\nimport FileWidget from './FileWidget';\nimport HiddenWidget from './HiddenWidget';\nimport PasswordWidget from './PasswordWidget';\nimport RadioWidget from './RadioWidget';\nimport RangeWidget from './RangeWidget';\nimport SelectWidget from './SelectWidget';\nimport TextareaWidget from './TextareaWidget';\nimport TextWidget from './TextWidget';\nimport TimeWidget from './TimeWidget';\nimport URLWidget from './URLWidget';\n\nexport function generateBuiWidgets<\n  T = any,\n  S extends StrictRJSFSchema = RJSFSchema,\n  F extends FormContextType = any,\n>(): RegistryWidgetsType<T, S, F> {\n  return {\n    BaseInput: BaseInputTemplate,\n    CheckboxWidget,\n    CheckboxesWidget,\n    ColorWidget,\n    DateWidget,\n    DateTimeWidget,\n    EmailWidget,\n    FileWidget,\n    HiddenWidget,\n    PasswordWidget,\n    RadioWidget,\n    RangeWidget,\n    SelectWidget,\n    TextareaWidget,\n    TextWidget,\n    TimeWidget,\n    URLWidget,\n  };\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAwCO,SAAS,kBAAA,GAIkB;AAChC,EAAA,OAAO;AAAA,IACL,SAAA,EAAW,iBAAA;AAAA,IACX,cAAA;AAAA,IACA,gBAAA;AAAA,IACA,WAAA;AAAA,IACA,UAAA;AAAA,IACA,cAAA;AAAA,IACA,WAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,cAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA;AAAA,IACA,cAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}

package/dist/next/components/Form/BuiTheme/widgets/selectOverrides.module.css.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../../../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/* Duplicated in plugins/scaffolder/src/components/fields/scaffolderFieldOverrides.module.css\n   Keep in sync if changes are made. */\n\n/* Override the BUI Select trigger border-radius to match BUI TextField\n   for visual consistency in scaffolder forms. Only applies to Select\n   instances that explicitly use className={overrides.select}. */\n.selectOverrides_select__adb984d3c9 [class*='bui-SelectTrigger'] {\n  border-radius: var(--bui-radius-2);\n}\n";
+var overrides = {"select":"selectOverrides_select__adb984d3c9"};
+styleInject(css_248z);
+
+export { overrides as default };
+//# sourceMappingURL=selectOverrides.module.css.esm.js.map

package/dist/next/components/Form/BuiTheme/widgets/selectOverrides.module.css.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectOverrides.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/next/components/Form/Form.esm.js

@@ -4,12 +4,19 @@ import { useMemo } from 'react';
 import { FieldTemplate } from './FieldTemplate.esm.js';
 import { DescriptionFieldTemplate } from './DescriptionFieldTemplate.esm.js';
 import { Theme } from '@rjsf/material-ui';
+import { generateBuiTheme } from './BuiTheme/index.esm.js';
+import { ScaffolderThemeProvider } from './ScaffolderThemeContext.esm.js';
+import styles from './BuiTheme/Form.module.css.esm.js';
 
-const WrappedForm = withTheme(Theme);
+const MuiForm = withTheme(Theme);
+const BuiForm = withTheme(generateBuiTheme());
 const Form = (props) => {
+  const { EXPERIMENTAL_theme: themeProp, ...formProps } = props;
+  const theme = themeProp ?? "mui";
+  const WrappedForm = theme === "bui" ? BuiForm : MuiForm;
   const wrappedFields = useMemo(
     () => Object.fromEntries(
-      Object.entries(props.fields ?? {}).map(([key, Component]) => [
+      Object.entries(formProps.fields ?? {}).map(([key, Component]) => [
         key,
         (wrapperProps) => {
           return /* @__PURE__ */ jsx(
@@ -26,17 +33,18 @@ const Form = (props) => {
         }
       ])
     ),
-    [props.fields]
+    [formProps.fields]
   );
   const templates = useMemo(
-    () => ({
+    () => theme === "bui" ? formProps.templates ?? {} : {
       FieldTemplate,
       DescriptionFieldTemplate,
-      ...props.templates
-    }),
-    [props.templates]
+      ...formProps.templates
+    },
+    [formProps.templates, theme]
   );
-  return /* @__PURE__ */ jsx(WrappedForm, { ...props, templates, fields: wrappedFields });
+  const form = /* @__PURE__ */ jsx(WrappedForm, { ...formProps, templates, fields: wrappedFields });
+  return /* @__PURE__ */ jsx(ScaffolderThemeProvider, { value: theme, children: theme === "bui" ? /* @__PURE__ */ jsx("div", { className: styles.form, children: form }) : form });
 };
 
 export { Form };

package/dist/next/components/Form/Form.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.esm.js","sources":["../../../../src/next/components/Form/Form.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\n\nimport { withTheme } from '@rjsf/core';\nimport { useMemo, PropsWithChildren } from 'react';\nimport { FieldTemplate } from './FieldTemplate';\nimport { DescriptionFieldTemplate } from './DescriptionFieldTemplate';\nimport { FieldProps } from '@rjsf/utils';\nimport { ScaffolderRJSFFormProps } from '@backstage/plugin-scaffolder-react';\nimport { Theme as MuiTheme } from '@rjsf/material-ui';\n\nconst WrappedForm = withTheme(MuiTheme);\n\n/**\n * The Form component\n * @alpha\n */\nexport const Form = (props: PropsWithChildren<ScaffolderRJSFFormProps>) => {\n  // This is where we unbreak the changes from RJSF, and make it work with our custom fields so we don't pass on this\n  // breaking change to our users. We will look more into a better API for this in scaffolderv2.\n  const wrappedFields = useMemo(\n    () =>\n      Object.fromEntries(\n        Object.entries(props.fields ?? {}).map(([key, Component]) => [\n          key,\n          (wrapperProps: FieldProps) => {\n            return (\n              <Component\n                {...wrapperProps}\n                uiSchema={wrapperProps.uiSchema ?? {}}\n                formData={wrapperProps.formData}\n                rawErrors={wrapperProps.rawErrors ?? []}\n                disabled={wrapperProps.disabled ?? false}\n                readonly={wrapperProps.readonly ?? false}\n              />\n            );\n          },\n        ]),\n      ),\n    [props.fields],\n  );\n\n  const templates = useMemo(\n    () => ({\n      FieldTemplate,\n      DescriptionFieldTemplate,\n      ...props.templates,\n    }),\n    [props.templates],\n  );\n\n  return (\n    <WrappedForm {...props} templates={templates} fields={wrappedFields} />\n  );\n};\n"],"names":["MuiTheme"],"mappings":";;;;;;;AAwBA,MAAM,WAAA,GAAc,UAAUA,KAAQ,CAAA;AAM/B,MAAM,IAAA,GAAO,CAAC,KAAA,KAAsD;AAGzE,EAAA,MAAM,aAAA,GAAgB,OAAA;AAAA,IACpB,MACE,MAAA,CAAO,WAAA;AAAA,MACL,MAAA,CAAO,OAAA,CAAQ,KAAA,CAAM,MAAA,IAAU,EAAE,CAAA,CAAE,GAAA,CAAI,CAAC,CAAC,GAAA,EAAK,SAAS,CAAA,KAAM;AAAA,QAC3D,GAAA;AAAA,QACA,CAAC,YAAA,KAA6B;AAC5B,UAAA,uBACE,GAAA;AAAA,YAAC,SAAA;AAAA,YAAA;AAAA,cACE,GAAG,YAAA;AAAA,cACJ,QAAA,EAAU,YAAA,CAAa,QAAA,IAAY,EAAC;AAAA,cACpC,UAAU,YAAA,CAAa,QAAA;AAAA,cACvB,SAAA,EAAW,YAAA,CAAa,SAAA,IAAa,EAAC;AAAA,cACtC,QAAA,EAAU,aAAa,QAAA,IAAY,KAAA;AAAA,cACnC,QAAA,EAAU,aAAa,QAAA,IAAY;AAAA;AAAA,WACrC;AAAA,QAEJ;AAAA,OACD;AAAA,KACH;AAAA,IACF,CAAC,MAAM,MAAM;AAAA,GACf;AAEA,EAAA,MAAM,SAAA,GAAY,OAAA;AAAA,IAChB,OAAO;AAAA,MACL,aAAA;AAAA,MACA,wBAAA;AAAA,MACA,GAAG,KAAA,CAAM;AAAA,KACX,CAAA;AAAA,IACA,CAAC,MAAM,SAAS;AAAA,GAClB;AAEA,EAAA,2BACG,WAAA,EAAA,EAAa,GAAG,KAAA,EAAO,SAAA,EAAsB,QAAQ,aAAA,EAAe,CAAA;AAEzE;;;;"}
+{"version":3,"file":"Form.esm.js","sources":["../../../../src/next/components/Form/Form.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\n\nimport { withTheme } from '@rjsf/core';\nimport { useMemo, PropsWithChildren } from 'react';\nimport { FieldTemplate } from './FieldTemplate';\nimport { DescriptionFieldTemplate } from './DescriptionFieldTemplate';\nimport { FieldProps } from '@rjsf/utils';\nimport {\n  ScaffolderRJSFFormProps,\n  type FormProps,\n} from '@backstage/plugin-scaffolder-react';\nimport { Theme as MuiTheme } from '@rjsf/material-ui';\nimport { generateBuiTheme } from './BuiTheme';\nimport {\n  ScaffolderThemeProvider,\n  type ScaffolderTheme,\n} from './ScaffolderThemeContext';\nimport styles from './BuiTheme/Form.module.css';\n\nconst MuiForm = withTheme(MuiTheme);\nconst BuiForm = withTheme(generateBuiTheme());\n\n/**\n * The Form component\n * @alpha\n */\nexport const Form = (\n  props: PropsWithChildren<\n    ScaffolderRJSFFormProps & Pick<FormProps, 'EXPERIMENTAL_theme'>\n  >,\n) => {\n  const { EXPERIMENTAL_theme: themeProp, ...formProps } = props;\n  const theme: ScaffolderTheme = themeProp ?? 'mui';\n  const WrappedForm = theme === 'bui' ? BuiForm : MuiForm;\n\n  // This is where we unbreak the changes from RJSF, and make it work with our custom fields so we don't pass on this\n  // breaking change to our users. We will look more into a better API for this in scaffolderv2.\n  const wrappedFields = useMemo(\n    () =>\n      Object.fromEntries(\n        Object.entries(formProps.fields ?? {}).map(([key, Component]) => [\n          key,\n          (wrapperProps: FieldProps) => {\n            return (\n              <Component\n                {...wrapperProps}\n                uiSchema={wrapperProps.uiSchema ?? {}}\n                formData={wrapperProps.formData}\n                rawErrors={wrapperProps.rawErrors ?? []}\n                disabled={wrapperProps.disabled ?? false}\n                readonly={wrapperProps.readonly ?? false}\n              />\n            );\n          },\n        ]),\n      ),\n    [formProps.fields],\n  );\n\n  const templates = useMemo(\n    () =>\n      theme === 'bui'\n        ? formProps.templates ?? {}\n        : {\n            FieldTemplate,\n            DescriptionFieldTemplate,\n            ...formProps.templates,\n          },\n    [formProps.templates, theme],\n  );\n\n  const form = (\n    <WrappedForm {...formProps} templates={templates} fields={wrappedFields} />\n  );\n\n  return (\n    <ScaffolderThemeProvider value={theme}>\n      {theme === 'bui' ? <div className={styles.form}>{form}</div> : form}\n    </ScaffolderThemeProvider>\n  );\n};\n"],"names":["MuiTheme"],"mappings":";;;;;;;;;;AAiCA,MAAM,OAAA,GAAU,UAAUA,KAAQ,CAAA;AAClC,MAAM,OAAA,GAAU,SAAA,CAAU,gBAAA,EAAkB,CAAA;AAMrC,MAAM,IAAA,GAAO,CAClB,KAAA,KAGG;AACH,EAAA,MAAM,EAAE,kBAAA,EAAoB,SAAA,EAAW,GAAG,WAAU,GAAI,KAAA;AACxD,EAAA,MAAM,QAAyB,SAAA,IAAa,KAAA;AAC5C,EAAA,MAAM,WAAA,GAAc,KAAA,KAAU,KAAA,GAAQ,OAAA,GAAU,OAAA;AAIhD,EAAA,MAAM,aAAA,GAAgB,OAAA;AAAA,IACpB,MACE,MAAA,CAAO,WAAA;AAAA,MACL,MAAA,CAAO,OAAA,CAAQ,SAAA,CAAU,MAAA,IAAU,EAAE,CAAA,CAAE,GAAA,CAAI,CAAC,CAAC,GAAA,EAAK,SAAS,CAAA,KAAM;AAAA,QAC/D,GAAA;AAAA,QACA,CAAC,YAAA,KAA6B;AAC5B,UAAA,uBACE,GAAA;AAAA,YAAC,SAAA;AAAA,YAAA;AAAA,cACE,GAAG,YAAA;AAAA,cACJ,QAAA,EAAU,YAAA,CAAa,QAAA,IAAY,EAAC;AAAA,cACpC,UAAU,YAAA,CAAa,QAAA;AAAA,cACvB,SAAA,EAAW,YAAA,CAAa,SAAA,IAAa,EAAC;AAAA,cACtC,QAAA,EAAU,aAAa,QAAA,IAAY,KAAA;AAAA,cACnC,QAAA,EAAU,aAAa,QAAA,IAAY;AAAA;AAAA,WACrC;AAAA,QAEJ;AAAA,OACD;AAAA,KACH;AAAA,IACF,CAAC,UAAU,MAAM;AAAA,GACnB;AAEA,EAAA,MAAM,SAAA,GAAY,OAAA;AAAA,IAChB,MACE,KAAA,KAAU,KAAA,GACN,SAAA,CAAU,SAAA,IAAa,EAAC,GACxB;AAAA,MACE,aAAA;AAAA,MACA,wBAAA;AAAA,MACA,GAAG,SAAA,CAAU;AAAA,KACf;AAAA,IACN,CAAC,SAAA,CAAU,SAAA,EAAW,KAAK;AAAA,GAC7B;AAEA,EAAA,MAAM,uBACJ,GAAA,CAAC,WAAA,EAAA,EAAa,GAAG,SAAA,EAAW,SAAA,EAAsB,QAAQ,aAAA,EAAe,CAAA;AAG3E,EAAA,uBACE,GAAA,CAAC,uBAAA,EAAA,EAAwB,KAAA,EAAO,KAAA,EAC7B,QAAA,EAAA,KAAA,KAAU,KAAA,mBAAQ,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,IAAA,EAAO,QAAA,EAAA,IAAA,EAAK,IAAS,IAAA,EACjE,CAAA;AAEJ;;;;"}

package/dist/next/components/Form/ScaffolderThemeContext.esm.js

@@ -0,0 +1,8 @@
+import { createContext, useContext } from 'react';
+
+const ScaffolderThemeContext = createContext("mui");
+const ScaffolderThemeProvider = ScaffolderThemeContext.Provider;
+const useScaffolderTheme = () => useContext(ScaffolderThemeContext);
+
+export { ScaffolderThemeProvider, useScaffolderTheme };
+//# sourceMappingURL=ScaffolderThemeContext.esm.js.map

package/dist/next/components/Form/ScaffolderThemeContext.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScaffolderThemeContext.esm.js","sources":["../../../../src/next/components/Form/ScaffolderThemeContext.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 { createContext, useContext } from 'react';\n\n/** @alpha */\nexport type ScaffolderTheme = 'mui' | 'bui';\n\nconst ScaffolderThemeContext = createContext<ScaffolderTheme>('mui');\n\n/** @alpha */\nexport const ScaffolderThemeProvider = ScaffolderThemeContext.Provider;\n\n/** @alpha */\nexport const useScaffolderTheme = (): ScaffolderTheme =>\n  useContext(ScaffolderThemeContext);\n"],"names":[],"mappings":";;AAoBA,MAAM,sBAAA,GAAyB,cAA+B,KAAK,CAAA;AAG5D,MAAM,0BAA0B,sBAAA,CAAuB;AAGvD,MAAM,kBAAA,GAAqB,MAChC,UAAA,CAAW,sBAAsB;;;;"}

package/dist/next/components/ScaffolderField/ScaffolderField.esm.js

@@ -1,7 +1,9 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { MarkdownContent } from '@backstage/core-components';
 import FormControl from '@material-ui/core/FormControl';
 import { makeStyles } from '@material-ui/core/styles';
+import { Box } from '@backstage/ui';
+import { useScaffolderTheme } from '../Form/ScaffolderThemeContext.esm.js';
 
 const useStyles = makeStyles((theme) => ({
   markdownDescription: {
@@ -15,7 +17,12 @@ const useStyles = makeStyles((theme) => ({
     }
   }
 }));
-const ScaffolderField = (props) => {
+const buiDescriptionStyle = {
+  fontSize: "var(--bui-font-size-2)",
+  color: "var(--bui-fg-secondary)",
+  margin: 0
+};
+const MuiScaffolderField = (props) => {
   const {
     children,
     displayLabel = true,
@@ -50,6 +57,22 @@ const ScaffolderField = (props) => {
     }
   );
 };
+const BuiScaffolderField = (props) => {
+  const { children, displayLabel = true, errors, help, rawDescription } = props;
+  return /* @__PURE__ */ jsxs(Box, { mb: "3", children: [
+    children,
+    displayLabel && rawDescription ? /* @__PURE__ */ jsx("div", { style: buiDescriptionStyle, children: /* @__PURE__ */ jsx(MarkdownContent, { content: rawDescription, linkTarget: "_blank" }) }) : null,
+    errors,
+    help
+  ] });
+};
+const ScaffolderField = (props) => {
+  const theme = useScaffolderTheme();
+  if (theme === "bui") {
+    return /* @__PURE__ */ jsx(BuiScaffolderField, { ...props });
+  }
+  return /* @__PURE__ */ jsx(MuiScaffolderField, { ...props });
+};
 
 export { ScaffolderField };
 //# sourceMappingURL=ScaffolderField.esm.js.map

package/dist/next/components/ScaffolderField/ScaffolderField.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScaffolderField.esm.js","sources":["../../../../src/next/components/ScaffolderField/ScaffolderField.tsx"],"sourcesContent":["/*\n * Copyright 2023 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 { PropsWithChildren, ReactElement } from 'react';\n\nimport { MarkdownContent } from '@backstage/core-components';\nimport FormControl from '@material-ui/core/FormControl';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles(theme => ({\n  markdownDescription: {\n    fontSize: theme.typography.caption.fontSize,\n    margin: 0,\n    color: theme.palette.text.secondary,\n    '& :first-child': {\n      margin: 0,\n      marginTop: '3px', // to keep the standard browser padding\n    },\n  },\n}));\n\n/**\n * Props for the {@link ScaffolderField} component\n * @alpha\n */\nexport interface ScaffolderFieldProps {\n  rawDescription?: string;\n  errors?: ReactElement;\n  rawErrors?: string[];\n  help?: ReactElement;\n  rawHelp?: string;\n  required?: boolean;\n  disabled?: boolean;\n  displayLabel?: boolean;\n}\n\n/**\n * A component to wrap up a input field which helps with formatting and supporting markdown\n * on the field types\n * @alpha\n */\nexport const ScaffolderField = (\n  props: PropsWithChildren<ScaffolderFieldProps>,\n) => {\n  const {\n    children,\n    displayLabel = true,\n    rawErrors = [],\n    errors,\n    help,\n    rawDescription,\n    required,\n    disabled,\n  } = props;\n  const classes = useStyles();\n  return (\n    <FormControl\n      fullWidth\n      error={rawErrors.length ? true : false}\n      required={required}\n      disabled={disabled}\n    >\n      {children}\n      {displayLabel && rawDescription ? (\n        <MarkdownContent\n          content={rawDescription}\n          linkTarget=\"_blank\"\n          className={classes.markdownDescription}\n        />\n      ) : null}\n      {errors}\n      {help}\n    </FormControl>\n  );\n};\n"],"names":[],"mappings":";;;;;AAqBA,MAAM,SAAA,GAAY,WAAW,CAAA,KAAA,MAAU;AAAA,EACrC,mBAAA,EAAqB;AAAA,IACnB,QAAA,EAAU,KAAA,CAAM,UAAA,CAAW,OAAA,CAAQ,QAAA;AAAA,IACnC,MAAA,EAAQ,CAAA;AAAA,IACR,KAAA,EAAO,KAAA,CAAM,OAAA,CAAQ,IAAA,CAAK,SAAA;AAAA,IAC1B,gBAAA,EAAkB;AAAA,MAChB,MAAA,EAAQ,CAAA;AAAA,MACR,SAAA,EAAW;AAAA;AAAA;AACb;AAEJ,CAAA,CAAE,CAAA;AAsBK,MAAM,eAAA,GAAkB,CAC7B,KAAA,KACG;AACH,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,YAAA,GAAe,IAAA;AAAA,IACf,YAAY,EAAC;AAAA,IACb,MAAA;AAAA,IACA,IAAA;AAAA,IACA,cAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,GACF,GAAI,KAAA;AACJ,EAAA,MAAM,UAAU,SAAA,EAAU;AAC1B,EAAA,uBACE,IAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAS,IAAA;AAAA,MACT,KAAA,EAAO,SAAA,CAAU,MAAA,GAAS,IAAA,GAAO,KAAA;AAAA,MACjC,QAAA;AAAA,MACA,QAAA;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,gBAAgB,cAAA,mBACf,GAAA;AAAA,UAAC,eAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAS,cAAA;AAAA,YACT,UAAA,EAAW,QAAA;AAAA,YACX,WAAW,OAAA,CAAQ;AAAA;AAAA,SACrB,GACE,IAAA;AAAA,QACH,MAAA;AAAA,QACA;AAAA;AAAA;AAAA,GACH;AAEJ;;;;"}
+{"version":3,"file":"ScaffolderField.esm.js","sources":["../../../../src/next/components/ScaffolderField/ScaffolderField.tsx"],"sourcesContent":["/*\n * Copyright 2023 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 CSSProperties,\n  type PropsWithChildren,\n  type ReactElement,\n} from 'react';\n\nimport { MarkdownContent } from '@backstage/core-components';\nimport FormControl from '@material-ui/core/FormControl';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { Box } from '@backstage/ui';\n\nimport { useScaffolderTheme } from '../Form/ScaffolderThemeContext';\n\nconst useStyles = makeStyles(theme => ({\n  markdownDescription: {\n    fontSize: theme.typography.caption.fontSize,\n    margin: 0,\n    color: theme.palette.text.secondary,\n    '& :first-child': {\n      margin: 0,\n      marginTop: '3px', // to keep the standard browser padding\n    },\n  },\n}));\n\nconst buiDescriptionStyle: CSSProperties = {\n  fontSize: 'var(--bui-font-size-2)',\n  color: 'var(--bui-fg-secondary)',\n  margin: 0,\n};\n\n/**\n * Props for the {@link ScaffolderField} component\n * @alpha\n */\nexport interface ScaffolderFieldProps {\n  rawDescription?: string;\n  errors?: ReactElement;\n  rawErrors?: string[];\n  help?: ReactElement;\n  rawHelp?: string;\n  required?: boolean;\n  disabled?: boolean;\n  displayLabel?: boolean;\n}\n\nconst MuiScaffolderField = (props: PropsWithChildren<ScaffolderFieldProps>) => {\n  const {\n    children,\n    displayLabel = true,\n    rawErrors = [],\n    errors,\n    help,\n    rawDescription,\n    required,\n    disabled,\n  } = props;\n  const classes = useStyles();\n  return (\n    <FormControl\n      fullWidth\n      error={rawErrors.length ? true : false}\n      required={required}\n      disabled={disabled}\n    >\n      {children}\n      {displayLabel && rawDescription ? (\n        <MarkdownContent\n          content={rawDescription}\n          linkTarget=\"_blank\"\n          className={classes.markdownDescription}\n        />\n      ) : null}\n      {errors}\n      {help}\n    </FormControl>\n  );\n};\n\nconst BuiScaffolderField = (props: PropsWithChildren<ScaffolderFieldProps>) => {\n  const { children, displayLabel = true, errors, help, rawDescription } = props;\n\n  return (\n    <Box mb=\"3\">\n      {children}\n      {displayLabel && rawDescription ? (\n        <div style={buiDescriptionStyle}>\n          <MarkdownContent content={rawDescription} linkTarget=\"_blank\" />\n        </div>\n      ) : null}\n      {errors}\n      {help}\n    </Box>\n  );\n};\n\n/**\n * A component to wrap up a input field which helps with formatting and supporting markdown\n * on the field types\n * @alpha\n */\nexport const ScaffolderField = (\n  props: PropsWithChildren<ScaffolderFieldProps>,\n) => {\n  const theme = useScaffolderTheme();\n\n  if (theme === 'bui') {\n    return <BuiScaffolderField {...props} />;\n  }\n\n  return <MuiScaffolderField {...props} />;\n};\n"],"names":[],"mappings":";;;;;;;AA4BA,MAAM,SAAA,GAAY,WAAW,CAAA,KAAA,MAAU;AAAA,EACrC,mBAAA,EAAqB;AAAA,IACnB,QAAA,EAAU,KAAA,CAAM,UAAA,CAAW,OAAA,CAAQ,QAAA;AAAA,IACnC,MAAA,EAAQ,CAAA;AAAA,IACR,KAAA,EAAO,KAAA,CAAM,OAAA,CAAQ,IAAA,CAAK,SAAA;AAAA,IAC1B,gBAAA,EAAkB;AAAA,MAChB,MAAA,EAAQ,CAAA;AAAA,MACR,SAAA,EAAW;AAAA;AAAA;AACb;AAEJ,CAAA,CAAE,CAAA;AAEF,MAAM,mBAAA,GAAqC;AAAA,EACzC,QAAA,EAAU,wBAAA;AAAA,EACV,KAAA,EAAO,yBAAA;AAAA,EACP,MAAA,EAAQ;AACV,CAAA;AAiBA,MAAM,kBAAA,GAAqB,CAAC,KAAA,KAAmD;AAC7E,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,YAAA,GAAe,IAAA;AAAA,IACf,YAAY,EAAC;AAAA,IACb,MAAA;AAAA,IACA,IAAA;AAAA,IACA,cAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,GACF,GAAI,KAAA;AACJ,EAAA,MAAM,UAAU,SAAA,EAAU;AAC1B,EAAA,uBACE,IAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAS,IAAA;AAAA,MACT,KAAA,EAAO,SAAA,CAAU,MAAA,GAAS,IAAA,GAAO,KAAA;AAAA,MACjC,QAAA;AAAA,MACA,QAAA;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,gBAAgB,cAAA,mBACf,GAAA;AAAA,UAAC,eAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAS,cAAA;AAAA,YACT,UAAA,EAAW,QAAA;AAAA,YACX,WAAW,OAAA,CAAQ;AAAA;AAAA,SACrB,GACE,IAAA;AAAA,QACH,MAAA;AAAA,QACA;AAAA;AAAA;AAAA,GACH;AAEJ,CAAA;AAEA,MAAM,kBAAA,GAAqB,CAAC,KAAA,KAAmD;AAC7E,EAAA,MAAM,EAAE,QAAA,EAAU,YAAA,GAAe,MAAM,MAAA,EAAQ,IAAA,EAAM,gBAAe,GAAI,KAAA;AAExE,EAAA,uBACE,IAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAG,GAAA,EACL,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,YAAA,IAAgB,cAAA,mBACf,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAO,mBAAA,EACV,QAAA,kBAAA,GAAA,CAAC,eAAA,EAAA,EAAgB,OAAA,EAAS,cAAA,EAAgB,UAAA,EAAW,QAAA,EAAS,GAChE,CAAA,GACE,IAAA;AAAA,IACH,MAAA;AAAA,IACA;AAAA,GAAA,EACH,CAAA;AAEJ,CAAA;AAOO,MAAM,eAAA,GAAkB,CAC7B,KAAA,KACG;AACH,EAAA,MAAM,QAAQ,kBAAA,EAAmB;AAEjC,EAAA,IAAI,UAAU,KAAA,EAAO;AACnB,IAAA,uBAAO,GAAA,CAAC,kBAAA,EAAA,EAAoB,GAAG,KAAA,EAAO,CAAA;AAAA,EACxC;AAEA,EAAA,uBAAO,GAAA,CAAC,kBAAA,EAAA,EAAoB,GAAG,KAAA,EAAO,CAAA;AACxC;;;;"}

package/dist/next/components/Stepper/Stepper.esm.js

@@ -1,7 +1,7 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useAnalytics, useApiHolder } from '@backstage/core-plugin-api';
 import { useTranslationRef } from '@backstage/frontend-plugin-api';
-import Button from '@material-ui/core/Button';
+import { Button } from '@backstage/ui';
 import LinearProgress from '@material-ui/core/LinearProgress';
 import MuiStep from '@material-ui/core/Step';
 import MuiStepLabel from '@material-ui/core/StepLabel';
@@ -19,6 +19,7 @@ import '../../../api/ref.esm.js';
 import 'lodash/cloneDeep';
 import { useTransformSchemaToProps } from '../../hooks/useTransformSchemaToProps.esm.js';
 import { Form } from '../Form/Form.esm.js';
+import '../Form/ScaffolderThemeContext.esm.js';
 import { PasswordWidget } from '../PasswordWidget/PasswordWidget.esm.js';
 import { ReviewState } from '../ReviewState/ReviewState.esm.js';
 import { createAsyncValidators } from './createAsyncValidators.esm.js';
@@ -196,22 +197,14 @@ const Stepper = (stepperProps) => {
           /* @__PURE__ */ jsx(
             Button,
             {
-              onClick: handleBack,
+              variant: "tertiary",
+              onPress: handleBack,
               className: styles.backButton,
-              disabled: activeStep < 1 || isValidating,
+              isDisabled: activeStep < 1 || isValidating,
               children: backLabel
             }
           ),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              variant: "contained",
-              color: "primary",
-              type: "submit",
-              disabled: isValidating,
-              children: activeStep === steps.length - 1 ? reviewLabel : t("stepper.nextButtonText")
-            }
-          )
+          /* @__PURE__ */ jsx(Button, { variant: "primary", type: "submit", isDisabled: isValidating, children: activeStep === steps.length - 1 ? reviewLabel : t("stepper.nextButtonText") })
         ] })
       },
       activeStep
@@ -234,19 +227,19 @@ const Stepper = (stepperProps) => {
           /* @__PURE__ */ jsx(
             Button,
             {
-              onClick: handleBack,
+              variant: "tertiary",
+              onPress: handleBack,
               className: styles.backButton,
-              disabled: activeStep < 1,
+              isDisabled: activeStep < 1,
               children: backLabel
             }
           ),
           /* @__PURE__ */ jsx(
             Button,
             {
-              disabled: isCreating,
-              variant: "contained",
-              color: "primary",
-              onClick: handleCreate,
+              variant: "primary",
+              isDisabled: isCreating,
+              onPress: handleCreate,
               children: createLabel
             }
           )

package/dist/next/components/Stepper/Stepper.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Stepper.esm.js","sources":["../../../../src/next/components/Stepper/Stepper.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 { useAnalytics, useApiHolder } from '@backstage/core-plugin-api';\nimport { useTranslationRef } from '@backstage/frontend-plugin-api';\nimport {\n  FieldExtensionOptions,\n  FormProps,\n  LayoutOptions,\n  ReviewStepProps,\n  TemplateParameterSchema,\n} from '@backstage/plugin-scaffolder-react';\nimport { JsonValue } from '@backstage/types';\nimport Button from '@material-ui/core/Button';\nimport LinearProgress from '@material-ui/core/LinearProgress';\nimport MuiStep from '@material-ui/core/Step';\nimport MuiStepLabel from '@material-ui/core/StepLabel';\nimport MuiStepper from '@material-ui/core/Stepper';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { type IChangeEvent } from '@rjsf/core';\nimport { ErrorSchema } from '@rjsf/utils';\nimport { customizeValidator } from '@rjsf/validator-ajv8';\nimport ajvErrors from 'ajv-errors';\nimport { merge } from 'lodash';\nimport {\n  ComponentType,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n  type ReactNode,\n} from 'react';\n\nimport { scaffolderReactTranslationRef } from '../../../translation';\nimport { useFormDataFromQuery, useTemplateSchema } from '../../hooks';\nimport { useTransformSchemaToProps } from '../../hooks/useTransformSchemaToProps';\nimport { Form } from '../Form';\nimport { PasswordWidget } from '../PasswordWidget/PasswordWidget';\nimport { ReviewState, type ReviewStateProps } from '../ReviewState';\nimport {\n  createAsyncValidators,\n  type FormValidation,\n} from './createAsyncValidators';\nimport { ErrorListTemplate } from './ErrorListTemplate';\nimport * as FieldOverrides from './FieldOverrides';\nimport { hasErrors } from './utils';\n\nconst validator = customizeValidator();\najvErrors(validator.ajv);\n\n/** @alpha */\nexport type BackstageTemplateStepperClassKey =\n  | 'backButton'\n  | 'footer'\n  | 'formWrapper';\n\nconst useStyles = makeStyles(\n  theme => ({\n    backButton: {\n      marginRight: theme.spacing(1),\n    },\n    footer: {\n      display: 'flex',\n      flexDirection: 'row',\n      justifyContent: 'right',\n      marginTop: theme.spacing(2),\n    },\n    formWrapper: {\n      padding: theme.spacing(2),\n    },\n  }),\n  { name: 'BackstageTemplateStepper' },\n);\n\n/**\n * The Props for {@link Stepper} component\n * @alpha\n */\nexport type StepperProps = {\n  manifest: TemplateParameterSchema;\n  extensions: FieldExtensionOptions<any, any>[];\n  /**\n   * @deprecated This was only ever used for analytics tracking purposes, which\n   * is now handled in the `<Workflow />` component. Passing it in will have no\n   * effect.\n   */\n  templateName?: string;\n  formProps?: FormProps;\n  initialState?: Record<string, JsonValue>;\n  onCreate: (values: Record<string, JsonValue>) => Promise<void>;\n  components?: {\n    ReviewStepComponent?: ComponentType<ReviewStepProps>;\n    ReviewStateComponent?: (props: ReviewStateProps) => JSX.Element;\n    backButtonText?: ReactNode;\n    createButtonText?: ReactNode;\n    reviewButtonText?: ReactNode;\n  };\n  layouts?: LayoutOptions[];\n};\n\n/**\n * The `Stepper` component is the Wizard that is rendered when a user selects a template\n * @alpha\n */\nexport const Stepper = (stepperProps: StepperProps) => {\n  const { t } = useTranslationRef(scaffolderReactTranslationRef);\n  const { layouts = [], components = {}, onCreate, ...props } = stepperProps;\n  const {\n    ReviewStateComponent = ReviewState,\n    ReviewStepComponent,\n    backButtonText = t('stepper.backButtonText'),\n    createButtonText = t('stepper.createButtonText'),\n    reviewButtonText = t('stepper.reviewButtonText'),\n  } = components;\n  const analytics = useAnalytics();\n  const { presentation, steps } = useTemplateSchema(props.manifest);\n  const apiHolder = useApiHolder();\n  const [activeStep, setActiveStep] = useState(0);\n  const [isValidating, setIsValidating] = useState(false);\n  const [initialState] = useFormDataFromQuery(props.initialState);\n  const [stepsState, setStepsState] =\n    useState<Record<string, JsonValue>>(initialState);\n\n  const [errors, setErrors] = useState<undefined | FormValidation>();\n  const styles = useStyles();\n\n  const backLabel =\n    presentation?.buttonLabels?.backButtonText ?? backButtonText;\n  const createLabel =\n    presentation?.buttonLabels?.createButtonText ?? createButtonText;\n  const reviewLabel =\n    presentation?.buttonLabels?.reviewButtonText ?? reviewButtonText;\n\n  const extensions = useMemo(() => {\n    return Object.fromEntries(\n      props.extensions.map(({ name, component }) => [name, component]),\n    );\n  }, [props.extensions]);\n\n  const fields = useMemo(\n    () => ({ ...FieldOverrides, ...extensions }),\n    [extensions],\n  );\n\n  const validators = useMemo(() => {\n    return Object.fromEntries(\n      props.extensions.map(({ name, validation }) => [name, validation]),\n    );\n  }, [props.extensions]);\n\n  const validation = useMemo(() => {\n    return createAsyncValidators(steps[activeStep]?.mergedSchema, validators, {\n      apiHolder,\n    });\n  }, [steps, activeStep, validators, apiHolder]);\n\n  const handleBack = useCallback(() => {\n    setActiveStep(prevActiveStep => prevActiveStep - 1);\n  }, [setActiveStep]);\n\n  const currentStep = useTransformSchemaToProps(steps[activeStep], { layouts });\n\n  const {\n    formContext: propFormContext,\n    uiSchema: propUiSchema,\n    liveOmit: _shouldLiveOmit,\n    omitExtraData: _shouldOmitExtraData,\n    ...restFormProps\n  } = props.formProps ?? {};\n\n  const handleChange = useCallback(\n    (e: IChangeEvent) => {\n      setStepsState(current => {\n        return { ...current, ...e.formData };\n      });\n    },\n    [setStepsState],\n  );\n\n  const handleNext = useCallback(\n    async ({ formData = {} }: { formData?: Record<string, JsonValue> }) => {\n      // The validation should never throw, as the validators are wrapped in a try/catch.\n      // This makes it fine to set and unset state without try/catch.\n      setErrors(undefined);\n      setIsValidating(true);\n\n      const returnedValidation = await validation(formData);\n\n      setStepsState(current => ({\n        ...current,\n        ...formData,\n      }));\n\n      setIsValidating(false);\n\n      if (hasErrors(returnedValidation)) {\n        setErrors(returnedValidation);\n      } else {\n        setErrors(undefined);\n        setActiveStep(prevActiveStep => {\n          const stepNum = prevActiveStep + 1;\n          analytics.captureEvent('click', `Next Step (${stepNum})`);\n          return stepNum;\n        });\n      }\n    },\n    [validation, analytics],\n  );\n\n  useEffect(() => {\n    const main = document.querySelector('main');\n    if (main && typeof main.scrollTo === 'function') {\n      main.scrollTo({ top: 0, behavior: 'auto' });\n    }\n  }, [activeStep]);\n\n  const mergedUiSchema = merge({}, propUiSchema, currentStep?.uiSchema);\n\n  const [isCreating, setIsCreating] = useState(false);\n\n  const handleCreate = useCallback(async () => {\n    setIsCreating(true);\n    analytics.captureEvent('click', `${createLabel}`);\n    try {\n      await onCreate(stepsState);\n    } finally {\n      setIsCreating(false);\n    }\n  }, [analytics, createLabel, onCreate, stepsState]);\n\n  return (\n    <>\n      {isValidating && <LinearProgress variant=\"indeterminate\" />}\n      <MuiStepper\n        activeStep={activeStep}\n        alternativeLabel\n        variant=\"elevation\"\n        style={{ overflowX: 'auto' }}\n      >\n        {steps.map((step, index) => {\n          const isAllowedLabelClick = activeStep > index;\n          return (\n            <MuiStep key={index}>\n              <MuiStepLabel\n                aria-label={t('stepper.stepIndexLabel', { index: index + 1 })}\n                style={{ cursor: isAllowedLabelClick ? 'pointer' : 'default' }}\n                onClick={() => {\n                  if (isAllowedLabelClick) setActiveStep(index);\n                }}\n              >\n                {step.title}\n              </MuiStepLabel>\n            </MuiStep>\n          );\n        })}\n        <MuiStep>\n          <MuiStepLabel>{reviewLabel}</MuiStepLabel>\n        </MuiStep>\n      </MuiStepper>\n      <div className={styles.formWrapper}>\n        {/* eslint-disable-next-line no-nested-ternary */}\n        {activeStep < steps.length ? (\n          <Form\n            key={activeStep}\n            validator={validator}\n            extraErrors={errors as unknown as ErrorSchema}\n            formData={stepsState}\n            formContext={{ ...propFormContext, formData: stepsState }}\n            schema={currentStep.schema}\n            uiSchema={mergedUiSchema}\n            onSubmit={handleNext}\n            fields={fields}\n            showErrorList=\"top\"\n            templates={{ ErrorListTemplate }}\n            onChange={handleChange}\n            widgets={{ password: PasswordWidget }}\n            experimental_defaultFormStateBehavior={{\n              allOf: 'populateDefaults',\n            }}\n            {...restFormProps}\n          >\n            <div className={styles.footer}>\n              <Button\n                onClick={handleBack}\n                className={styles.backButton}\n                disabled={activeStep < 1 || isValidating}\n              >\n                {backLabel}\n              </Button>\n              <Button\n                variant=\"contained\"\n                color=\"primary\"\n                type=\"submit\"\n                disabled={isValidating}\n              >\n                {activeStep === steps.length - 1\n                  ? reviewLabel\n                  : t('stepper.nextButtonText')}\n              </Button>\n            </div>\n          </Form>\n        ) : // TODO: potentially move away from this pattern, deprecate?\n        ReviewStepComponent ? (\n          <ReviewStepComponent\n            disableButtons={isValidating}\n            formData={stepsState}\n            handleBack={handleBack}\n            handleReset={() => {}}\n            steps={steps}\n            handleCreate={handleCreate}\n          />\n        ) : (\n          <>\n            <ReviewStateComponent formState={stepsState} schemas={steps} />\n            <div className={styles.footer}>\n              <Button\n                onClick={handleBack}\n                className={styles.backButton}\n                disabled={activeStep < 1}\n              >\n                {backLabel}\n              </Button>\n              <Button\n                disabled={isCreating}\n                variant=\"contained\"\n                color=\"primary\"\n                onClick={handleCreate}\n              >\n                {createLabel}\n              </Button>\n            </div>\n          </>\n        )}\n      </div>\n    </>\n  );\n};\n"],"names":["FieldOverrides","validation"],"mappings":"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"}
+{"version":3,"file":"Stepper.esm.js","sources":["../../../../src/next/components/Stepper/Stepper.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 { useAnalytics, useApiHolder } from '@backstage/core-plugin-api';\nimport { useTranslationRef } from '@backstage/frontend-plugin-api';\nimport {\n  FieldExtensionOptions,\n  FormProps,\n  LayoutOptions,\n  ReviewStepProps,\n  TemplateParameterSchema,\n} from '@backstage/plugin-scaffolder-react';\nimport { JsonValue } from '@backstage/types';\nimport { Button } from '@backstage/ui';\nimport LinearProgress from '@material-ui/core/LinearProgress';\nimport MuiStep from '@material-ui/core/Step';\nimport MuiStepLabel from '@material-ui/core/StepLabel';\nimport MuiStepper from '@material-ui/core/Stepper';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { type IChangeEvent } from '@rjsf/core';\nimport { ErrorSchema } from '@rjsf/utils';\nimport { customizeValidator } from '@rjsf/validator-ajv8';\nimport ajvErrors from 'ajv-errors';\nimport { merge } from 'lodash';\nimport {\n  ComponentType,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n  type ReactNode,\n} from 'react';\n\nimport { scaffolderReactTranslationRef } from '../../../translation';\nimport { useFormDataFromQuery, useTemplateSchema } from '../../hooks';\nimport { useTransformSchemaToProps } from '../../hooks/useTransformSchemaToProps';\nimport { Form } from '../Form';\nimport { PasswordWidget } from '../PasswordWidget/PasswordWidget';\nimport { ReviewState, type ReviewStateProps } from '../ReviewState';\nimport {\n  createAsyncValidators,\n  type FormValidation,\n} from './createAsyncValidators';\nimport { ErrorListTemplate } from './ErrorListTemplate';\nimport * as FieldOverrides from './FieldOverrides';\nimport { hasErrors } from './utils';\n\nconst validator = customizeValidator();\najvErrors(validator.ajv);\n\n/** @alpha */\nexport type BackstageTemplateStepperClassKey =\n  | 'backButton'\n  | 'footer'\n  | 'formWrapper';\n\nconst useStyles = makeStyles(\n  theme => ({\n    backButton: {\n      marginRight: theme.spacing(1),\n    },\n    footer: {\n      display: 'flex',\n      flexDirection: 'row',\n      justifyContent: 'right',\n      marginTop: theme.spacing(2),\n    },\n    formWrapper: {\n      padding: theme.spacing(2),\n    },\n  }),\n  { name: 'BackstageTemplateStepper' },\n);\n\n/**\n * The Props for {@link Stepper} component\n * @alpha\n */\nexport type StepperProps = {\n  manifest: TemplateParameterSchema;\n  extensions: FieldExtensionOptions<any, any>[];\n  /**\n   * @deprecated This was only ever used for analytics tracking purposes, which\n   * is now handled in the `<Workflow />` component. Passing it in will have no\n   * effect.\n   */\n  templateName?: string;\n  formProps?: FormProps;\n  initialState?: Record<string, JsonValue>;\n  onCreate: (values: Record<string, JsonValue>) => Promise<void>;\n  components?: {\n    ReviewStepComponent?: ComponentType<ReviewStepProps>;\n    ReviewStateComponent?: (props: ReviewStateProps) => JSX.Element;\n    backButtonText?: ReactNode;\n    createButtonText?: ReactNode;\n    reviewButtonText?: ReactNode;\n  };\n  layouts?: LayoutOptions[];\n};\n\n/**\n * The `Stepper` component is the Wizard that is rendered when a user selects a template\n * @alpha\n */\nexport const Stepper = (stepperProps: StepperProps) => {\n  const { t } = useTranslationRef(scaffolderReactTranslationRef);\n  const { layouts = [], components = {}, onCreate, ...props } = stepperProps;\n  const {\n    ReviewStateComponent = ReviewState,\n    ReviewStepComponent,\n    backButtonText = t('stepper.backButtonText'),\n    createButtonText = t('stepper.createButtonText'),\n    reviewButtonText = t('stepper.reviewButtonText'),\n  } = components;\n  const analytics = useAnalytics();\n  const { presentation, steps } = useTemplateSchema(props.manifest);\n  const apiHolder = useApiHolder();\n  const [activeStep, setActiveStep] = useState(0);\n  const [isValidating, setIsValidating] = useState(false);\n  const [initialState] = useFormDataFromQuery(props.initialState);\n  const [stepsState, setStepsState] =\n    useState<Record<string, JsonValue>>(initialState);\n\n  const [errors, setErrors] = useState<undefined | FormValidation>();\n  const styles = useStyles();\n\n  const backLabel =\n    presentation?.buttonLabels?.backButtonText ?? backButtonText;\n  const createLabel =\n    presentation?.buttonLabels?.createButtonText ?? createButtonText;\n  const reviewLabel =\n    presentation?.buttonLabels?.reviewButtonText ?? reviewButtonText;\n\n  const extensions = useMemo(() => {\n    return Object.fromEntries(\n      props.extensions.map(({ name, component }) => [name, component]),\n    );\n  }, [props.extensions]);\n\n  const fields = useMemo(\n    () => ({ ...FieldOverrides, ...extensions }),\n    [extensions],\n  );\n\n  const validators = useMemo(() => {\n    return Object.fromEntries(\n      props.extensions.map(({ name, validation }) => [name, validation]),\n    );\n  }, [props.extensions]);\n\n  const validation = useMemo(() => {\n    return createAsyncValidators(steps[activeStep]?.mergedSchema, validators, {\n      apiHolder,\n    });\n  }, [steps, activeStep, validators, apiHolder]);\n\n  const handleBack = useCallback(() => {\n    setActiveStep(prevActiveStep => prevActiveStep - 1);\n  }, [setActiveStep]);\n\n  const currentStep = useTransformSchemaToProps(steps[activeStep], { layouts });\n\n  const {\n    formContext: propFormContext,\n    uiSchema: propUiSchema,\n    liveOmit: _shouldLiveOmit,\n    omitExtraData: _shouldOmitExtraData,\n    ...restFormProps\n  } = props.formProps ?? {};\n\n  const handleChange = useCallback(\n    (e: IChangeEvent) => {\n      setStepsState(current => {\n        return { ...current, ...e.formData };\n      });\n    },\n    [setStepsState],\n  );\n\n  const handleNext = useCallback(\n    async ({ formData = {} }: { formData?: Record<string, JsonValue> }) => {\n      // The validation should never throw, as the validators are wrapped in a try/catch.\n      // This makes it fine to set and unset state without try/catch.\n      setErrors(undefined);\n      setIsValidating(true);\n\n      const returnedValidation = await validation(formData);\n\n      setStepsState(current => ({\n        ...current,\n        ...formData,\n      }));\n\n      setIsValidating(false);\n\n      if (hasErrors(returnedValidation)) {\n        setErrors(returnedValidation);\n      } else {\n        setErrors(undefined);\n        setActiveStep(prevActiveStep => {\n          const stepNum = prevActiveStep + 1;\n          analytics.captureEvent('click', `Next Step (${stepNum})`);\n          return stepNum;\n        });\n      }\n    },\n    [validation, analytics],\n  );\n\n  useEffect(() => {\n    const main = document.querySelector('main');\n    if (main && typeof main.scrollTo === 'function') {\n      main.scrollTo({ top: 0, behavior: 'auto' });\n    }\n  }, [activeStep]);\n\n  const mergedUiSchema = merge({}, propUiSchema, currentStep?.uiSchema);\n\n  const [isCreating, setIsCreating] = useState(false);\n\n  const handleCreate = useCallback(async () => {\n    setIsCreating(true);\n    analytics.captureEvent('click', `${createLabel}`);\n    try {\n      await onCreate(stepsState);\n    } finally {\n      setIsCreating(false);\n    }\n  }, [analytics, createLabel, onCreate, stepsState]);\n\n  return (\n    <>\n      {isValidating && <LinearProgress variant=\"indeterminate\" />}\n      <MuiStepper\n        activeStep={activeStep}\n        alternativeLabel\n        variant=\"elevation\"\n        style={{ overflowX: 'auto' }}\n      >\n        {steps.map((step, index) => {\n          const isAllowedLabelClick = activeStep > index;\n          return (\n            <MuiStep key={index}>\n              <MuiStepLabel\n                aria-label={t('stepper.stepIndexLabel', { index: index + 1 })}\n                style={{ cursor: isAllowedLabelClick ? 'pointer' : 'default' }}\n                onClick={() => {\n                  if (isAllowedLabelClick) setActiveStep(index);\n                }}\n              >\n                {step.title}\n              </MuiStepLabel>\n            </MuiStep>\n          );\n        })}\n        <MuiStep>\n          <MuiStepLabel>{reviewLabel}</MuiStepLabel>\n        </MuiStep>\n      </MuiStepper>\n      <div className={styles.formWrapper}>\n        {/* eslint-disable-next-line no-nested-ternary */}\n        {activeStep < steps.length ? (\n          <Form\n            key={activeStep}\n            validator={validator}\n            extraErrors={errors as unknown as ErrorSchema}\n            formData={stepsState}\n            formContext={{ ...propFormContext, formData: stepsState }}\n            schema={currentStep.schema}\n            uiSchema={mergedUiSchema}\n            onSubmit={handleNext}\n            fields={fields}\n            showErrorList=\"top\"\n            templates={{ ErrorListTemplate }}\n            onChange={handleChange}\n            widgets={{ password: PasswordWidget }}\n            experimental_defaultFormStateBehavior={{\n              allOf: 'populateDefaults',\n            }}\n            {...restFormProps}\n          >\n            <div className={styles.footer}>\n              <Button\n                variant=\"tertiary\"\n                onPress={handleBack}\n                className={styles.backButton}\n                isDisabled={activeStep < 1 || isValidating}\n              >\n                {backLabel}\n              </Button>\n              <Button variant=\"primary\" type=\"submit\" isDisabled={isValidating}>\n                {activeStep === steps.length - 1\n                  ? reviewLabel\n                  : t('stepper.nextButtonText')}\n              </Button>\n            </div>\n          </Form>\n        ) : // TODO: potentially move away from this pattern, deprecate?\n        ReviewStepComponent ? (\n          <ReviewStepComponent\n            disableButtons={isValidating}\n            formData={stepsState}\n            handleBack={handleBack}\n            handleReset={() => {}}\n            steps={steps}\n            handleCreate={handleCreate}\n          />\n        ) : (\n          <>\n            <ReviewStateComponent formState={stepsState} schemas={steps} />\n            <div className={styles.footer}>\n              <Button\n                variant=\"tertiary\"\n                onPress={handleBack}\n                className={styles.backButton}\n                isDisabled={activeStep < 1}\n              >\n                {backLabel}\n              </Button>\n              <Button\n                variant=\"primary\"\n                isDisabled={isCreating}\n                onPress={handleCreate}\n              >\n                {createLabel}\n              </Button>\n            </div>\n          </>\n        )}\n      </div>\n    </>\n  );\n};\n"],"names":["FieldOverrides","validation"],"mappings":"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"}

package/dist/next/components/TemplateCard/CardHeader.esm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { makeStyles, useTheme } from '@material-ui/core/styles';
+import { useTheme, makeStyles } from '@material-ui/core/styles';
 import { ItemCardHeader } from '@backstage/core-components';
 import { FavoriteEntity } from '@backstage/plugin-catalog-react';
 import { TemplateDetailButton } from './TemplateDetailButton.esm.js';

package/dist/next/components/TemplateCard/TemplateCard.esm.js

@@ -1,71 +1,9 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { RELATION_OWNED_BY } from '@backstage/catalog-model';
-import { useAnalytics } from '@backstage/core-plugin-api';
-import { getEntityRelations } from '@backstage/plugin-catalog-react';
-import Card from '@material-ui/core/Card';
-import CardActions from '@material-ui/core/CardActions';
-import CardContent from '@material-ui/core/CardContent';
-import Divider from '@material-ui/core/Divider';
-import Grid from '@material-ui/core/Grid';
-import { makeStyles } from '@material-ui/core/styles';
-import { useCallback } from 'react';
-import { CardHeader } from './CardHeader.esm.js';
-import { usePermission } from '@backstage/plugin-permission-react';
-import { taskCreatePermission } from '@backstage/plugin-scaffolder-common/alpha';
-import { TemplateCardContent } from './TemplateCardContent.esm.js';
-import { TemplateCardTags } from './TemplateCardTags.esm.js';
-import { TemplateCardLinks } from './TemplateCardLinks.esm.js';
-import { TemplateCardActions } from './TemplateCardActions.esm.js';
+import { createSwappableComponent } from '@backstage/frontend-plugin-api';
 
-const useStyles = makeStyles(() => ({
-  actionContainer: { padding: "16px", flex: 1, alignItems: "flex-end" }
-}));
-const TemplateCard = (props) => {
-  const { additionalLinks, onSelected, template } = props;
-  const styles = useStyles();
-  const analytics = useAnalytics();
-  const ownedByRelations = getEntityRelations(template, RELATION_OWNED_BY);
-  const hasTags = !!template.metadata.tags?.length;
-  const hasLinks = !!additionalLinks?.length || !!template.metadata.links?.length;
-  const displayDefaultDivider = !hasTags && !hasLinks;
-  const { allowed: canCreateTask } = usePermission({
-    permission: taskCreatePermission
-  });
-  const handleChoose = useCallback(() => {
-    analytics.captureEvent("click", `Template has been opened`);
-    onSelected?.(template);
-  }, [analytics, onSelected, template]);
-  return /* @__PURE__ */ jsxs(Card, { children: [
-    /* @__PURE__ */ jsx(CardHeader, { template, "data-testid": "template-card-header" }),
-    /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, "data-testid": "template-card-content", children: [
-      /* @__PURE__ */ jsx(TemplateCardContent, { template }),
-      displayDefaultDivider && /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(Divider, { "data-testid": "template-card-separator" }) }),
-      hasTags && /* @__PURE__ */ jsx(TemplateCardTags, { template }),
-      hasLinks && /* @__PURE__ */ jsx(
-        TemplateCardLinks,
-        {
-          template,
-          additionalLinks
-        }
-      )
-    ] }) }),
-    /* @__PURE__ */ jsx(
-      CardActions,
-      {
-        className: styles.actionContainer,
-        "data-testid": "template-card-actions",
-        children: /* @__PURE__ */ jsx(
-          TemplateCardActions,
-          {
-            canCreateTask,
-            handleChoose,
-            ownedByRelations
-          }
-        )
-      }
-    )
-  ] });
-};
+const TemplateCard = createSwappableComponent({
+  id: "scaffolder.templateCard",
+  loader: () => import('./TemplateCardImpl.esm.js').then((m) => m.TemplateCardImpl)
+});
 
 export { TemplateCard };
 //# sourceMappingURL=TemplateCard.esm.js.map

package/dist/next/components/TemplateCard/TemplateCard.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TemplateCard.esm.js","sources":["../../../../src/next/components/TemplateCard/TemplateCard.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\n\nimport { RELATION_OWNED_BY } from '@backstage/catalog-model';\nimport { IconComponent, useAnalytics } from '@backstage/core-plugin-api';\nimport { getEntityRelations } from '@backstage/plugin-catalog-react';\nimport { TemplateEntityV1beta3 } from '@backstage/plugin-scaffolder-common';\nimport Card from '@material-ui/core/Card';\nimport CardActions from '@material-ui/core/CardActions';\nimport CardContent from '@material-ui/core/CardContent';\nimport Divider from '@material-ui/core/Divider';\nimport Grid from '@material-ui/core/Grid';\nimport { makeStyles, Theme } from '@material-ui/core/styles';\nimport { useCallback } from 'react';\nimport { CardHeader } from './CardHeader';\nimport { usePermission } from '@backstage/plugin-permission-react';\nimport { taskCreatePermission } from '@backstage/plugin-scaffolder-common/alpha';\nimport { TemplateCardContent } from './TemplateCardContent';\nimport { TemplateCardTags } from './TemplateCardTags';\nimport { TemplateCardLinks } from './TemplateCardLinks';\nimport { TemplateCardActions } from './TemplateCardActions';\n\nconst useStyles = makeStyles<Theme>(() => ({\n  actionContainer: { padding: '16px', flex: 1, alignItems: 'flex-end' },\n}));\n\n/**\n * The Props for the {@link TemplateCard} component\n * @alpha\n */\nexport interface TemplateCardProps {\n  template: TemplateEntityV1beta3;\n  additionalLinks?: {\n    icon: IconComponent;\n    text: string;\n    url: string;\n  }[];\n  onSelected?: (template: TemplateEntityV1beta3) => void;\n}\n\n/**\n * The `TemplateCard` component that is rendered in a list for each template\n * @alpha\n */\nexport const TemplateCard = (props: TemplateCardProps) => {\n  const { additionalLinks, onSelected, template } = props;\n  const styles = useStyles();\n  const analytics = useAnalytics();\n  const ownedByRelations = getEntityRelations(template, RELATION_OWNED_BY);\n  const hasTags = !!template.metadata.tags?.length;\n  const hasLinks =\n    !!additionalLinks?.length || !!template.metadata.links?.length;\n  const displayDefaultDivider = !hasTags && !hasLinks;\n\n  const { allowed: canCreateTask } = usePermission({\n    permission: taskCreatePermission,\n  });\n  const handleChoose = useCallback(() => {\n    analytics.captureEvent('click', `Template has been opened`);\n    onSelected?.(template);\n  }, [analytics, onSelected, template]);\n\n  return (\n    <Card>\n      <CardHeader template={template} data-testid=\"template-card-header\" />\n      <CardContent>\n        <Grid container spacing={2} data-testid=\"template-card-content\">\n          <TemplateCardContent template={template} />\n          {displayDefaultDivider && (\n            <Grid item xs={12}>\n              <Divider data-testid=\"template-card-separator\" />\n            </Grid>\n          )}\n          {hasTags && <TemplateCardTags template={template} />}\n          {hasLinks && (\n            <TemplateCardLinks\n              template={template}\n              additionalLinks={additionalLinks}\n            />\n          )}\n        </Grid>\n      </CardContent>\n      <CardActions\n        className={styles.actionContainer}\n        data-testid=\"template-card-actions\"\n      >\n        <TemplateCardActions\n          canCreateTask={canCreateTask}\n          handleChoose={handleChoose}\n          ownedByRelations={ownedByRelations}\n        />\n      </CardActions>\n    </Card>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAmCA,MAAM,SAAA,GAAY,WAAkB,OAAO;AAAA,EACzC,iBAAiB,EAAE,OAAA,EAAS,QAAQ,IAAA,EAAM,CAAA,EAAG,YAAY,UAAA;AAC3D,CAAA,CAAE,CAAA;AAoBK,MAAM,YAAA,GAAe,CAAC,KAAA,KAA6B;AACxD,EAAA,MAAM,EAAE,eAAA,EAAiB,UAAA,EAAY,QAAA,EAAS,GAAI,KAAA;AAClD,EAAA,MAAM,SAAS,SAAA,EAAU;AACzB,EAAA,MAAM,YAAY,YAAA,EAAa;AAC/B,EAAA,MAAM,gBAAA,GAAmB,kBAAA,CAAmB,QAAA,EAAU,iBAAiB,CAAA;AACvE,EAAA,MAAM,OAAA,GAAU,CAAC,CAAC,QAAA,CAAS,SAAS,IAAA,EAAM,MAAA;AAC1C,EAAA,MAAM,QAAA,GACJ,CAAC,CAAC,eAAA,EAAiB,UAAU,CAAC,CAAC,QAAA,CAAS,QAAA,CAAS,KAAA,EAAO,MAAA;AAC1D,EAAA,MAAM,qBAAA,GAAwB,CAAC,OAAA,IAAW,CAAC,QAAA;AAE3C,EAAA,MAAM,EAAE,OAAA,EAAS,aAAA,EAAc,GAAI,aAAA,CAAc;AAAA,IAC/C,UAAA,EAAY;AAAA,GACb,CAAA;AACD,EAAA,MAAM,YAAA,GAAe,YAAY,MAAM;AACrC,IAAA,SAAA,CAAU,YAAA,CAAa,SAAS,CAAA,wBAAA,CAA0B,CAAA;AAC1D,IAAA,UAAA,GAAa,QAAQ,CAAA;AAAA,EACvB,CAAA,EAAG,CAAC,SAAA,EAAW,UAAA,EAAY,QAAQ,CAAC,CAAA;AAEpC,EAAA,4BACG,IAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,QAAA,EAAoB,aAAA,EAAY,sBAAA,EAAuB,CAAA;AAAA,oBACnE,GAAA,CAAC,eACC,QAAA,kBAAA,IAAA,CAAC,IAAA,EAAA,EAAK,WAAS,IAAA,EAAC,OAAA,EAAS,CAAA,EAAG,aAAA,EAAY,uBAAA,EACtC,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,uBAAoB,QAAA,EAAoB,CAAA;AAAA,MACxC,qBAAA,oBACC,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAI,IAAA,EAAC,EAAA,EAAI,EAAA,EACb,QAAA,kBAAA,GAAA,CAAC,OAAA,EAAA,EAAQ,aAAA,EAAY,yBAAA,EAA0B,CAAA,EACjD,CAAA;AAAA,MAED,OAAA,oBAAW,GAAA,CAAC,gBAAA,EAAA,EAAiB,QAAA,EAAoB,CAAA;AAAA,MACjD,QAAA,oBACC,GAAA;AAAA,QAAC,iBAAA;AAAA,QAAA;AAAA,UACC,QAAA;AAAA,UACA;AAAA;AAAA;AACF,KAAA,EAEJ,CAAA,EACF,CAAA;AAAA,oBACA,GAAA;AAAA,MAAC,WAAA;AAAA,MAAA;AAAA,QACC,WAAW,MAAA,CAAO,eAAA;AAAA,QAClB,aAAA,EAAY,uBAAA;AAAA,QAEZ,QAAA,kBAAA,GAAA;AAAA,UAAC,mBAAA;AAAA,UAAA;AAAA,YACC,aAAA;AAAA,YACA,YAAA;AAAA,YACA;AAAA;AAAA;AACF;AAAA;AACF,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"TemplateCard.esm.js","sources":["../../../../src/next/components/TemplateCard/TemplateCard.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\n\nimport { createSwappableComponent } from '@backstage/frontend-plugin-api';\nimport type { TemplateCardComponentProps } from './TemplateCardImpl';\n\nexport type {\n  TemplateCardProps,\n  TemplateCardComponentProps,\n} from './TemplateCardImpl';\n\n/**\n * The `TemplateCard` component that is rendered in a list for each template.\n * Apps using the new frontend system can replace it by registering a\n * `SwappableComponentBlueprint` that targets `TemplateCard`.\n *\n * @alpha\n */\nexport const TemplateCard =\n  createSwappableComponent<TemplateCardComponentProps>({\n    id: 'scaffolder.templateCard',\n    loader: () => import('./TemplateCardImpl').then(m => m.TemplateCardImpl),\n  });\n"],"names":[],"mappings":";;AA+BO,MAAM,eACX,wBAAA,CAAqD;AAAA,EACnD,EAAA,EAAI,yBAAA;AAAA,EACJ,MAAA,EAAQ,MAAM,OAAO,2BAAoB,EAAE,IAAA,CAAK,CAAA,CAAA,KAAK,EAAE,gBAAgB;AACzE,CAAC;;;;"}