@scalar/blocks 0.4.3 → 0.5.0

package/dist/schema/SchemaComposition.vue.script.js

@@ -0,0 +1,231 @@
+import { REQUEST_BODY_COMPOSITION_INDEX_SYMBOL as e } from "./request-body-composition-index.js";
+import { partitionAllOfCompositions as t } from "./helpers/partition-all-of-compositions.js";
+import { getCycleKey as n } from "./helpers/schema-cycle.js";
+import { useLocalization as r } from "./localization/index.js";
+import { getDiscriminatorValues as i } from "./helpers/get-discriminator-values.js";
+import { getSchemaType as a } from "./helpers/get-schema-type.js";
+import { getModelNameWithArray as o } from "./helpers/schema-name.js";
+import s from "./SchemaGlyphPuck.vue.js";
+import c from "./SchemaRailPanel.vue.js";
+import l from "./Schema.vue.js";
+import { Fragment as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as g, createVNode as _, defineComponent as v, inject as y, normalizeClass as b, openBlock as x, ref as S, renderList as C, resolveComponent as w, toDisplayString as T, unref as E, watch as D, withCtx as O } from "vue";
+import { ScalarIconCaretUpDown as k } from "@scalar/icons";
+import { ScalarListbox as A } from "@scalar/components/listbox";
+import { resolve as j } from "@scalar/workspace-store/resolve";
+import { isDefined as M } from "@scalar/helpers/array/is-defined";
+//#region src/schema/SchemaComposition.vue?vue&type=script&setup=true&lang.ts
+var N = { class: "property-rule [.children+&]:mt-1.5!" }, P = {
+	class: "composition-selector composition-selector--tree group/tree-control font-code relative flex w-fit max-w-full cursor-pointer items-start gap-1.5 py-1 text-sm",
+	type: "button"
+}, F = { class: "text-c-1 shrink-0 [font-weight:var(--scalar-bold)] whitespace-nowrap" }, I = ["title"], L = {
+	key: 0,
+	class: "text-red"
+}, R = /*@__PURE__*/ v({
+	__name: "SchemaComposition",
+	props: {
+		composition: {},
+		discriminator: {},
+		name: {},
+		schema: {},
+		level: {},
+		depth: { default: 0 },
+		compact: {
+			type: Boolean,
+			default: !1
+		},
+		hideHeading: {
+			type: Boolean,
+			default: !1
+		},
+		hideModelNames: { type: Boolean },
+		breadcrumb: {},
+		eventBus: {},
+		options: {},
+		schemaContext: {},
+		compositionPath: {},
+		scrollTargetId: {},
+		specificationExtension: {},
+		expansion: {}
+	},
+	setup(v) {
+		let R = v, { translate: z } = r(), B = d(() => R.composition === "allOf" ? t(R.schema).segments : []), V = d(() => [R.schema[R.composition]].flat().map((e) => ({
+			value: j.schema(e),
+			original: e
+		})).filter((e) => M(e.value))), H = d(() => V.value.map((e, t) => {
+			let n = j.schema(e.original), r = (o(n)?.label ?? a(n)) || z("schema.schema"), s = (R.schema.discriminator ?? R.discriminator)?.mapping, c = i(n.$ref, s);
+			return {
+				id: String(t),
+				label: c.length ? `${c.join(", ")} · ${r}` : r
+			};
+		})), U = d(() => R.compositionPath?.length ? [...R.compositionPath, R.composition].join(".") : ""), W = y(e, void 0), G = d(() => {
+			if (R.schemaContext !== "requestBody" || !W?.value || !U.value) return 0;
+			let e = W.value[U.value];
+			return typeof e != "number" || Number.isNaN(e) ? 0 : Math.max(0, Math.min(e, H.value.length - 1));
+		}), K = S();
+		D([H, G], ([e, t]) => {
+			(!K.value || !e.some((e) => e.id === K.value?.id)) && (K.value = e[t] ?? e[0]);
+		}, { immediate: !0 });
+		let q = (e) => z(`schema.${e}`), J = d(() => V.value[Number(K.value?.id ?? "0")]?.value), Y = d(() => R.schemaContext === "requestBody" && R.compositionPath?.length === 1), X = d(() => n(V.value[Number(K.value?.id ?? "0")]?.original)), Z = S(!!R.options.expandAllSchemaProperties);
+		return W && R.schemaContext === "requestBody" && U.value && D(K, (e) => {
+			let t = e ? Number(e.id) : 0;
+			Number.isNaN(t) || (W.value = {
+				...W.value,
+				[U.value]: t
+			});
+		}, { immediate: !0 }), (e, t) => {
+			let n = w("SchemaComposition", !0);
+			return x(), m("div", N, [R.composition === "allOf" ? (x(!0), m(u, { key: 0 }, C(B.value, (e, t) => (x(), m(u, { key: t }, [e.kind === "object" ? (x(), f(l, {
+				key: 0,
+				breadcrumb: v.breadcrumb,
+				compact: v.compact,
+				compositionPath: v.compositionPath,
+				depth: v.depth,
+				discriminator: v.discriminator,
+				eventBus: v.eventBus,
+				expansion: v.expansion,
+				hideDescription: Y.value,
+				hideHeading: v.hideHeading,
+				hideModelNames: v.hideModelNames,
+				level: v.level + 1,
+				name: v.name,
+				noncollapsible: !0,
+				options: v.options,
+				schema: e.schema,
+				schemaContext: v.schemaContext,
+				scrollTargetId: v.scrollTargetId,
+				specificationExtension: v.specificationExtension
+			}, null, 8, [
+				"breadcrumb",
+				"compact",
+				"compositionPath",
+				"depth",
+				"discriminator",
+				"eventBus",
+				"expansion",
+				"hideDescription",
+				"hideHeading",
+				"hideModelNames",
+				"level",
+				"name",
+				"options",
+				"schema",
+				"schemaContext",
+				"scrollTargetId",
+				"specificationExtension"
+			])) : (x(), f(n, {
+				key: 1,
+				breadcrumb: v.breadcrumb,
+				compact: v.compact,
+				composition: e.composition,
+				compositionPath: [...v.compositionPath ?? [], String(e.choiceIndex)],
+				depth: v.depth,
+				eventBus: v.eventBus,
+				expansion: v.expansion,
+				hideHeading: v.hideHeading,
+				hideModelNames: v.hideModelNames,
+				level: v.level,
+				options: v.options,
+				schema: e.value,
+				schemaContext: v.schemaContext,
+				scrollTargetId: v.scrollTargetId,
+				specificationExtension: v.specificationExtension
+			}, null, 8, [
+				"breadcrumb",
+				"compact",
+				"composition",
+				"compositionPath",
+				"depth",
+				"eventBus",
+				"expansion",
+				"hideHeading",
+				"hideModelNames",
+				"level",
+				"options",
+				"schema",
+				"schemaContext",
+				"scrollTargetId",
+				"specificationExtension"
+			]))], 64))), 128)) : (x(), f(c, {
+				key: 1,
+				class: "composition-panel composition-panel--tree mt-1 mb-0.5",
+				depth: v.depth + 1
+			}, {
+				default: O(() => [_(E(A), {
+					modelValue: K.value,
+					"onUpdate:modelValue": t[0] ||= (e) => K.value = e,
+					class: "w-fit max-w-full min-w-40",
+					options: H.value
+				}, {
+					default: O(() => [h("button", P, [
+						_(s, {
+							anchor: "line",
+							class: "composition-selector-icon mt-1"
+						}, {
+							default: O(() => [_(E(k))]),
+							_: 1
+						}),
+						h("span", F, T(q(R.composition)), 1),
+						t[2] ||= h("span", {
+							"aria-hidden": "true",
+							class: "text-c-3 shrink-0"
+						}, "·", -1),
+						h("span", {
+							class: b(["composition-selector-label text-c-1 min-w-0 truncate [font-weight:var(--scalar-bold)]", { "line-through": J.value?.deprecated }]),
+							title: K.value?.label || E(z)("schema.schema")
+						}, T(K.value?.label || E(z)("schema.schema")), 11, I),
+						J.value?.deprecated ? (x(), m("div", L, T(E(z)("schema.deprecated")), 1)) : p("", !0)
+					])]),
+					_: 1
+				}, 8, ["modelValue", "options"]), !Z.value && v.level > 2 ? (x(), m("button", {
+					key: 0,
+					class: "composition-details-toggle group/tree-control font-code text-c-1 relative flex w-fit cursor-pointer items-center py-1.5 text-sm font-normal",
+					type: "button",
+					onClick: t[1] ||= (e) => Z.value = !0
+				}, [_(s), g(" " + T(E(z)("schema.showSchemaDetails")), 1)])) : (x(), f(l, {
+					key: K.value?.id ?? "0",
+					breadcrumb: v.breadcrumb,
+					compact: v.compact,
+					compositionPath: v.compositionPath,
+					cycleKey: X.value,
+					depth: v.depth + 1,
+					discriminator: v.discriminator,
+					eventBus: v.eventBus,
+					expansion: v.expansion,
+					hideHeading: v.hideHeading,
+					hideModelNames: v.hideModelNames,
+					level: v.level + 1,
+					name: v.name,
+					noncollapsible: !0,
+					options: v.options,
+					schema: J.value,
+					schemaContext: v.schemaContext,
+					scrollTargetId: v.scrollTargetId,
+					specificationExtension: v.specificationExtension
+				}, null, 8, [
+					"breadcrumb",
+					"compact",
+					"compositionPath",
+					"cycleKey",
+					"depth",
+					"discriminator",
+					"eventBus",
+					"expansion",
+					"hideHeading",
+					"hideModelNames",
+					"level",
+					"name",
+					"options",
+					"schema",
+					"schemaContext",
+					"scrollTargetId",
+					"specificationExtension"
+				]))]),
+				_: 1
+			}, 8, ["depth"]))]);
+		};
+	}
+});
+//#endregion
+export { R as default };
+
+//# sourceMappingURL=SchemaComposition.vue.script.js.map

