first commit

app/components/config/ConfigChoiceGrid.vue

@@ -0,0 +1,140 @@
+<script>
+import "~/assets/styles/OsIcon.CAi4Iz2S.css";
+import { toDisplayString } from "vue";
+import { renderList } from "vue";
+import { normalizeClass } from "vue";
+import { createBlock } from "vue";
+import { createCommentVNode } from "vue";
+import { createElementBlock } from "vue";
+import { Fragment } from "vue";
+import { createElementVNode } from "vue";
+import { defineComponent } from "vue";
+import { openBlock } from "vue";
+import OsIcon from "~/components/OsIcon.vue";
+var d = [`aria-label`],
+  f = [`aria-pressed`, `disabled`, `onClick`],
+  p = {
+    key: 1,
+  },
+  m = Object.assign(
+    defineComponent({
+      __name: `ConfigChoiceGrid`,
+      props: {
+        modelValue: {},
+        options: {},
+        disabled: {
+          type: Boolean,
+        },
+        compact: {
+          type: Boolean,
+        },
+        images: {
+          type: Boolean,
+        },
+        label: {},
+      },
+      emits: [`update:modelValue`, `change`],
+      setup(c, { emit: m }) {
+        let h = c,
+          g = m;
+        function _(e) {
+          h.disabled ||
+            h.modelValue === e ||
+            (g(`update:modelValue`, e), g(`change`));
+        }
+        return (m, h) => {
+          let g = OsIcon;
+          return (
+            openBlock(),
+            createElementBlock(
+              `div`,
+              {
+                class: normalizeClass([
+                  `config-choices`,
+                  {
+                    compact: c.compact && !c.images,
+                    "image-groups": c.images,
+                  },
+                ]),
+                role: `group`,
+                "aria-label": c.label,
+              },
+              [
+                (openBlock(!0),
+                createElementBlock(
+                  Fragment,
+                  null,
+                  renderList(
+                    c.options,
+                    (t) => (
+                      openBlock(),
+                      createElementBlock(
+                        `button`,
+                        {
+                          key: t.value,
+                          type: `button`,
+                          class: normalizeClass([
+                            c.images ? `image-group` : `config-choice`,
+                            {
+                              active: c.modelValue === t.value,
+                            },
+                          ]),
+                          "aria-pressed": c.modelValue === t.value,
+                          disabled: c.disabled,
+                          onClick: (e) => _(t.value),
+                        },
+                        [
+                          c.images
+                            ? (openBlock(),
+                              createBlock(
+                                g,
+                                {
+                                  key: 0,
+                                  name: t.label,
+                                  url: t.iconUrl,
+                                  icon: t.icon,
+                                  size: 36,
+                                },
+                                null,
+                                8,
+                                [`name`, `url`, `icon`],
+                              ))
+                            : createCommentVNode(``, !0),
+                          createElementVNode(
+                            `span`,
+                            null,
+                            toDisplayString(t.label),
+                            1,
+                          ),
+                          t.description
+                            ? (openBlock(),
+                              createElementBlock(
+                                `small`,
+                                p,
+                                toDisplayString(t.description),
+                                1,
+                              ))
+                            : createCommentVNode(``, !0),
+                        ],
+                        10,
+                        f,
+                      )
+                    ),
+                  ),
+                  128,
+                )),
+              ],
+              10,
+              d,
+            )
+          );
+        };
+      },
+    }),
+    {
+      __name: `ConfigChoiceGrid`,
+    },
+  );
+export {};
+export default m;
+</script>