UI Kit (forge/react) MacroConfig => No Checkbox/Tooltip/Radio Button?!

Hi,

I was just about to migrate my UI Kit 1 MacroConfig to UI Kit, but two problems:

(1) No Checkbox, Toggle or Radio Button is supported in MacroConfig

(2) Textarea isMonospaced=true is not monospaced

That is useful for code block macros and was not working in UI Kit 1 and now also not in UI Kit (forge react).

The only ugly workaround for a checkbox is a select box with yes/no options.

Are there plans to get the other form components working in MacroConfig? This is very limiting!
I would really love to have a monospaced textarea in the macroconfig!

thanks

(3) UPDATE: No Text component either … How to tell people what the form elements are for :smiley: ?

      <Label labelFor="select">
        Field label
        <RequiredAsterisk />
      </Label>
      <Select
        name="theme"
        appearance="default"
        options={[
          { label: 'light', value: 'light' },
          { label: 'dark', value: 'dark' },
        ]}
      />
      <HelperMessage>Helper message</HelperMessage>
  • :green_circle: Label works
  • :red_circle: HelperMessage does not work

Hi @clouless,

You’re right, UI Kit (previously UI Kit 2) macros work a little differently to UI Kit 1.

Currently the following components are supported for UI Kit 2 Macro Configuration, however properties of these components may be limited (Full details of the supported components and properties are outlined on the macro documentation page):

  • Checkbox group (Preview)
  • Date picker
  • Label
  • Radio group
  • Select
  • Textfield
  • Text area
  • User picker

Does Radio Group or Checkbox Group meet your needs regarding yes / no options?

As for your other feedback, I have passed it on to the Forge UI team.

Cheers!

Hi Melissa,
Thanks for pointing me to that doc page, the CheckBox Group seems to work.
When is it going to be out of Preview state? I will rely in my production App on it once migrated to UI Kit 1 (forge/react 10+).

I have found one other bug in the :red_circle: select form component the defaultValue does not work. Nothing is preselected when opening the MacroConfig on a freshly inserted macro.

      <Label labelFor="theme">Theme</Label>
      <Select
        name="theme"
        appearance="default"
        defaultValue={{   // !!!!! DOES NOT WORK !!!!!!
           label: 'light-spring', value: 'light-spring' }}.
        options={[
          { label: 'light-spring', value: 'light-spring' },
          { label: 'dark-spring', value: 'dark-spring' },
          { label: 'light-mono', value: 'light-mono' },
          { label: 'dark-mono', value: 'dark-mono' },
        ]}
      />

I will report back if the macro config from UI Kit 1 with checkbox picks up the boolean value in the UI Kit 2 CheckBoxGroup once I deployed to staging.

btw I opened ECOHELP-50788 with my findings too.

Thanks a lot,

Cheers,

Bernhard

UPDATE: ECO-540 now describes these blockers