package/dist/schema/SchemaComposition.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaComposition.vue.script.js","names":[],"sources":["../../src/schema/SchemaComposition.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n  ScalarListbox,\n  type ScalarListboxOption,\n} from '@scalar/components/listbox'\nimport { isDefined } from '@scalar/helpers/array/is-defined'\nimport { ScalarIconCaretUpDown } from '@scalar/icons'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type {\n  DiscriminatorObject,\n  SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport { computed, inject, ref, watch } from 'vue'\n\nimport { getDiscriminatorValues } from './helpers/get-discriminator-values'\nimport { getSchemaType } from './helpers/get-schema-type'\nimport { partitionAllOfCompositions } from './helpers/partition-all-of-compositions'\nimport { type CompositionKeyword } from './helpers/schema-composition'\nimport { getCycleKey } from './helpers/schema-cycle'\nimport { getModelNameWithArray } from './helpers/schema-name'\nimport { useLocalization } from './localization'\nimport {\n  REQUEST_BODY_COMPOSITION_INDEX_SYMBOL,\n  type RequestBodyCompositionSelection,\n} from './request-body-composition-index'\nimport Schema from './Schema.vue'\nimport SchemaGlyphPuck from './SchemaGlyphPuck.vue'\nimport SchemaRailPanel from './SchemaRailPanel.vue'\nimport type { SchemaOptions, SchemaRenderingProps } from './types'\n\nconst props = withDefaults(\n  defineProps<\n    {\n      /** The composition keyword (oneOf, anyOf, allOf) */\n      composition: CompositionKeyword\n      /** Optional discriminator object for polymorphic schemas */\n      discriminator?: DiscriminatorObject\n      /** Optional name for the schema */\n      name?: string\n      /** The schema value containing the composition */\n      schema: SchemaObject\n      /** Nesting level for proper indentation */\n      level: number\n      /** Real nesting depth (see SchemaProperty) */\n      depth?: number\n      /** Whether to use compact layout */\n      compact?: boolean\n      /** Whether to hide the heading */\n      hideHeading?: boolean\n      /** Hide model names in type display */\n      hideModelNames?: boolean\n      /** Breadcrumb for navigation */\n      breadcrumb?: string[]\n      /** Event bus emitting actions */\n      eventBus: WorkspaceEventBus | null\n      /** Move the options into  single prop so they are easy to pass around */\n      options: SchemaOptions\n      /** When \"requestBody\", sync selected index with the example snippet */\n      schemaContext?: string\n      /** Internal path used to sync nested request body compositions with the code sample */\n      compositionPath?: string[]\n    } & SchemaRenderingProps\n  >(),\n  {\n    depth: 0,\n    compact: false,\n    hideHeading: false,\n  },\n)\nconst { translate } = useLocalization()\n\n/**\n * Split an `allOf` into an ordered list of segments (object chunks + choice\n * pickers) so multiple mutually-exclusive selections each render their own\n * picker, in the position they were declared, instead of all but the first\n * being dropped and the rest bubbling to the end.\n */\nconst allOfSegments = computed(() =>\n  props.composition === 'allOf'\n    ? partitionAllOfCompositions(props.schema).segments\n    : [],\n)\n\n/** The current composition */\nconst composition = computed(() =>\n  [props.schema[props.composition]]\n    .flat()\n    .map((schema) => ({ value: resolve.schema(schema), original: schema }))\n    .filter((it) => isDefined(it.value)),\n)\n\n/**\n * Generate listbox options for the composition selector.\n * Each option represents a schema in the composition with a human-readable label.\n * Prefers schema title/name (including array item models, e.g. `Model[]`) over\n * structural type when present.\n */\nconst listboxOptions = computed((): ScalarListboxOption[] =>\n  composition.value.map((schema, index: number) => {\n    const resolved = resolve.schema(schema.original!)\n    const label =\n      (getModelNameWithArray(resolved)?.label ?? getSchemaType(resolved)) ||\n      translate('schema.schema')\n    const mapping = (props.schema.discriminator ?? props.discriminator)?.mapping\n    const values = getDiscriminatorValues(resolved.$ref, mapping)\n    return {\n      id: String(index),\n      label: values.length ? `${values.join(', ')} · ${label}` : label,\n    }\n  }),\n)\n\nconst compositionSelectionKey = computed(() =>\n  props.compositionPath?.length\n    ? [...props.compositionPath, props.composition].join('.')\n    : '',\n)\n\n/** When this composition is in the request body, sync selection with the example snippet */\nconst requestBodyCompositionSelectionRef = inject(\n  REQUEST_BODY_COMPOSITION_INDEX_SYMBOL,\n  undefined,\n)\n\nconst initialSelectedIndex = computed(() => {\n  if (\n    props.schemaContext !== 'requestBody' ||\n    !requestBodyCompositionSelectionRef?.value ||\n    !compositionSelectionKey.value\n  ) {\n    return 0\n  }\n\n  const selectedIndex =\n    requestBodyCompositionSelectionRef.value[compositionSelectionKey.value]\n\n  if (typeof selectedIndex !== 'number' || Number.isNaN(selectedIndex)) {\n    return 0\n  }\n\n  return Math.max(0, Math.min(selectedIndex, listboxOptions.value.length - 1))\n})\n\n/**\n * Two-way computed property for the selected option.\n * Handles conversion between the selected index and the listbox option format.\n */\nconst selectedOption = ref<ScalarListboxOption | undefined>()\n\nwatch(\n  [listboxOptions, initialSelectedIndex],\n  ([options, selectedIndex]) => {\n    if (\n      !selectedOption.value ||\n      !options.some((option) => option.id === selectedOption.value?.id)\n    ) {\n      selectedOption.value = options[selectedIndex] ?? options[0]\n    }\n  },\n  { immediate: true },\n)\n\nconst compositionLabel = (type: CompositionKeyword): string =>\n  translate(`schema.${type}`)\n\n/** Inside the currently selected composition */\nconst selectedComposition = computed(\n  () => composition.value[Number(selectedOption.value?.id ?? '0')]?.value,\n)\n\n/**\n * The request body card renders the merged `allOf` description on its outer card\n * (see `Schema.vue`), but only for the top-level request body schema. For that\n * single composition we hide the nested merged `Schema`'s description so the text\n * is not shown twice. Nested request-body compositions (deeper properties) are\n * not shown on the outer card and would otherwise lose their description\n * entirely, because the property row already skips it when `allOf` is present.\n *\n * The top-level request body composition is the one whose `compositionPath` is\n * still the request body root (`['requestBody']`); nested compositions append\n * property segments and therefore have a longer path.\n */\nconst isRequestBodyRootComposition = computed(\n  () =>\n    props.schemaContext === 'requestBody' &&\n    props.compositionPath?.length === 1,\n)\n\n/**\n * Cycle key for the selected composition member, derived from its raw\n * (unresolved) value so a member that references an ancestor is detected as a\n * cycle.\n */\nconst selectedCompositionCycleKey = computed(() =>\n  getCycleKey(\n    composition.value[Number(selectedOption.value?.id ?? '0')]?.original,\n  ),\n)\n\n/**\n * Controls whether the nested schema is displayed. When expanding all schema\n * properties we open it by default; the nested Schema handles cycle detection,\n * so finite compositions render fully while recursive ones still stop.\n */\nconst showNestedSchema = ref(!!props.options.expandAllSchemaProperties)\n\nif (\n  requestBodyCompositionSelectionRef &&\n  props.schemaContext === 'requestBody' &&\n  compositionSelectionKey.value\n) {\n  watch(\n    selectedOption,\n    (option) => {\n      const index = option ? Number(option.id) : 0\n      if (!Number.isNaN(index)) {\n        requestBodyCompositionSelectionRef.value = {\n          ...requestBodyCompositionSelectionRef.value,\n          [compositionSelectionKey.value]: index,\n        } satisfies RequestBodyCompositionSelection\n      }\n    },\n    { immediate: true },\n  )\n}\n</script>\n\n<template>\n  <!-- 6px after a container's children keeps the 12px row rhythm -->\n  <div class=\"property-rule [.children+&]:mt-1.5!\">\n    <!--\n      allOf: render the members in source order — object chunks as fields, each\n      oneOf/anyOf group as its own picker in place. Keeps every mutually-exclusive\n      selection (mergeAllOfSchemas alone drops all but the first) and preserves the\n      position of each choice group among the surrounding fields, flowing inline\n      with them as one continuous list (no extra spacing or card).\n    -->\n    <template v-if=\"props.composition === 'allOf'\">\n      <template\n        v-for=\"(segment, segmentIndex) in allOfSegments\"\n        :key=\"segmentIndex\">\n        <Schema\n          v-if=\"segment.kind === 'object'\"\n          :breadcrumb=\"breadcrumb\"\n          :compact=\"compact\"\n          :compositionPath=\"compositionPath\"\n          :depth=\"depth\"\n          :discriminator=\"discriminator\"\n          :eventBus=\"eventBus\"\n          :expansion=\"expansion\"\n          :hideDescription=\"isRequestBodyRootComposition\"\n          :hideHeading=\"hideHeading\"\n          :hideModelNames\n          :level=\"level + 1\"\n          :name=\"name\"\n          :noncollapsible=\"true\"\n          :options=\"options\"\n          :schema=\"segment.schema\"\n          :schemaContext=\"schemaContext\"\n          :scrollTargetId=\"scrollTargetId\"\n          :specificationExtension=\"specificationExtension\" />\n        <SchemaComposition\n          v-else\n          :breadcrumb=\"breadcrumb\"\n          :compact=\"compact\"\n          :composition=\"segment.composition\"\n          :compositionPath=\"[\n            ...(compositionPath ?? []),\n            String(segment.choiceIndex),\n          ]\"\n          :depth=\"depth\"\n          :eventBus=\"eventBus\"\n          :expansion=\"expansion\"\n          :hideHeading=\"hideHeading\"\n          :hideModelNames\n          :level=\"level\"\n          :options=\"options\"\n          :schema=\"segment.value\"\n          :schemaContext=\"schemaContext\"\n          :scrollTargetId=\"scrollTargetId\"\n          :specificationExtension=\"specificationExtension\" />\n      </template>\n    </template>\n\n    <!-- The picker sits on the rail behind a circled icon, like the toggle\n         pucks; the chosen variant hangs below in the same panel -->\n    <SchemaRailPanel\n      v-else\n      class=\"composition-panel composition-panel--tree mt-1 mb-0.5\"\n      :depth=\"depth + 1\">\n      <!-- No `resize`: it would pin the popup to this compact trigger's width.\n           The listbox slot must hold exactly ONE node: Headless UI renders its\n           button as a fragment and passes props through to the slot root, so\n           even an HTML comment in here breaks the picker. The puck is the\n           picker's whole affordance: an up/down caret on the rail, like the\n           plus on a row, so no trailing caret. -->\n      <ScalarListbox\n        v-model=\"selectedOption\"\n        class=\"w-fit max-w-full min-w-40\"\n        :options=\"listboxOptions\">\n        <button\n          class=\"composition-selector composition-selector--tree group/tree-control font-code relative flex w-fit max-w-full cursor-pointer items-start gap-1.5 py-1 text-sm\"\n          type=\"button\">\n          <SchemaGlyphPuck\n            anchor=\"line\"\n            class=\"composition-selector-icon mt-1\">\n            <!-- No size of its own: the puck sizes the icons it holds, so this\n                 one shrinks with the others in a narrow container -->\n            <ScalarIconCaretUpDown />\n          </SchemaGlyphPuck>\n          <!-- Keyword and choice read as one bold name, split by the same `·`\n               the tree uses between details -->\n          <span\n            class=\"text-c-1 shrink-0 [font-weight:var(--scalar-bold)] whitespace-nowrap\"\n            >{{ compositionLabel(props.composition) }}</span\n          >\n          <span\n            aria-hidden=\"true\"\n            class=\"text-c-3 shrink-0\"\n            >·</span\n          >\n          <span\n            class=\"composition-selector-label text-c-1 min-w-0 truncate [font-weight:var(--scalar-bold)]\"\n            :class=\"{\n              'line-through': selectedComposition?.deprecated,\n            }\"\n            :title=\"selectedOption?.label || translate('schema.schema')\">\n            {{ selectedOption?.label || translate('schema.schema') }}\n          </span>\n          <div\n            v-if=\"selectedComposition?.deprecated\"\n            class=\"text-red\">\n            {{ translate('schema.deprecated') }}\n          </div>\n        </button>\n      </ScalarListbox>\n\n      <!-- The reveal is one more row of the tree: a plus puck on the rail -->\n      <button\n        v-if=\"!showNestedSchema && level > 2\"\n        class=\"composition-details-toggle group/tree-control font-code text-c-1 relative flex w-fit cursor-pointer items-center py-1.5 text-sm font-normal\"\n        type=\"button\"\n        @click=\"showNestedSchema = true\">\n        <SchemaGlyphPuck />\n        {{ translate('schema.showSchemaDetails') }}\n      </button>\n\n      <!-- Render the selected schema if it has content to display -->\n      <Schema\n        v-else\n        :key=\"selectedOption?.id ?? '0'\"\n        :breadcrumb=\"breadcrumb\"\n        :compact=\"compact\"\n        :compositionPath=\"compositionPath\"\n        :cycleKey=\"selectedCompositionCycleKey\"\n        :depth=\"depth + 1\"\n        :discriminator=\"discriminator\"\n        :eventBus=\"eventBus\"\n        :expansion=\"expansion\"\n        :hideHeading=\"hideHeading\"\n        :hideModelNames\n        :level=\"level + 1\"\n        :name=\"name\"\n        :noncollapsible=\"true\"\n        :options=\"options\"\n        :schema=\"selectedComposition\"\n        :schemaContext=\"schemaContext\"\n        :scrollTargetId=\"scrollTargetId\"\n        :specificationExtension=\"specificationExtension\" />\n    </SchemaRailPanel>\n  </div>\n</template>\n\n<style scoped>\n/*\n * A `oneOf`/`anyOf` whose chosen variant `allOf`s back to a shared base — most\n * commonly a discriminator-inferred `oneOf` sitting directly on the request body\n * — renders the merged variant one level deeper than a plain object variant:\n * `Schema.vue` cannot flatten the `allOf`, so it hands the merged object to\n * `SchemaProperty`, which wraps it in a headless passthrough row\n * (`.property--tree-container`). That wrapper carries a row's own\n * `--schema-row-pad`, opening a gap between the selector and the first field\n * that a plain `oneOf` does not have, so the variant reads as detached from its\n * picker. Drop that leading row pad for the panel's own variant card so the\n * field sits flush under the selector, matching a plain `oneOf`. Only the top\n * pad goes: the wrapper's trailing pad is what closes the card under the last\n * field, exactly as a plain variant's last row does.\n *\n * The rule lives here rather than in `SchemaProperty` because a body-level\n * discriminator `oneOf` is rendered straight from `Schema.vue` and never passes\n * through `SchemaProperty`, so a rule scoped there would never reach it.\n * See https://github.com/scalar/scalar/issues/9861\n */\n.property-rule\n  :deep(\n    .composition-panel\n      > .schema-card\n      > .schema-properties\n      > ul\n      > li.property.property--tree-container\n  ) {\n  padding-top: 0 !important;\n}\n</style>\n"],"mappings":"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"}

package/dist/schema/SchemaEnumPropertyItem.vue.d.ts

@@ -0,0 +1,8 @@
+type __VLS_Props = {
+    label: string;
+    description?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=SchemaEnumPropertyItem.vue.d.ts.map

package/dist/schema/SchemaEnumPropertyItem.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaEnumPropertyItem.vue.d.ts","sourceRoot":"","sources":["../../src/schema/SchemaEnumPropertyItem.vue"],"names":[],"mappings":"AA8BA,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAC;AAyEF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/schema/SchemaEnumPropertyItem.vue.js

@@ -0,0 +1,7 @@
+import e from "./SchemaEnumPropertyItem.vue.script.js";
+//#region src/schema/SchemaEnumPropertyItem.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=SchemaEnumPropertyItem.vue.js.map

package/dist/schema/SchemaEnumPropertyItem.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaEnumPropertyItem.vue.js","names":[],"sources":["../../src/schema/SchemaEnumPropertyItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarMarkdown } from '@scalar/components/markdown'\nimport { ScalarWrappingText } from '@scalar/components/wrapping-text'\n\ndefineProps<{\n  label: string\n  description?: string\n}>()\n</script>\n\n<template>\n  <li class=\"property-enum-row flex flex-col gap-0.5 border-t px-3 py-2\">\n    <span class=\"property-enum-row-label font-code text-c-1 text-sm\">\n      <ScalarWrappingText\n        :text=\"label\"\n        preset=\"property\" />\n    </span>\n    <span\n      v-if=\"description\"\n      class=\"property-enum-row-description text-c-2 text-(length:--scalar-small) [&_.markdown]:-mb-0.5\">\n      <ScalarMarkdown :value=\"description\" />\n    </span>\n  </li>\n</template>\n"],"mappings":""}

