import { defineComponent as u, mergeModels as i, useModel as d, watch as c, createBlock as f, openBlock as x, withCtx as s, createVNode as V, createTextVNode as n, toDisplayString as b } from "vue";
import v from "../../components/ScreenReader.vue.js";
import E from "./TextSelect.vue.js";
/* empty css                */
const y = /* @__PURE__ */ u({
  __name: "ExamplePicker",
  props: /* @__PURE__ */ i({
    examples: {}
  }, {
    modelValue: {},
    modelModifiers: {}
  }),
  emits: ["update:modelValue"],
  setup(m) {
    const a = m, t = d(m, "modelValue");
    function p(e) {
      e && (t.value = e);
    }
    c(
      () => a.examples,
      () => {
        a.examples[t.value ?? ""] || p(Object.keys(a.examples)[0]);
      },
      { immediate: !0 }
    );
    function r(e) {
      if (!e)
        return "Select an example";
      const l = a.examples[e];
      return (l == null ? void 0 : l.summary) ?? e;
    }
    return (e, l) => (x(), f(E, {
      modelValue: t.value,
      "onUpdate:modelValue": l[0] || (l[0] = (o) => t.value = o),
      class: "example-selector",
      options: Object.keys(e.examples).map((o) => ({
        label: r(o),
        value: o
      }))
    }, {
      default: s(() => [
        V(v, null, {
          default: s(() => l[1] || (l[1] = [
            n("Selected Example Values:")
          ])),
          _: 1
        }),
        n(" " + b(r(t.value ?? "Unknown")), 1)
      ]),
      _: 1
    }, 8, ["modelValue", "options"]));
  }
});
export {
  y as default
};
