Restrict icon-libraries at Nuxt Studio config level

[TotomInc]

Is your feature request related to a problem? Please describe

Content-editors have too much choices when picking an icon. We want to restrict a specific icon-set because our design-system is only using Material Symbols icons.

Describe the solution you'd like

Introduce a configuration option at the nuxt.config.ts level inside studio object, where we can restrict all inputs that uses the "Icon picker", to the specified icon libraries.

Describe alternatives you've considered

None.

Additional context

It's currently possible to restrict icon-lib on a per-schema basis, using iconLibrairies property from .editor(): https://nuxt.studio/content#iconlibraries-arraystring

However, I am unsure if this will work with Vue components. With the example below, we have a Cta.vue component that can be inserted into building-blocks (using slots) of content-editor components:

<script lang="ts">
import type { ButtonProps } from "@nuxt/ui";

export interface CtaProps {
  label?: ButtonProps["label"];
  color?: ButtonProps["color"];
  variant?: ButtonProps["variant"];
  link?: string;
  size?: ButtonProps["size"];
  disabled?: boolean;
  leftIcon?: ButtonProps["icon"];
  rightIcon?: ButtonProps["trailingIcon"];
  fontWeight?: "normal" | "medium" | "semibold" | "bold";
}
</script>

<script setup lang="ts">
const props = withDefaults(defineProps<CtaProps>(), {
  color: "primary",
  variant: "solid",
  size: "md",
  disabled: false,
  fontWeight: "normal",
});

const fontWeightClass = computed(() => {
  switch (props.fontWeight) {
    case "normal":
      return "font-normal";
    case "medium":
      return "font-medium";
    case "semibold":
      return "font-semibold";
    case "bold":
      return "font-bold";
    default:
      return "font-normal";
  }
});

const linkTarget = computed(() => (props.link?.startsWith("http") ? "_blank" : null));
const rel = computed(() => (linkTarget.value === "_blank" ? "noopener noreferrer" : null));
</script>

<template>
  <UButton
    :label="label"
    :color="color"
    :variant="variant"
    :to="link"
    :target="linkTarget"
    :rel="rel"
    :size="size"
    :disabled="disabled"
    :icon="leftIcon"
    :trailingIcon="rightIcon"
    :ui="{ label: fontWeightClass }"
  />
</template>

I don't think Nuxt Studio currently exposes a way to define an icon-library at the "component" level.

[TotomInc]

@larbish before I can start working on a PR, do you have an implementation guidance for this issue?