package/dist/schema/SchemaEnumPropertyItem.vue.script.js

@@ -0,0 +1,24 @@
+import { createCommentVNode as e, createElementBlock as t, createElementVNode as n, createVNode as r, defineComponent as i, openBlock as a, unref as o } from "vue";
+import { ScalarMarkdown as s } from "@scalar/components/markdown";
+import { ScalarWrappingText as c } from "@scalar/components/wrapping-text";
+//#region src/schema/SchemaEnumPropertyItem.vue?vue&type=script&setup=true&lang.ts
+var l = { class: "property-enum-row flex flex-col gap-0.5 border-t px-3 py-2" }, u = { class: "property-enum-row-label font-code text-c-1 text-sm" }, d = {
+	key: 0,
+	class: "property-enum-row-description text-c-2 text-(length:--scalar-small) [&_.markdown]:-mb-0.5"
+}, f = /*@__PURE__*/ i({
+	__name: "SchemaEnumPropertyItem",
+	props: {
+		label: {},
+		description: {}
+	},
+	setup(i) {
+		return (f, p) => (a(), t("li", l, [n("span", u, [r(o(c), {
+			text: i.label,
+			preset: "property"
+		}, null, 8, ["text"])]), i.description ? (a(), t("span", d, [r(o(s), { value: i.description }, null, 8, ["value"])])) : e("", !0)]));
+	}
+});
+//#endregion
+export { f as default };
+
+//# sourceMappingURL=SchemaEnumPropertyItem.vue.script.js.map

package/dist/schema/SchemaEnumPropertyItem.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaEnumPropertyItem.vue.script.js","names":[],"sources":["../../src/schema/SchemaEnumPropertyItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarMarkdown } from '@scalar/components/markdown'\nimport { ScalarWrappingText } from '@scalar/components/wrapping-text'\n\ndefineProps<{\n  label: string\n  description?: string\n}>()\n</script>\n\n<template>\n  <li class=\"property-enum-row flex flex-col gap-0.5 border-t px-3 py-2\">\n    <span class=\"property-enum-row-label font-code text-c-1 text-sm\">\n      <ScalarWrappingText\n        :text=\"label\"\n        preset=\"property\" />\n    </span>\n    <span\n      v-if=\"description\"\n      class=\"property-enum-row-description text-c-2 text-(length:--scalar-small) [&_.markdown]:-mb-0.5\">\n      <ScalarMarkdown :value=\"description\" />\n    </span>\n  </li>\n</template>\n"],"mappings":";;;;;;;;;;;;;;yBAWE,EAWK,MAXL,GAWK,CAVH,EAIO,QAJP,GAIO,CAHL,EAEsB,EAAA,CAAA,GAAA;GADnB,MAAM,EAAA;GACP,QAAO;2BAGH,EAAA,eAAA,EAAA,GADR,EAIO,QAJP,GAIO,CADL,EAAuC,EAAA,CAAA,GAAA,EAAtB,OAAO,EAAA,YAAW,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA"}

package/dist/schema/SchemaEnums.vue.d.ts

@@ -0,0 +1,11 @@
+import type { SchemaObject } from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document';
+type __VLS_Props = {
+    /** The schema object containing enum values and metadata */
+    value: SchemaObject | undefined;
+    /** Whether to display the enum for property names */
+    propertyNames?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=SchemaEnums.vue.d.ts.map

package/dist/schema/SchemaEnums.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaEnums.vue.d.ts","sourceRoot":"","sources":["../../src/schema/SchemaEnums.vue"],"names":[],"mappings":"AA2PA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAQhG,KAAK,WAAW,GAAG;IACjB,4DAA4D;IAC5D,KAAK,EAAE,YAAY,GAAG,SAAS,CAAA;IAC/B,qDAAqD;IACrD,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAC;AA2UF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/schema/SchemaEnums.vue.js

@@ -0,0 +1,9 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./SchemaEnums.vue.script.js";
+/* empty css                          */
+//#region src/schema/SchemaEnums.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-1b21ab2e"]]);
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=SchemaEnums.vue.js.map

package/dist/schema/SchemaEnums.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaEnums.vue.js","names":[],"sources":["../../src/schema/SchemaEnums.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.2/strict/type-guards'\nimport { computed, ref } from 'vue'\n\nimport { useLocalization } from './localization'\nimport SchemaEnumPropertyItem from './SchemaEnumPropertyItem.vue'\nimport SchemaGlyphPuck from './SchemaGlyphPuck.vue'\n\nconst { value, propertyNames = false } = defineProps<{\n  /** The schema object containing enum values and metadata */\n  value: SchemaObject | undefined\n  /** Whether to display the enum for property names */\n  propertyNames?: boolean\n}>()\nconst { translate } = useLocalization()\n\n/**\n * Past this many values the list collapses behind a reveal. 12/8 rather than a\n * tighter pair: with 9/5 a 10-value enum hides half its values.\n */\nconst ENUM_DISPLAY_THRESHOLD = 12\nconst INITIAL_VISIBLE_COUNT = 8\n/** Values at or under this length can render as wrapped chips */\nconst CHIP_MAX_LENGTH = 24\nconst THIN_SPACE = '\\u2009'\n\n/**\n * Resolves the schema that carries the enum values.\n * For arrays, the enum and its x-enum-* metadata live on the items schema, so\n * both the values and their varnames/descriptions have to be read from there.\n */\nconst enumSchema = computed(() => {\n  if (!value) {\n    return undefined\n  }\n  if (value.enum) {\n    return value\n  }\n  return isArraySchema(value) ? resolve.schema(value.items) : undefined\n})\n\n/**\n * Extracts enum values from the schema object.\n * Handles both direct enum values and nested enum arrays.\n */\nconst enumValues = computed(() => enumSchema.value?.enum ?? [])\n\n/**\n * Determines if we should show the long enum list UI.\n * When there are many enum values, we initially show only a subset.\n */\nconst shouldUseLongListDisplay = computed(\n  () => enumValues.value.length > ENUM_DISPLAY_THRESHOLD,\n)\n\nconst initialVisibleCount = computed(() =>\n  shouldUseLongListDisplay.value\n    ? INITIAL_VISIBLE_COUNT\n    : enumValues.value.length,\n)\n\n/**\n * Short flat enums render as wrapped chips: three lines instead of a 40-row\n * wall. Values with descriptions keep the rows instead.\n *\n * `!shouldUseLongListDisplay` is what bounds the COUNT. Chips have no reveal of\n * their own — the \"show all values\" control is a row of the list below — so a\n * long enum of short values (currency or country codes, hundreds of them)\n * would otherwise render every value at once with no way to collapse it.\n * Past the threshold the rows take over and bring their toggle with them.\n */\nconst shouldRenderAsChips = computed(\n  () =>\n    !propertyNames &&\n    enumValues.value.length > 0 &&\n    !shouldUseLongListDisplay.value &&\n    enumValues.value.every(\n      // Measure the text the chip actually renders (value plus any varname), not\n      // the bare value, so a short value with a long x-enum-varname still wraps.\n      (entry, index) =>\n        formatEnumValueWithName(entry, index).length <= CHIP_MAX_LENGTH,\n    ) &&\n    !hasAnyDescription.value,\n)\n\n/** Whether any value carries an x-enum description (chips have nowhere to put one) */\nconst hasAnyDescription = computed(() =>\n  enumValues.value.some(\n    (entry, index) => getEnumValueDescription(entry, index) !== undefined,\n  ),\n)\n\nconst visibleEnumValues = computed(() =>\n  enumValues.value.slice(0, initialVisibleCount.value),\n)\n\nconst hiddenEnumValues = computed(() =>\n  enumValues.value.slice(initialVisibleCount.value),\n)\n\n/**\n * Gets the description for an enum value.\n * Supports both array and object formats for x-enumDescriptions.\n */\nconst getEnumValueDescription = (\n  enumValue: any,\n  index: number,\n): string | undefined => {\n  const schema = enumSchema.value\n  const descriptions =\n    schema?.['x-enumDescriptions'] ?? schema?.['x-enum-descriptions']\n\n  if (!descriptions) {\n    return undefined\n  }\n\n  if (Array.isArray(descriptions)) {\n    return descriptions[index] || undefined\n  }\n\n  if (typeof descriptions === 'object' && descriptions !== null) {\n    return descriptions[String(enumValue)] || undefined\n  }\n\n  return undefined\n}\n\n/**\n * Formats an enum value with its variable name if available.\n * This supports both x-enum-varnames and x-enumNames extensions.\n */\nconst formatEnumValueWithName = (enumValue: any, index: number): string => {\n  const varNames =\n    enumSchema.value?.['x-enum-varnames'] ?? enumSchema.value?.['x-enumNames']\n  const varName = Array.isArray(varNames) ? varNames[index] : undefined\n  return varName\n    ? `${enumValue}${THIN_SPACE}=${THIN_SPACE}${varName}`\n    : String(enumValue)\n}\n\n/**\n * Controls whether the hidden enum values are visible.\n */\nconst isExpanded = ref(false)\n\nconst toggleExpanded = () => {\n  isExpanded.value = !isExpanded.value\n}\n</script>\n\n<template>\n  <div\n    v-if=\"enumSchema?.enum !== undefined\"\n    class=\"property-enum property-enum--tree mt-2 rounded-(--scalar-radius-lg) border\">\n    <!-- A bordered card with a muted header row and one hairline row per\n         value; the chips and the long-list toggle are rows of it too -->\n    <div class=\"property-enum-header text-c-2 px-3 py-2 text-sm capitalize\">\n      {{\n        propertyNames\n          ? translate('schema.propertyNames')\n          : translate('schema.values')\n      }}\n    </div>\n    <p\n      v-if=\"enumValues.length === 0\"\n      class=\"text-c-2 border-t px-3 py-2 text-sm\">\n      {{ translate('schema.noAllowedValues') }}\n    </p>\n    <div\n      v-else-if=\"shouldRenderAsChips\"\n      class=\"property-enum-chip-list flex flex-wrap gap-1 border-t px-3 py-2\"\n      role=\"list\">\n      <span\n        v-for=\"(enumValue, index) in enumValues\"\n        :key=\"index\"\n        class=\"property-enum-chip font-code text-c-2 rounded-(--scalar-radius-lg) border px-1.5 py-px text-(length:--scalar-mini)\"\n        role=\"listitem\">\n        {{ formatEnumValueWithName(enumValue, index) }}\n      </span>\n    </div>\n    <ul\n      v-else\n      class=\"property-enum-values-card\"\n      role=\"list\">\n      <SchemaEnumPropertyItem\n        v-for=\"(enumValue, index) in visibleEnumValues\"\n        :key=\"index\"\n        :description=\"getEnumValueDescription(enumValue, index)\"\n        :label=\"formatEnumValueWithName(enumValue, index)\" />\n\n      <template v-if=\"shouldUseLongListDisplay && isExpanded\">\n        <SchemaEnumPropertyItem\n          v-for=\"(enumValue, index) in hiddenEnumValues\"\n          :key=\"initialVisibleCount + index\"\n          :description=\"\n            getEnumValueDescription(enumValue, initialVisibleCount + index)\n          \"\n          :label=\"\n            formatEnumValueWithName(enumValue, initialVisibleCount + index)\n          \" />\n      </template>\n\n      <li\n        v-if=\"shouldUseLongListDisplay\"\n        class=\"border-t\">\n        <!-- The reveal is a tree control like the row toggles, so it draws the\n             same puck and lights it the same way when the row is hovered -->\n        <button\n          class=\"enum-toggle-button group/tree-control text-c-2 hover:text-c-1 flex w-full cursor-pointer items-center gap-1.5 px-3 py-2 text-sm\"\n          type=\"button\"\n          @click=\"toggleExpanded\">\n          <SchemaGlyphPuck\n            :floating=\"false\"\n            :open=\"isExpanded\" />\n          {{\n            isExpanded\n              ? translate('schema.hideValues')\n              : translate('schema.showAllValues')\n          }}\n        </button>\n      </li>\n    </ul>\n  </div>\n</template>\n\n<style scoped>\n.property-heading:empty + .property-description:last-of-type,\n.property-description:first-of-type:last-of-type {\n  margin-top: 0;\n}\n\n.property-list {\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-radius: var(--scalar-radius);\n  margin-top: 10px;\n}\n\n.property-list .property:last-of-type {\n  padding-bottom: 10px;\n}\n\n.enum-toggle-button:hover {\n  color: var(--scalar-color-1);\n}\n</style>\n"],"mappings":""}

package/dist/schema/SchemaEnums.vue.script.js

@@ -0,0 +1,78 @@
+import { useLocalization as e } from "./localization/index.js";
+import t from "./SchemaGlyphPuck.vue.js";
+import n from "./SchemaEnumPropertyItem.vue.js";
+import { Fragment as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, openBlock as f, ref as p, renderList as m, toDisplayString as h, unref as g } from "vue";
+import { resolve as _ } from "@scalar/workspace-store/resolve";
+import { isArraySchema as v } from "@scalar/workspace-store/schemas/v3.2/strict/type-guards";
+//#region src/schema/SchemaEnums.vue?vue&type=script&setup=true&lang.ts
+var y = {
+	key: 0,
+	class: "property-enum property-enum--tree mt-2 rounded-(--scalar-radius-lg) border"
+}, b = { class: "property-enum-header text-c-2 px-3 py-2 text-sm capitalize" }, x = {
+	key: 0,
+	class: "text-c-2 border-t px-3 py-2 text-sm"
+}, S = {
+	key: 1,
+	class: "property-enum-chip-list flex flex-wrap gap-1 border-t px-3 py-2",
+	role: "list"
+}, C = {
+	key: 2,
+	class: "property-enum-values-card",
+	role: "list"
+}, w = {
+	key: 1,
+	class: "border-t"
+}, T = 12, E = 8, D = 24, O = " ", k = /*@__PURE__*/ d({
+	__name: "SchemaEnums",
+	props: {
+		value: {},
+		propertyNames: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	setup(d) {
+		let { translate: k } = e(), A = i(() => {
+			if (d.value) return d.value.enum ? d.value : v(d.value) ? _.schema(d.value.items) : void 0;
+		}), j = i(() => A.value?.enum ?? []), M = i(() => j.value.length > T), N = i(() => M.value ? E : j.value.length), P = i(() => !d.propertyNames && j.value.length > 0 && !M.value && j.value.every((e, t) => z(e, t).length <= D) && !F.value), F = i(() => j.value.some((e, t) => R(e, t) !== void 0)), I = i(() => j.value.slice(0, N.value)), L = i(() => j.value.slice(N.value)), R = (e, t) => {
+			let n = A.value, r = n?.["x-enumDescriptions"] ?? n?.["x-enum-descriptions"];
+			if (r) {
+				if (Array.isArray(r)) return r[t] || void 0;
+				if (typeof r == "object" && r) return r[String(e)] || void 0;
+			}
+		}, z = (e, t) => {
+			let n = A.value?.["x-enum-varnames"] ?? A.value?.["x-enumNames"], r = Array.isArray(n) ? n[t] : void 0;
+			return r ? `${e}${O}=${O}${r}` : String(e);
+		}, B = p(!1), V = () => {
+			B.value = !B.value;
+		};
+		return (e, i) => A.value?.enum === void 0 ? o("", !0) : (f(), s("div", y, [c("div", b, h(d.propertyNames ? g(k)("schema.propertyNames") : g(k)("schema.values")), 1), j.value.length === 0 ? (f(), s("p", x, h(g(k)("schema.noAllowedValues")), 1)) : P.value ? (f(), s("div", S, [(f(!0), s(r, null, m(j.value, (e, t) => (f(), s("span", {
+			key: t,
+			class: "property-enum-chip font-code text-c-2 rounded-(--scalar-radius-lg) border px-1.5 py-px text-(length:--scalar-mini)",
+			role: "listitem"
+		}, h(z(e, t)), 1))), 128))])) : (f(), s("ul", C, [
+			(f(!0), s(r, null, m(I.value, (e, t) => (f(), a(n, {
+				key: t,
+				description: R(e, t),
+				label: z(e, t)
+			}, null, 8, ["description", "label"]))), 128)),
+			M.value && B.value ? (f(!0), s(r, { key: 0 }, m(L.value, (e, t) => (f(), a(n, {
+				key: N.value + t,
+				description: R(e, N.value + t),
+				label: z(e, N.value + t)
+			}, null, 8, ["description", "label"]))), 128)) : o("", !0),
+			M.value ? (f(), s("li", w, [c("button", {
+				class: "enum-toggle-button group/tree-control text-c-2 hover:text-c-1 flex w-full cursor-pointer items-center gap-1.5 px-3 py-2 text-sm",
+				type: "button",
+				onClick: V
+			}, [u(t, {
+				floating: !1,
+				open: B.value
+			}, null, 8, ["open"]), l(" " + h(B.value ? g(k)("schema.hideValues") : g(k)("schema.showAllValues")), 1)])])) : o("", !0)
+		]))]));
+	}
+});
+//#endregion
+export { k as default };
+
+//# sourceMappingURL=SchemaEnums.vue.script.js.map

package/dist/schema/SchemaEnums.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaEnums.vue.script.js","names":[],"sources":["../../src/schema/SchemaEnums.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.2/strict/type-guards'\nimport { computed, ref } from 'vue'\n\nimport { useLocalization } from './localization'\nimport SchemaEnumPropertyItem from './SchemaEnumPropertyItem.vue'\nimport SchemaGlyphPuck from './SchemaGlyphPuck.vue'\n\nconst { value, propertyNames = false } = defineProps<{\n  /** The schema object containing enum values and metadata */\n  value: SchemaObject | undefined\n  /** Whether to display the enum for property names */\n  propertyNames?: boolean\n}>()\nconst { translate } = useLocalization()\n\n/**\n * Past this many values the list collapses behind a reveal. 12/8 rather than a\n * tighter pair: with 9/5 a 10-value enum hides half its values.\n */\nconst ENUM_DISPLAY_THRESHOLD = 12\nconst INITIAL_VISIBLE_COUNT = 8\n/** Values at or under this length can render as wrapped chips */\nconst CHIP_MAX_LENGTH = 24\nconst THIN_SPACE = '\\u2009'\n\n/**\n * Resolves the schema that carries the enum values.\n * For arrays, the enum and its x-enum-* metadata live on the items schema, so\n * both the values and their varnames/descriptions have to be read from there.\n */\nconst enumSchema = computed(() => {\n  if (!value) {\n    return undefined\n  }\n  if (value.enum) {\n    return value\n  }\n  return isArraySchema(value) ? resolve.schema(value.items) : undefined\n})\n\n/**\n * Extracts enum values from the schema object.\n * Handles both direct enum values and nested enum arrays.\n */\nconst enumValues = computed(() => enumSchema.value?.enum ?? [])\n\n/**\n * Determines if we should show the long enum list UI.\n * When there are many enum values, we initially show only a subset.\n */\nconst shouldUseLongListDisplay = computed(\n  () => enumValues.value.length > ENUM_DISPLAY_THRESHOLD,\n)\n\nconst initialVisibleCount = computed(() =>\n  shouldUseLongListDisplay.value\n    ? INITIAL_VISIBLE_COUNT\n    : enumValues.value.length,\n)\n\n/**\n * Short flat enums render as wrapped chips: three lines instead of a 40-row\n * wall. Values with descriptions keep the rows instead.\n *\n * `!shouldUseLongListDisplay` is what bounds the COUNT. Chips have no reveal of\n * their own — the \"show all values\" control is a row of the list below — so a\n * long enum of short values (currency or country codes, hundreds of them)\n * would otherwise render every value at once with no way to collapse it.\n * Past the threshold the rows take over and bring their toggle with them.\n */\nconst shouldRenderAsChips = computed(\n  () =>\n    !propertyNames &&\n    enumValues.value.length > 0 &&\n    !shouldUseLongListDisplay.value &&\n    enumValues.value.every(\n      // Measure the text the chip actually renders (value plus any varname), not\n      // the bare value, so a short value with a long x-enum-varname still wraps.\n      (entry, index) =>\n        formatEnumValueWithName(entry, index).length <= CHIP_MAX_LENGTH,\n    ) &&\n    !hasAnyDescription.value,\n)\n\n/** Whether any value carries an x-enum description (chips have nowhere to put one) */\nconst hasAnyDescription = computed(() =>\n  enumValues.value.some(\n    (entry, index) => getEnumValueDescription(entry, index) !== undefined,\n  ),\n)\n\nconst visibleEnumValues = computed(() =>\n  enumValues.value.slice(0, initialVisibleCount.value),\n)\n\nconst hiddenEnumValues = computed(() =>\n  enumValues.value.slice(initialVisibleCount.value),\n)\n\n/**\n * Gets the description for an enum value.\n * Supports both array and object formats for x-enumDescriptions.\n */\nconst getEnumValueDescription = (\n  enumValue: any,\n  index: number,\n): string | undefined => {\n  const schema = enumSchema.value\n  const descriptions =\n    schema?.['x-enumDescriptions'] ?? schema?.['x-enum-descriptions']\n\n  if (!descriptions) {\n    return undefined\n  }\n\n  if (Array.isArray(descriptions)) {\n    return descriptions[index] || undefined\n  }\n\n  if (typeof descriptions === 'object' && descriptions !== null) {\n    return descriptions[String(enumValue)] || undefined\n  }\n\n  return undefined\n}\n\n/**\n * Formats an enum value with its variable name if available.\n * This supports both x-enum-varnames and x-enumNames extensions.\n */\nconst formatEnumValueWithName = (enumValue: any, index: number): string => {\n  const varNames =\n    enumSchema.value?.['x-enum-varnames'] ?? enumSchema.value?.['x-enumNames']\n  const varName = Array.isArray(varNames) ? varNames[index] : undefined\n  return varName\n    ? `${enumValue}${THIN_SPACE}=${THIN_SPACE}${varName}`\n    : String(enumValue)\n}\n\n/**\n * Controls whether the hidden enum values are visible.\n */\nconst isExpanded = ref(false)\n\nconst toggleExpanded = () => {\n  isExpanded.value = !isExpanded.value\n}\n</script>\n\n<template>\n  <div\n    v-if=\"enumSchema?.enum !== undefined\"\n    class=\"property-enum property-enum--tree mt-2 rounded-(--scalar-radius-lg) border\">\n    <!-- A bordered card with a muted header row and one hairline row per\n         value; the chips and the long-list toggle are rows of it too -->\n    <div class=\"property-enum-header text-c-2 px-3 py-2 text-sm capitalize\">\n      {{\n        propertyNames\n          ? translate('schema.propertyNames')\n          : translate('schema.values')\n      }}\n    </div>\n    <p\n      v-if=\"enumValues.length === 0\"\n      class=\"text-c-2 border-t px-3 py-2 text-sm\">\n      {{ translate('schema.noAllowedValues') }}\n    </p>\n    <div\n      v-else-if=\"shouldRenderAsChips\"\n      class=\"property-enum-chip-list flex flex-wrap gap-1 border-t px-3 py-2\"\n      role=\"list\">\n      <span\n        v-for=\"(enumValue, index) in enumValues\"\n        :key=\"index\"\n        class=\"property-enum-chip font-code text-c-2 rounded-(--scalar-radius-lg) border px-1.5 py-px text-(length:--scalar-mini)\"\n        role=\"listitem\">\n        {{ formatEnumValueWithName(enumValue, index) }}\n      </span>\n    </div>\n    <ul\n      v-else\n      class=\"property-enum-values-card\"\n      role=\"list\">\n      <SchemaEnumPropertyItem\n        v-for=\"(enumValue, index) in visibleEnumValues\"\n        :key=\"index\"\n        :description=\"getEnumValueDescription(enumValue, index)\"\n        :label=\"formatEnumValueWithName(enumValue, index)\" />\n\n      <template v-if=\"shouldUseLongListDisplay && isExpanded\">\n        <SchemaEnumPropertyItem\n          v-for=\"(enumValue, index) in hiddenEnumValues\"\n          :key=\"initialVisibleCount + index\"\n          :description=\"\n            getEnumValueDescription(enumValue, initialVisibleCount + index)\n          \"\n          :label=\"\n            formatEnumValueWithName(enumValue, initialVisibleCount + index)\n          \" />\n      </template>\n\n      <li\n        v-if=\"shouldUseLongListDisplay\"\n        class=\"border-t\">\n        <!-- The reveal is a tree control like the row toggles, so it draws the\n             same puck and lights it the same way when the row is hovered -->\n        <button\n          class=\"enum-toggle-button group/tree-control text-c-2 hover:text-c-1 flex w-full cursor-pointer items-center gap-1.5 px-3 py-2 text-sm\"\n          type=\"button\"\n          @click=\"toggleExpanded\">\n          <SchemaGlyphPuck\n            :floating=\"false\"\n            :open=\"isExpanded\" />\n          {{\n            isExpanded\n              ? translate('schema.hideValues')\n              : translate('schema.showAllValues')\n          }}\n        </button>\n      </li>\n    </ul>\n  </div>\n</template>\n\n<style scoped>\n.property-heading:empty + .property-description:last-of-type,\n.property-description:first-of-type:last-of-type {\n  margin-top: 0;\n}\n\n.property-list {\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-radius: var(--scalar-radius);\n  margin-top: 10px;\n}\n\n.property-list .property:last-of-type {\n  padding-bottom: 10px;\n}\n\n.enum-toggle-button:hover {\n  color: var(--scalar-color-1);\n}\n</style>\n"],"mappings":"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"}

package/dist/schema/SchemaGlyphPuck.vue.d.ts

@@ -0,0 +1,33 @@
+/**
+ * The 18px glyph puck every tree control shows: an opaque knockout around a
+ * 16px icon, so a rail reads as passing behind it. Hover is the
+ * `tree-control-hover` variant (see tailwind.config.css): a parent carrying
+ * the Tailwind group `group/tree-control`, the row heading beside a gutter
+ * toggle, or the open panel's rail, so whichever element is the real pointer
+ * target lights the puck the same way — a hairline ring on the page colour.
+ *
+ * Floating pucks hang in the row's margin (see the indentation model in
+ * SchemaProperty.vue); the line anchor keeps the glyph beside a heading that wraps.
+ */
+type __VLS_Props = {
+    /** Whether the controlled panel is open; picks the minus glyph over plus when the slot is empty */
+    open?: boolean;
+    /** Position the puck absolutely in the row's margin rather than inline */
+    floating?: boolean;
+    /** Where a floating puck centres: the row's middle, or its first text line */
+    anchor?: 'middle' | 'line';
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=SchemaGlyphPuck.vue.d.ts.map

package/dist/schema/SchemaGlyphPuck.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaGlyphPuck.vue.d.ts","sourceRoot":"","sources":["../../src/schema/SchemaGlyphPuck.vue"],"names":[],"mappings":"AAyDA;;;;;;;;;;GAUG;AACH,KAAK,WAAW,GAAG;IACjB,mGAAmG;IACnG,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAA;CAC3B,CAAC;AAuEF,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAG/C,QAAA,MAAM,UAAU,kSAEd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/schema/SchemaGlyphPuck.vue.js

@@ -0,0 +1,7 @@
+import e from "./SchemaGlyphPuck.vue.script.js";
+//#region src/schema/SchemaGlyphPuck.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=SchemaGlyphPuck.vue.js.map

package/dist/schema/SchemaGlyphPuck.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaGlyphPuck.vue.js","names":[],"sources":["../../src/schema/SchemaGlyphPuck.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIconMinus, ScalarIconPlus } from '@scalar/icons'\n\n/**\n * The 18px glyph puck every tree control shows: an opaque knockout around a\n * 16px icon, so a rail reads as passing behind it. Hover is the\n * `tree-control-hover` variant (see tailwind.config.css): a parent carrying\n * the Tailwind group `group/tree-control`, the row heading beside a gutter\n * toggle, or the open panel's rail, so whichever element is the real pointer\n * target lights the puck the same way — a hairline ring on the page colour.\n *\n * Floating pucks hang in the row's margin (see the indentation model in\n * SchemaProperty.vue); the line anchor keeps the glyph beside a heading that wraps.\n */\nconst {\n  open,\n  floating = true,\n  anchor = 'middle',\n} = defineProps<{\n  /** Whether the controlled panel is open; picks the minus glyph over plus when the slot is empty */\n  open?: boolean\n  /** Position the puck absolutely in the row's margin rather than inline */\n  floating?: boolean\n  /** Where a floating puck centres: the row's middle, or its first text line */\n  anchor?: 'middle' | 'line'\n}>()\n</script>\n<template>\n  <span\n    aria-hidden=\"true\"\n    class=\"schema-glyph tree-control-hover:bg-b-1 tree-control-hover:text-c-1 tree-control-hover:border-(--scalar-border-color) print:bg-transparent [&_svg]:size-[var(--schema-glyph-icon,16px)]\"\n    :class=\"\n      floating\n        ? [\n            'absolute start-[calc(0px_-_var(--schema-glyph-half,9px)_-_var(--schema-gutter,16px))] -translate-y-1/2',\n            anchor === 'line' ? 'top-[0.5lh]' : 'top-1/2',\n          ]\n        : undefined\n    \">\n    <!-- print: paper strips background paint but still prints the rail, so the\n         knockout goes transparent. This comment stays inside the span: beside\n         the root it would make the template a fragment and break fallthrough. -->\n    <slot>\n      <ScalarIconMinus\n        v-if=\"open\"\n        weight=\"light\" />\n      <ScalarIconPlus\n        v-else\n        weight=\"light\" />\n    </slot>\n  </span>\n</template>\n"],"mappings":""}

package/dist/schema/SchemaGlyphPuck.vue.script.js

@@ -0,0 +1,30 @@
+import { createBlock as e, createElementBlock as t, defineComponent as n, normalizeClass as r, openBlock as i, renderSlot as a, unref as o } from "vue";
+import { ScalarIconMinus as s, ScalarIconPlus as c } from "@scalar/icons";
+//#region src/schema/SchemaGlyphPuck.vue?vue&type=script&setup=true&lang.ts
+var l = /*@__PURE__*/ n({
+	__name: "SchemaGlyphPuck",
+	props: {
+		open: { type: Boolean },
+		floating: {
+			type: Boolean,
+			default: !0
+		},
+		anchor: { default: "middle" }
+	},
+	setup(n) {
+		return (l, u) => (i(), t("span", {
+			"aria-hidden": "true",
+			class: r(["schema-glyph tree-control-hover:bg-b-1 tree-control-hover:text-c-1 tree-control-hover:border-(--scalar-border-color) print:bg-transparent [&_svg]:size-[var(--schema-glyph-icon,16px)]", n.floating ? ["absolute start-[calc(0px_-_var(--schema-glyph-half,9px)_-_var(--schema-gutter,16px))] -translate-y-1/2", n.anchor === "line" ? "top-[0.5lh]" : "top-1/2"] : void 0])
+		}, [a(l.$slots, "default", {}, () => [n.open ? (i(), e(o(s), {
+			key: 0,
+			weight: "light"
+		})) : (i(), e(o(c), {
+			key: 1,
+			weight: "light"
+		}))])], 2));
+	}
+});
+//#endregion
+export { l as default };
+
+//# sourceMappingURL=SchemaGlyphPuck.vue.script.js.map

package/dist/schema/SchemaGlyphPuck.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaGlyphPuck.vue.script.js","names":[],"sources":["../../src/schema/SchemaGlyphPuck.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIconMinus, ScalarIconPlus } from '@scalar/icons'\n\n/**\n * The 18px glyph puck every tree control shows: an opaque knockout around a\n * 16px icon, so a rail reads as passing behind it. Hover is the\n * `tree-control-hover` variant (see tailwind.config.css): a parent carrying\n * the Tailwind group `group/tree-control`, the row heading beside a gutter\n * toggle, or the open panel's rail, so whichever element is the real pointer\n * target lights the puck the same way — a hairline ring on the page colour.\n *\n * Floating pucks hang in the row's margin (see the indentation model in\n * SchemaProperty.vue); the line anchor keeps the glyph beside a heading that wraps.\n */\nconst {\n  open,\n  floating = true,\n  anchor = 'middle',\n} = defineProps<{\n  /** Whether the controlled panel is open; picks the minus glyph over plus when the slot is empty */\n  open?: boolean\n  /** Position the puck absolutely in the row's margin rather than inline */\n  floating?: boolean\n  /** Where a floating puck centres: the row's middle, or its first text line */\n  anchor?: 'middle' | 'line'\n}>()\n</script>\n<template>\n  <span\n    aria-hidden=\"true\"\n    class=\"schema-glyph tree-control-hover:bg-b-1 tree-control-hover:text-c-1 tree-control-hover:border-(--scalar-border-color) print:bg-transparent [&_svg]:size-[var(--schema-glyph-icon,16px)]\"\n    :class=\"\n      floating\n        ? [\n            'absolute start-[calc(0px_-_var(--schema-glyph-half,9px)_-_var(--schema-gutter,16px))] -translate-y-1/2',\n            anchor === 'line' ? 'top-[0.5lh]' : 'top-1/2',\n          ]\n        : undefined\n    \">\n    <!-- print: paper strips background paint but still prints the rail, so the\n         knockout goes transparent. This comment stays inside the span: beside\n         the root it would make the template a fragment and break fallthrough. -->\n    <slot>\n      <ScalarIconMinus\n        v-if=\"open\"\n        weight=\"light\" />\n      <ScalarIconPlus\n        v-else\n        weight=\"light\" />\n    </slot>\n  </span>\n</template>\n"],"mappings":";;;;;;;;;;;;;;yBA4BE,EAsBO,QAAA;GArBL,eAAY;GACZ,OAAK,EAAA,CAAC,0LACS,EAAA,WAAA,CAAA,0GAAuJ,EAAA,WAAM,SAAA,gBAAA,SAAA,IAA+D,KAAA,CAAA,CAAA;MAW3O,EAOO,EAAA,QAAA,WAAA,CAAA,SAAA,CALG,EAAA,QAAA,EAAA,GADR,EAEmB,EAAA,CAAA,GAAA;;GAAjB,QAAO;cACT,EAEmB,EAAA,CAAA,GAAA;;GAAjB,QAAO"}

package/dist/schema/SchemaGutterToggle.vue.d.ts

@@ -0,0 +1,32 @@
+/**
+ * A property row's disclosure control: a content-free button in the property's
+ * gutter. Its accessible name is the property name via `aria-labelledby`, and the
+ * child count rides `aria-describedby` so screen-reader verbosity settings apply.
+ * The 24px hit box (WCAG 2.5.8) and the 18px glyph puck inside it are sized
+ * independently.
+ */
+type __VLS_Props = {
+    /** Whether the controlled panel is expanded */
+    open: boolean;
+    /** id of the panel this toggle controls */
+    panelId: string;
+    /** Only reference the panel while it is actually in the DOM */
+    panelRendered: boolean;
+    /** id of the visible property name that labels this control, absent on nameless rows */
+    nameId?: string;
+    /**
+     * Accessible name when there is no visible name to reference: pointing
+     * `aria-labelledby` at an id that never renders leaves the button unnamed.
+     */
+    fallbackLabel: string;
+    /** id of the visually hidden child count that describes this control */
+    countId?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    toggle: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onToggle?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=SchemaGutterToggle.vue.d.ts.map

package/dist/schema/SchemaGutterToggle.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaGutterToggle.vue.d.ts","sourceRoot":"","sources":["../../src/schema/SchemaGutterToggle.vue"],"names":[],"mappings":"AAwDA;;;;;;GAMG;AACH,KAAK,WAAW,GAAG;IACf,+CAA+C;IAC/C,IAAI,EAAE,OAAO,CAAA;IACb,2CAA2C;IAC3C,OAAO,EAAE,MAAM,CAAA;IACf,+DAA+D;IAC/D,aAAa,EAAE,OAAO,CAAA;IACtB,wFAAwF;IACxF,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAA;IACrB,wEAAwE;IACxE,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAC;AA0EJ,QAAA,MAAM,YAAY;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}