@scalar/api-reference 1.57.2 → 1.57.4

package/dist/components/Content/Schema/Schema.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"Schema.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/Schema.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { Disclosure, DisclosureButton, DisclosurePanel } from '@headlessui/vue'\nimport { ScalarIcon, ScalarMarkdown } from '@scalar/components'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport type {\n  DiscriminatorObject,\n  SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed } from 'vue'\n\nimport type { SchemaOptions } from '@/components/Content/Schema/types'\nimport ScreenReader from '@/components/ScreenReader.vue'\n\nimport { isEmptySchemaObject } from './helpers/is-empty-schema-object'\nimport { isTypeObject } from './helpers/is-type-object'\nimport SchemaHeading from './SchemaHeading.vue'\nimport SchemaObjectProperties from './SchemaObjectProperties.vue'\nimport SchemaProperty from './SchemaProperty.vue'\n\nconst {\n  schema,\n  level = 0,\n  name,\n  compact,\n  noncollapsible = false,\n  hideHeading,\n  hideDescription = false,\n  additionalProperties,\n  discriminator,\n  breadcrumb,\n  hideModelNames = false,\n  options,\n  schemaContext,\n  compositionPath,\n} = defineProps<{\n  schema?: SchemaObject\n  /** Track how deep we've gone */\n  level?: number\n  /* Show as a heading */\n  name?: string\n  /** A tighter layout with less borders and without a heading */\n  compact?: boolean\n  /** Shows a toggle to hide/show children */\n  noncollapsible?: boolean\n  /** Hide the heading */\n  hideHeading?: boolean\n  /** Hide the schema description */\n  hideDescription?: boolean\n  /** Show a special one way toggle for additional properties, also has a top border when open */\n  additionalProperties?: boolean\n  /** Hide model names in type display */\n  hideModelNames?: boolean\n  /** Discriminator object */\n  discriminator?: DiscriminatorObject\n  /** Breadcrumb for the schema */\n  breadcrumb?: string[]\n  /** Event bus emitting actions */\n  eventBus: WorkspaceEventBus | null\n  /** Move the options into a single prop so they are easy to pass around */\n  options: SchemaOptions\n  /** When \"requestBody\", composition dropdown selection is synced 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}>()\n\n/**\n * Determines whether to show the collapse/expand toggle button.\n * We hide the toggle for non-collapsible schemas and root-level schemas.\n */\nconst shouldShowToggle = computed((): boolean => {\n  return !noncollapsible && level > 0\n})\n\n/** Gets the description to show for the schema */\nconst schemaDescription = computed(() => {\n  if (hideDescription) {\n    return null\n  }\n\n  // For the request body we want to show the base description or the first allOf schema description\n  if (schema?.allOf && schema.allOf.length > 0 && name === 'Request Body') {\n    return schema.description || schema.allOf[0]?.description || null\n  }\n\n  // Don't show description if there's no description or it's not a string\n  if (!schema?.description || typeof schema.description !== 'string') {\n    return null\n  }\n\n  // Don't show description for enum schemas (they have special handling)\n  if (schema.enum) {\n    return null\n  }\n\n  // Will be shown in the properties anyway\n  if (\n    !('properties' in schema) &&\n    !('patternProperties' in schema) &&\n    !('additionalProperties' in schema)\n  ) {\n    return null\n  }\n\n  // Return the schema's own description\n  return schema.description\n})\n\n// Prevent click action if noncollapsible\nconst handleClick = (e: MouseEvent) => noncollapsible && e.stopPropagation()\n</script>\n<template>\n  <Disclosure\n    v-if=\"typeof schema === 'object' && Object.keys(schema).length\"\n    v-slot=\"{ open }\"\n    :defaultOpen=\"noncollapsible\">\n    <div\n      class=\"schema-card\"\n      :class=\"[\n        `schema-card--level-${level}`,\n        { 'schema-card--compact': compact, 'schema-card--open': open },\n        { 'border-t': additionalProperties && open },\n      ]\">\n      <!-- Schema description -->\n      <div\n        v-if=\"schemaDescription\"\n        class=\"schema-card-description\">\n        <ScalarMarkdown :value=\"schemaDescription\" />\n      </div>\n      <div\n        v-if=\"isEmptySchemaObject(schema)\"\n        class=\"pt-2\">\n        Empty object\n      </div>\n      <div\n        class=\"schema-properties\"\n        :class=\"{\n          'schema-properties-open': open,\n        }\">\n        <!-- Toggle to collapse/expand long lists of properties -->\n        <div\n          v-if=\"additionalProperties\"\n          v-show=\"!open\"\n          class=\"schema-properties\">\n          <DisclosureButton\n            as=\"button\"\n            class=\"schema-card-title schema-card-title--compact\"\n            @click.capture=\"handleClick\">\n            <ScalarIcon\n              class=\"schema-card-title-icon\"\n              icon=\"Add\"\n              size=\"sm\" />\n            Show additional properties\n            <ScreenReader v-if=\"name\">for {{ name }}</ScreenReader>\n          </DisclosureButton>\n        </div>\n\n        <DisclosureButton\n          v-else-if=\"shouldShowToggle\"\n          v-show=\"!hideHeading && !(noncollapsible && compact)\"\n          :as=\"noncollapsible ? 'div' : 'button'\"\n          class=\"schema-card-title\"\n          :class=\"{ 'schema-card-title--compact': compact }\"\n          :style=\"{\n            top: `calc(var(--refs-viewport-offset) +  calc(var(--schema-title-height) * ${level}))`,\n          }\"\n          @click.capture=\"handleClick\">\n          <template v-if=\"compact\">\n            <ScalarIcon\n              class=\"schema-card-title-icon\"\n              :class=\"{ 'schema-card-title-icon--open': open }\"\n              icon=\"Add\"\n              size=\"sm\" />\n            <template v-if=\"open\">\n              Hide {{ schema?.title ?? 'Child Attributes' }}\n            </template>\n            <template v-else>\n              Show {{ schema?.title ?? 'Child Attributes' }}\n            </template>\n            <ScreenReader v-if=\"name\">for {{ name }}</ScreenReader>\n          </template>\n          <template v-else>\n            <ScalarIcon\n              class=\"schema-card-title-icon\"\n              :class=\"{ 'schema-card-title-icon--open': open }\"\n              icon=\"Add\"\n              size=\"sm\" />\n            <SchemaHeading\n              :name=\"schema?.title ?? name\"\n              :value=\"schema\" />\n          </template>\n        </DisclosureButton>\n        <DisclosurePanel\n          v-if=\"!additionalProperties || open\"\n          as=\"ul\"\n          :static=\"!shouldShowToggle\">\n          <!-- Object properties -->\n          <SchemaObjectProperties\n            v-if=\"isTypeObject(schema)\"\n            :breadcrumb\n            :compact\n            :compositionPath=\"compositionPath\"\n            :discriminator\n            :eventBus=\"eventBus\"\n            :hideHeading\n            :hideModelNames\n            :level=\"level + 1\"\n            :options\n            :schema\n            :schemaContext=\"schemaContext\" />\n          <!-- Not an object -->\n          <template v-else>\n            <SchemaProperty\n              v-if=\"schema\"\n              :breadcrumb\n              :compact\n              :compositionPath=\"compositionPath\"\n              :eventBus=\"eventBus\"\n              :hideHeading\n              :hideModelNames\n              :level\n              :options\n              :schema\n              :schemaContext=\"schemaContext\" />\n          </template>\n        </DisclosurePanel>\n      </div>\n    </div>\n  </Disclosure>\n</template>\n<style scoped>\n.error {\n  background-color: var(--scalar-color-red);\n}\n.schema-card {\n  font-size: var(--scalar-font-size-4);\n  color: var(--scalar-color-1);\n}\n.schema-card-title {\n  height: var(--schema-title-height);\n\n  padding: 6px 8px;\n\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  color: var(--scalar-color-2);\n  font-weight: var(--scalar-semibold);\n  font-size: var(--scalar-mini);\n  border-bottom: var(--scalar-border-width) solid transparent;\n}\nbutton.schema-card-title {\n  cursor: pointer;\n}\nbutton.schema-card-title:hover {\n  color: var(--scalar-color-1);\n}\n.schema-card-title-icon--open {\n  transform: rotate(45deg);\n}\n.schema-properties-open > .schema-card-title {\n  border-bottom-left-radius: 0;\n  border-bottom-right-radius: 0;\n  border-bottom: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n.schema-properties-open > .schema-properties {\n  width: fit-content;\n}\n.schema-card-description {\n  color: var(--scalar-color-2);\n}\n.schema-card-description + .schema-properties {\n  width: fit-content;\n}\n.schema-card-description + .schema-properties {\n  margin-top: 8px;\n}\n.schema-card--level-0:nth-of-type(1)\n  > .schema-card-description:has(+ .schema-properties) {\n  margin-bottom: -8px;\n  padding-bottom: 8px;\n  border-bottom: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n.schema-card--level-0\n  ~ .schema-card--level-0\n  > .schema-card-description:has(+ .schema-properties) {\n  padding-top: 8px;\n}\n\n.schema-properties-open.schema-properties,\n.schema-properties-open > .schema-card--open {\n  width: 100%;\n}\n.schema-properties {\n  display: flex;\n  flex-direction: column;\n\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-radius: var(--scalar-radius-lg);\n  width: fit-content;\n}\n.schema-properties-name {\n  width: 100%;\n}\n.schema-properties .schema-properties {\n  border-radius: 13.5px;\n}\n.schema-properties .schema-properties.schema-properties-open {\n  border-radius: var(--scalar-radius-lg);\n}\n.schema-properties-open {\n  width: 100%;\n}\n.schema-card--compact {\n  align-self: flex-start;\n}\n.schema-card--compact.schema-card--open {\n  align-self: initial;\n}\n.schema-card-title--compact {\n  color: var(--scalar-color-2);\n  padding: 6px 10px 6px 8px;\n  height: auto;\n  border-bottom: none;\n}\n.schema-card-title--compact > .schema-card-title-icon {\n  margin: 0;\n}\n.schema-card-title--compact > .schema-card-title-icon--open {\n  transform: rotate(45deg);\n}\n.schema-properties-open > .schema-card-title--compact {\n  position: static;\n}\n.property--level-0\n  > .schema-properties\n  > .schema-card--level-0\n  > .schema-properties {\n  border: none;\n}\n.property--level-0\n  .schema-card--level-0:not(.schema-card--compact)\n  .property--level-1 {\n  padding: 0 0 8px;\n}\n:not(.composition-panel)\n  > .schema-card--compact.schema-card--level-0\n  > .schema-properties {\n  border: none;\n}\n:deep(.schema-card-description) p {\n  font-size: var(--scalar-small, var(--scalar-paragraph));\n  color: var(--scalar-color-2);\n  margin-bottom: 0;\n  display: block;\n  margin-bottom: 6px;\n}\n.children .schema-card-description:first-of-type {\n  padding-top: 0;\n}\n</style>\n"],"mappings":"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"}
+{"version":3,"file":"Schema.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/Schema.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { Disclosure, DisclosureButton, DisclosurePanel } from '@headlessui/vue'\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { ScalarMarkdown } from '@scalar/components/markdown'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport type {\n  DiscriminatorObject,\n  SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed } from 'vue'\n\nimport type { SchemaOptions } from '@/components/Content/Schema/types'\nimport ScreenReader from '@/components/ScreenReader.vue'\n\nimport { isEmptySchemaObject } from './helpers/is-empty-schema-object'\nimport { isTypeObject } from './helpers/is-type-object'\nimport SchemaHeading from './SchemaHeading.vue'\nimport SchemaObjectProperties from './SchemaObjectProperties.vue'\nimport SchemaProperty from './SchemaProperty.vue'\n\nconst {\n  schema,\n  level = 0,\n  name,\n  compact,\n  noncollapsible = false,\n  hideHeading,\n  hideDescription = false,\n  additionalProperties,\n  discriminator,\n  breadcrumb,\n  hideModelNames = false,\n  options,\n  schemaContext,\n  compositionPath,\n} = defineProps<{\n  schema?: SchemaObject\n  /** Track how deep we've gone */\n  level?: number\n  /* Show as a heading */\n  name?: string\n  /** A tighter layout with less borders and without a heading */\n  compact?: boolean\n  /** Shows a toggle to hide/show children */\n  noncollapsible?: boolean\n  /** Hide the heading */\n  hideHeading?: boolean\n  /** Hide the schema description */\n  hideDescription?: boolean\n  /** Show a special one way toggle for additional properties, also has a top border when open */\n  additionalProperties?: boolean\n  /** Hide model names in type display */\n  hideModelNames?: boolean\n  /** Discriminator object */\n  discriminator?: DiscriminatorObject\n  /** Breadcrumb for the schema */\n  breadcrumb?: string[]\n  /** Event bus emitting actions */\n  eventBus: WorkspaceEventBus | null\n  /** Move the options into a single prop so they are easy to pass around */\n  options: SchemaOptions\n  /** When \"requestBody\", composition dropdown selection is synced 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}>()\n\n/**\n * Determines whether to show the collapse/expand toggle button.\n * We hide the toggle for non-collapsible schemas and root-level schemas.\n */\nconst shouldShowToggle = computed((): boolean => {\n  return !noncollapsible && level > 0\n})\n\n/** Gets the description to show for the schema */\nconst schemaDescription = computed(() => {\n  if (hideDescription) {\n    return null\n  }\n\n  // For the request body we want to show the base description or the first allOf schema description\n  if (schema?.allOf && schema.allOf.length > 0 && name === 'Request Body') {\n    return schema.description || schema.allOf[0]?.description || null\n  }\n\n  // Don't show description if there's no description or it's not a string\n  if (!schema?.description || typeof schema.description !== 'string') {\n    return null\n  }\n\n  // Don't show description for enum schemas (they have special handling)\n  if (schema.enum) {\n    return null\n  }\n\n  // Will be shown in the properties anyway\n  if (\n    !('properties' in schema) &&\n    !('patternProperties' in schema) &&\n    !('additionalProperties' in schema)\n  ) {\n    return null\n  }\n\n  // Return the schema's own description\n  return schema.description\n})\n\n// Prevent click action if noncollapsible\nconst handleClick = (e: MouseEvent) => noncollapsible && e.stopPropagation()\n</script>\n<template>\n  <Disclosure\n    v-if=\"typeof schema === 'object' && Object.keys(schema).length\"\n    v-slot=\"{ open }\"\n    :defaultOpen=\"noncollapsible\">\n    <div\n      class=\"schema-card\"\n      :class=\"[\n        `schema-card--level-${level}`,\n        { 'schema-card--compact': compact, 'schema-card--open': open },\n        { 'border-t': additionalProperties && open },\n      ]\">\n      <!-- Schema description -->\n      <div\n        v-if=\"schemaDescription\"\n        class=\"schema-card-description\">\n        <ScalarMarkdown :value=\"schemaDescription\" />\n      </div>\n      <div\n        v-if=\"isEmptySchemaObject(schema)\"\n        class=\"pt-2\">\n        Empty object\n      </div>\n      <div\n        class=\"schema-properties\"\n        :class=\"{\n          'schema-properties-open': open,\n        }\">\n        <!-- Toggle to collapse/expand long lists of properties -->\n        <div\n          v-if=\"additionalProperties\"\n          v-show=\"!open\"\n          class=\"schema-properties\">\n          <DisclosureButton\n            as=\"button\"\n            class=\"schema-card-title schema-card-title--compact\"\n            @click.capture=\"handleClick\">\n            <ScalarIcon\n              class=\"schema-card-title-icon\"\n              icon=\"Add\"\n              size=\"sm\" />\n            Show additional properties\n            <ScreenReader v-if=\"name\">for {{ name }}</ScreenReader>\n          </DisclosureButton>\n        </div>\n\n        <DisclosureButton\n          v-else-if=\"shouldShowToggle\"\n          v-show=\"!hideHeading && !(noncollapsible && compact)\"\n          :as=\"noncollapsible ? 'div' : 'button'\"\n          class=\"schema-card-title\"\n          :class=\"{ 'schema-card-title--compact': compact }\"\n          :style=\"{\n            top: `calc(var(--refs-viewport-offset) +  calc(var(--schema-title-height) * ${level}))`,\n          }\"\n          @click.capture=\"handleClick\">\n          <template v-if=\"compact\">\n            <ScalarIcon\n              class=\"schema-card-title-icon\"\n              :class=\"{ 'schema-card-title-icon--open': open }\"\n              icon=\"Add\"\n              size=\"sm\" />\n            <template v-if=\"open\">\n              Hide {{ schema?.title ?? 'Child Attributes' }}\n            </template>\n            <template v-else>\n              Show {{ schema?.title ?? 'Child Attributes' }}\n            </template>\n            <ScreenReader v-if=\"name\">for {{ name }}</ScreenReader>\n          </template>\n          <template v-else>\n            <ScalarIcon\n              class=\"schema-card-title-icon\"\n              :class=\"{ 'schema-card-title-icon--open': open }\"\n              icon=\"Add\"\n              size=\"sm\" />\n            <SchemaHeading\n              :name=\"schema?.title ?? name\"\n              :value=\"schema\" />\n          </template>\n        </DisclosureButton>\n        <DisclosurePanel\n          v-if=\"!additionalProperties || open\"\n          as=\"ul\"\n          :static=\"!shouldShowToggle\">\n          <!-- Object properties -->\n          <SchemaObjectProperties\n            v-if=\"isTypeObject(schema)\"\n            :breadcrumb\n            :compact\n            :compositionPath=\"compositionPath\"\n            :discriminator\n            :eventBus=\"eventBus\"\n            :hideHeading\n            :hideModelNames\n            :level=\"level + 1\"\n            :options\n            :schema\n            :schemaContext=\"schemaContext\" />\n          <!-- Not an object -->\n          <template v-else>\n            <SchemaProperty\n              v-if=\"schema\"\n              :breadcrumb\n              :compact\n              :compositionPath=\"compositionPath\"\n              :eventBus=\"eventBus\"\n              :hideHeading\n              :hideModelNames\n              :level\n              :options\n              :schema\n              :schemaContext=\"schemaContext\" />\n          </template>\n        </DisclosurePanel>\n      </div>\n    </div>\n  </Disclosure>\n</template>\n<style scoped>\n.error {\n  background-color: var(--scalar-color-red);\n}\n.schema-card {\n  font-size: var(--scalar-font-size-4);\n  color: var(--scalar-color-1);\n}\n.schema-card-title {\n  height: var(--schema-title-height);\n\n  padding: 6px 8px;\n\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  color: var(--scalar-color-2);\n  font-weight: var(--scalar-semibold);\n  font-size: var(--scalar-mini);\n  border-bottom: var(--scalar-border-width) solid transparent;\n}\nbutton.schema-card-title {\n  cursor: pointer;\n}\nbutton.schema-card-title:hover {\n  color: var(--scalar-color-1);\n}\n.schema-card-title-icon--open {\n  transform: rotate(45deg);\n}\n.schema-properties-open > .schema-card-title {\n  border-bottom-left-radius: 0;\n  border-bottom-right-radius: 0;\n  border-bottom: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n.schema-properties-open > .schema-properties {\n  width: fit-content;\n}\n.schema-card-description {\n  color: var(--scalar-color-2);\n}\n.schema-card-description + .schema-properties {\n  width: fit-content;\n}\n.schema-card-description + .schema-properties {\n  margin-top: 8px;\n}\n.schema-card--level-0:nth-of-type(1)\n  > .schema-card-description:has(+ .schema-properties) {\n  margin-bottom: -8px;\n  padding-bottom: 8px;\n  border-bottom: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n.schema-card--level-0\n  ~ .schema-card--level-0\n  > .schema-card-description:has(+ .schema-properties) {\n  padding-top: 8px;\n}\n\n.schema-properties-open.schema-properties,\n.schema-properties-open > .schema-card--open {\n  width: 100%;\n}\n.schema-properties {\n  display: flex;\n  flex-direction: column;\n\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-radius: var(--scalar-radius-lg);\n  width: fit-content;\n}\n.schema-properties-name {\n  width: 100%;\n}\n.schema-properties .schema-properties {\n  border-radius: 13.5px;\n}\n.schema-properties .schema-properties.schema-properties-open {\n  border-radius: var(--scalar-radius-lg);\n}\n.schema-properties-open {\n  width: 100%;\n}\n.schema-card--compact {\n  align-self: flex-start;\n}\n.schema-card--compact.schema-card--open {\n  align-self: initial;\n}\n.schema-card-title--compact {\n  color: var(--scalar-color-2);\n  padding: 6px 10px 6px 8px;\n  height: auto;\n  border-bottom: none;\n}\n.schema-card-title--compact > .schema-card-title-icon {\n  margin: 0;\n}\n.schema-card-title--compact > .schema-card-title-icon--open {\n  transform: rotate(45deg);\n}\n.schema-properties-open > .schema-card-title--compact {\n  position: static;\n}\n.property--level-0\n  > .schema-properties\n  > .schema-card--level-0\n  > .schema-properties {\n  border: none;\n}\n.property--level-0\n  .schema-card--level-0:not(.schema-card--compact)\n  .property--level-1 {\n  padding: 0 0 8px;\n}\n:not(.composition-panel)\n  > .schema-card--compact.schema-card--level-0\n  > .schema-properties {\n  border: none;\n}\n:deep(.schema-card-description) p {\n  font-size: var(--scalar-small, var(--scalar-paragraph));\n  color: var(--scalar-color-2);\n  margin-bottom: 0;\n  display: block;\n  margin-bottom: 6px;\n}\n.children .schema-card-description:first-of-type {\n  padding-top: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuEA,MAAM,mBAAmB,eAAwB;AAC/C,UAAO,CAAC,QAAA,kBAAkB,QAAA,QAAQ;IACnC;;EAGD,MAAM,oBAAoB,eAAe;AACvC,OAAI,QAAA,gBACF,QAAO;AAIT,OAAI,QAAA,QAAQ,SAAS,QAAA,OAAO,MAAM,SAAS,KAAK,QAAA,SAAS,eACvD,QAAO,QAAA,OAAO,eAAe,QAAA,OAAO,MAAM,IAAI,eAAe;AAI/D,OAAI,CAAC,QAAA,QAAQ,eAAe,OAAO,QAAA,OAAO,gBAAgB,SACxD,QAAO;AAIT,OAAI,QAAA,OAAO,KACT,QAAO;AAIT,OACE,EAAE,gBAAgB,QAAA,WAClB,EAAE,uBAAuB,QAAA,WACzB,EAAE,0BAA0B,QAAA,QAE5B,QAAO;AAIT,UAAO,QAAA,OAAO;IACf;EAGD,MAAM,eAAe,MAAkB,QAAA,kBAAkB,EAAE,iBAAgB;;iBAI1D,QAAA,WAAM,YAAiB,OAAO,KAAK,QAAA,OAAM,CAAE,UAAA,WAAA,EAD1D,YAoHa,MAAA,WAAA,EAAA;;IAjHV,aAAa,QAAA;;sBAgHR,EAjHI,WAAI,CAEd,mBA+GM,OAAA,EA9GJ,OAAK,eAAA,CAAC,eAAa;2BACqB,QAAA;;8BAA2C,QAAA;MAAO,qBAAuB;MAAI;mBAA0B,QAAA,wBAAwB,MAAI;;KAOnK,kBAAA,SAAA,WAAA,EADR,mBAIM,OAJN,YAIM,CADJ,YAA6C,MAAA,eAAA,EAAA,EAA5B,OAAO,kBAAA,OAAiB,EAAA,MAAA,GAAA,CAAA,QAAA,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA;KAGnC,MAAA,oBAAmB,CAAC,QAAA,OAAM,IAAA,WAAA,EADlC,mBAIM,OAJN,YAEe,iBAEf,IAAA,mBAAA,IAAA,KAAA;KACA,mBA4FM,OAAA,EA3FJ,OAAK,eAAA,CAAC,qBAAmB,EAAA,0BACqB,MAAA,CAAA,CAAA,EAAA,EAAA,CAKtC,QAAA,uBAAA,gBAAA,WAAA,EADR,mBAeM,OAfN,YAeM,CAXJ,YAUmB,MAAA,iBAAA,EAAA;MATjB,IAAG;MACH,OAAM;sBACU;;6BAIF;OAHd,YAGc,MAAA,WAAA,EAAA;QAFZ,OAAM;QACN,MAAK;QACL,MAAK;;iDAAO,gCAEd,GAAA;OAAoB,QAAA,QAAA,WAAA,EAApB,YAAuD,sBAAA,EAAA,KAAA,GAAA,EAAA;+BAAzB,CAAA,gBAAJ,SAAI,gBAAG,QAAA,KAAI,EAAA,EAAA,CAAA,CAAA;;;;;2BAX9B,KAAI,CAAA,CAAA,GAgBF,iBAAA,QAAA,gBAAA,WAAA,EADb,YAkCmB,MAAA,iBAAA,EAAA;;MA/BhB,IAAI,QAAA,iBAAc,QAAA;MACnB,OAAK,eAAA,CAAC,qBAAmB,EAAA,8BACe,QAAA,SAAO,CAAA,CAAA;MAC9C,OAAK,eAAA,EAAA,KAAA,yEAA8F,QAAA,MAAK,KAAA,CAAA;sBAGzF;;6BAcL,CAbK,QAAA,WAAA,WAAA,EAAhB,mBAaW,UAAA,EAAA,KAAA,GAAA,EAAA;OAZT,YAIc,MAAA,WAAA,EAAA;QAHZ,OAAK,eAAA,CAAC,0BAAwB,EAAA,gCACY,MAAI,CAAA,CAAA;QAC9C,MAAK;QACL,MAAK;;OACS,QAAA,WAAA,EAAhB,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAFW,WACf,gBAAG,QAAA,QAAQ,SAAK,mBAAA,EAAA,EAAA,CAAA,EAAA,GAAA,KAAA,WAAA,EAEvB,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAFM,WACV,gBAAG,QAAA,QAAQ,SAAK,mBAAA,EAAA,EAAA,CAAA,EAAA,GAAA;OAEH,QAAA,QAAA,WAAA,EAApB,YAAuD,sBAAA,EAAA,KAAA,GAAA,EAAA;+BAAzB,CAAA,gBAAJ,SAAI,gBAAG,QAAA,KAAI,EAAA,EAAA,CAAA,CAAA;;;8BAEvC,mBASW,UAAA,EAAA,KAAA,GAAA,EAAA,CART,YAIc,MAAA,WAAA,EAAA;OAHZ,OAAK,eAAA,CAAC,0BAAwB,EAAA,gCACY,MAAI,CAAA,CAAA;OAC9C,MAAK;OACL,MAAK;8BACP,YAEoB,uBAAA;OADjB,MAAM,QAAA,QAAQ,SAAS,QAAA;OACvB,OAAO,QAAA;;;;;;;oBA9BH,QAAA,eAAW,EAAM,QAAA,kBAAkB,QAAA,SAAO,CAAA,CAAA,GAAA,mBAAA,IAAA,KAAA,EAAA,CAkC5C,QAAA,wBAAwB,QAAA,WAAA,EADjC,YAiCkB,MAAA,gBAAA,EAAA;;MA/BhB,IAAG;MACF,QAAM,CAAG,iBAAA;;6BAcyB,CAX3B,MAAA,aAAY,CAAC,QAAA,OAAM,IAAA,WAAA,EAD3B,YAYmC,gCAAA;;OAVhC,YAAA,QAAA;OACA,SAAA,QAAA;OACA,iBAAiB,QAAA;OACjB,eAAA,QAAA;OACA,UAAU,QAAA;OACV,aAAA,QAAA;OACA,gBAAA,QAAA;OACA,OAAO,QAAA,QAAK;OACZ,SAAA,QAAA;OACA,QAAA,QAAA;OACA,eAAe,QAAA;;;;;;;;;;;;;0BAElB,mBAaW,UAAA,EAAA,KAAA,GAAA,EAAA,CAXD,QAAA,UAAA,WAAA,EADR,YAWmC,wBAAA;;OAThC,YAAA,QAAA;OACA,SAAA,QAAA;OACA,iBAAiB,QAAA;OACjB,UAAU,QAAA;OACV,aAAA,QAAA;OACA,gBAAA,QAAA;OACA,OAAA,QAAA;OACA,SAAA,QAAA;OACA,QAAA,QAAA;OACA,eAAe,QAAA"}

package/dist/components/Content/Schema/SchemaComposition.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaComposition.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Content/Schema/SchemaComposition.vue"],"names":[],"mappings":"AA8PA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEvE,OAAO,KAAK,EACV,mBAAmB,EACnB,YAAY,EACb,MAAM,8DAA8D,CAAA;AAGrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAA;AAQtE,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,8BAA8B,CAAA;AAItE,KAAK,WAAW,GAAG;IACf,oDAAoD;IACpD,WAAW,EAAE,kBAAkB,CAAA;IAC/B,4DAA4D;IAC5D,aAAa,CAAC,EAAE,mBAAmB,CAAA;IACnC,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,kDAAkD;IAClD,MAAM,EAAE,YAAY,CAAA;IACpB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAA;IACb,oCAAoC;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,kCAAkC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,uCAAuC;IACvC,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,gCAAgC;IAChC,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,iCAAiC;IACjC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAA;IAClC,yEAAyE;IACzE,OAAO,EAAE,aAAa,CAAA;IACtB,uEAAuE;IACvE,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,uFAAuF;IACvF,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;CAC3B,CAAC;AAiVJ,QAAA,MAAM,YAAY;aAhWJ,OAAO;iBAEH,OAAO;6EAiWvB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"SchemaComposition.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Content/Schema/SchemaComposition.vue"],"names":[],"mappings":"AAoQA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEvE,OAAO,KAAK,EACV,mBAAmB,EACnB,YAAY,EACb,MAAM,8DAA8D,CAAA;AAGrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAA;AAQtE,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,8BAA8B,CAAA;AAItE,KAAK,WAAW,GAAG;IACf,oDAAoD;IACpD,WAAW,EAAE,kBAAkB,CAAA;IAC/B,4DAA4D;IAC5D,aAAa,CAAC,EAAE,mBAAmB,CAAA;IACnC,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,kDAAkD;IAClD,MAAM,EAAE,YAAY,CAAA;IACpB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAA;IACb,oCAAoC;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,kCAAkC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,uCAAuC;IACvC,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,gCAAgC;IAChC,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,iCAAiC;IACjC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAA;IAClC,yEAAyE;IACzE,OAAO,EAAE,aAAa,CAAA;IACtB,uEAAuE;IACvE,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,uFAAuF;IACvF,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;CAC3B,CAAC;AAiVJ,QAAA,MAAM,YAAY;aAhWJ,OAAO;iBAEH,OAAO;6EAiWvB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/Content/Schema/SchemaComposition.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaComposition.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaComposition.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarListbox, type ScalarListboxOption } from '@scalar/components'\nimport { isDefined } from '@scalar/helpers/array/is-defined'\nimport { ScalarIconCaretDown } 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.1/strict/openapi-document'\nimport { computed, inject, ref, watch } from 'vue'\n\nimport type { SchemaOptions } from '@/components/Content/Schema/types'\nimport {\n  REQUEST_BODY_COMPOSITION_INDEX_SYMBOL,\n  type RequestBodyCompositionSelection,\n} from '@/features/Operation/request-body-composition-index'\n\nimport { getSchemaType } from './helpers/get-schema-type'\nimport { mergeAllOfSchemas } from './helpers/merge-all-of-schemas'\nimport { type CompositionKeyword } from './helpers/schema-composition'\nimport { getModelNameFromSchema } from './helpers/schema-name'\nimport Schema from './Schema.vue'\n\nconst props = withDefaults(\n  defineProps<{\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    /** 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  }>(),\n  {\n    compact: false,\n    hideHeading: false,\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 over 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      (getModelNameFromSchema(resolved)?.label ?? getSchemaType(resolved)) ||\n      'Schema'\n    return { id: String(index), label }\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\n/**\n * Humanize composition keyword name for display.\n * Converts camelCase to Title Case (e.g., oneOf -> One of).\n */\nconst humanizeType = (type: CompositionKeyword): string =>\n  type\n    .replace(/([A-Z])/g, ' $1')\n    .replace(/^./, (str) => str.toUpperCase())\n    .toLowerCase()\n    .replace(/^(\\w)/, (c) => c.toUpperCase())\n\n/** Inside the currently selected composition */\nconst selectedComposition = computed(\n  () => composition.value[Number(selectedOption.value?.id ?? '0')]?.value,\n)\n\n/** Controls whether the nested schema is displayed */\nconst showNestedSchema = ref(false)\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  <div class=\"property-rule\">\n    <!-- We merge allOf schemas into a single schema -->\n    <Schema\n      v-if=\"props.composition === 'allOf'\"\n      :breadcrumb=\"breadcrumb\"\n      :compact=\"compact\"\n      :compositionPath=\"compositionPath\"\n      :discriminator=\"discriminator\"\n      :eventBus=\"eventBus\"\n      :hideHeading=\"hideHeading\"\n      :hideModelNames\n      :level=\"level + 1\"\n      :name=\"name\"\n      :noncollapsible=\"true\"\n      :options=\"options\"\n      :schema=\"mergeAllOfSchemas(schema)\"\n      :schemaContext=\"schemaContext\" />\n\n    <template v-else>\n      <!-- Composition selector and panel for nested compositions -->\n      <ScalarListbox\n        v-model=\"selectedOption\"\n        :options=\"listboxOptions\"\n        resize>\n        <button\n          class=\"composition-selector bg-b-1.5 hover:bg-b-2 flex w-full cursor-pointer items-center gap-1 rounded-t-lg border px-2.5 py-2.5 pr-3 text-left\"\n          type=\"button\">\n          <span class=\"text-c-2\">{{ humanizeType(props.composition) }}</span>\n          <span\n            class=\"composition-selector-label text-c-1\"\n            :class=\"{\n              'line-through': selectedComposition?.deprecated,\n            }\">\n            {{ selectedOption?.label || 'Schema' }}\n          </span>\n          <div\n            v-if=\"selectedComposition?.deprecated\"\n            class=\"text-red\">\n            deprecated\n          </div>\n          <ScalarIconCaretDown />\n        </button>\n      </ScalarListbox>\n\n      <div class=\"composition-panel\">\n        <!-- Button to toggle nested schema display -->\n        <button\n          v-if=\"!showNestedSchema && level > 2\"\n          class=\"bg-b-1 hover:bg-b-2 text-c-1 flex w-full items-center justify-center gap-2 rounded-b-lg border border-t-0 px-2 py-2 text-sm font-medium transition-colors\"\n          type=\"button\"\n          @click=\"showNestedSchema = true\">\n          Show Schema Details\n          <ScalarIconCaretDown class=\"h-3 w-3\" />\n        </button>\n\n        <!-- Render the selected schema if it has content to display -->\n        <Schema\n          v-else\n          :breadcrumb=\"breadcrumb\"\n          :compact=\"compact\"\n          :compositionPath=\"compositionPath\"\n          :discriminator=\"discriminator\"\n          :eventBus=\"eventBus\"\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      </div>\n    </template>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"SchemaComposition.vue.js","names":[],"sources":["../../../../src/components/Content/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 { ScalarIconCaretDown } 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.1/strict/openapi-document'\nimport { computed, inject, ref, watch } from 'vue'\n\nimport type { SchemaOptions } from '@/components/Content/Schema/types'\nimport {\n  REQUEST_BODY_COMPOSITION_INDEX_SYMBOL,\n  type RequestBodyCompositionSelection,\n} from '@/features/Operation/request-body-composition-index'\n\nimport { getSchemaType } from './helpers/get-schema-type'\nimport { mergeAllOfSchemas } from './helpers/merge-all-of-schemas'\nimport { type CompositionKeyword } from './helpers/schema-composition'\nimport { getModelNameFromSchema } from './helpers/schema-name'\nimport Schema from './Schema.vue'\n\nconst props = withDefaults(\n  defineProps<{\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    /** 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  }>(),\n  {\n    compact: false,\n    hideHeading: false,\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 over 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      (getModelNameFromSchema(resolved)?.label ?? getSchemaType(resolved)) ||\n      'Schema'\n    return { id: String(index), label }\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\n/**\n * Humanize composition keyword name for display.\n * Converts camelCase to Title Case (e.g., oneOf -> One of).\n */\nconst humanizeType = (type: CompositionKeyword): string =>\n  type\n    .replace(/([A-Z])/g, ' $1')\n    .replace(/^./, (str) => str.toUpperCase())\n    .toLowerCase()\n    .replace(/^(\\w)/, (c) => c.toUpperCase())\n\n/** Inside the currently selected composition */\nconst selectedComposition = computed(\n  () => composition.value[Number(selectedOption.value?.id ?? '0')]?.value,\n)\n\n/** Controls whether the nested schema is displayed */\nconst showNestedSchema = ref(false)\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  <div class=\"property-rule\">\n    <!-- We merge allOf schemas into a single schema -->\n    <Schema\n      v-if=\"props.composition === 'allOf'\"\n      :breadcrumb=\"breadcrumb\"\n      :compact=\"compact\"\n      :compositionPath=\"compositionPath\"\n      :discriminator=\"discriminator\"\n      :eventBus=\"eventBus\"\n      :hideHeading=\"hideHeading\"\n      :hideModelNames\n      :level=\"level + 1\"\n      :name=\"name\"\n      :noncollapsible=\"true\"\n      :options=\"options\"\n      :schema=\"mergeAllOfSchemas(schema)\"\n      :schemaContext=\"schemaContext\" />\n\n    <template v-else>\n      <!-- Composition selector and panel for nested compositions -->\n      <ScalarListbox\n        v-model=\"selectedOption\"\n        :options=\"listboxOptions\"\n        resize>\n        <button\n          class=\"composition-selector bg-b-1.5 hover:bg-b-2 flex w-full cursor-pointer items-center gap-1 rounded-t-lg border px-2.5 py-2.5 pr-3 text-left\"\n          type=\"button\">\n          <span class=\"text-c-2\">{{ humanizeType(props.composition) }}</span>\n          <span\n            class=\"composition-selector-label text-c-1\"\n            :class=\"{\n              'line-through': selectedComposition?.deprecated,\n            }\">\n            {{ selectedOption?.label || 'Schema' }}\n          </span>\n          <div\n            v-if=\"selectedComposition?.deprecated\"\n            class=\"text-red\">\n            deprecated\n          </div>\n          <ScalarIconCaretDown />\n        </button>\n      </ScalarListbox>\n\n      <div class=\"composition-panel\">\n        <!-- Button to toggle nested schema display -->\n        <button\n          v-if=\"!showNestedSchema && level > 2\"\n          class=\"bg-b-1 hover:bg-b-2 text-c-1 flex w-full items-center justify-center gap-2 rounded-b-lg border border-t-0 px-2 py-2 text-sm font-medium transition-colors\"\n          type=\"button\"\n          @click=\"showNestedSchema = true\">\n          Show Schema Details\n          <ScalarIconCaretDown class=\"h-3 w-3\" />\n        </button>\n\n        <!-- Render the selected schema if it has content to display -->\n        <Schema\n          v-else\n          :breadcrumb=\"breadcrumb\"\n          :compact=\"compact\"\n          :compositionPath=\"compositionPath\"\n          :discriminator=\"discriminator\"\n          :eventBus=\"eventBus\"\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      </div>\n    </template>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/Content/Schema/SchemaComposition.vue.script.js

@@ -4,8 +4,8 @@ import { mergeAllOfSchemas } from "./helpers/merge-all-of-schemas.js";
 import { getModelNameFromSchema } from "./helpers/schema-name.js";
 import Schema_default from "./Schema.vue.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, normalizeClass, openBlock, ref, toDisplayString, unref, watch, withCtx } from "vue";
-import { ScalarListbox } from "@scalar/components";
 import { ScalarIconCaretDown } from "@scalar/icons";
+import { ScalarListbox } from "@scalar/components/listbox";
 import { resolve } from "@scalar/workspace-store/resolve";
 import { isDefined } from "@scalar/helpers/array/is-defined";
 //#region src/components/Content/Schema/SchemaComposition.vue?vue&type=script&setup=true&lang.ts

package/dist/components/Content/Schema/SchemaComposition.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaComposition.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaComposition.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarListbox, type ScalarListboxOption } from '@scalar/components'\nimport { isDefined } from '@scalar/helpers/array/is-defined'\nimport { ScalarIconCaretDown } 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.1/strict/openapi-document'\nimport { computed, inject, ref, watch } from 'vue'\n\nimport type { SchemaOptions } from '@/components/Content/Schema/types'\nimport {\n  REQUEST_BODY_COMPOSITION_INDEX_SYMBOL,\n  type RequestBodyCompositionSelection,\n} from '@/features/Operation/request-body-composition-index'\n\nimport { getSchemaType } from './helpers/get-schema-type'\nimport { mergeAllOfSchemas } from './helpers/merge-all-of-schemas'\nimport { type CompositionKeyword } from './helpers/schema-composition'\nimport { getModelNameFromSchema } from './helpers/schema-name'\nimport Schema from './Schema.vue'\n\nconst props = withDefaults(\n  defineProps<{\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    /** 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  }>(),\n  {\n    compact: false,\n    hideHeading: false,\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 over 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      (getModelNameFromSchema(resolved)?.label ?? getSchemaType(resolved)) ||\n      'Schema'\n    return { id: String(index), label }\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\n/**\n * Humanize composition keyword name for display.\n * Converts camelCase to Title Case (e.g., oneOf -> One of).\n */\nconst humanizeType = (type: CompositionKeyword): string =>\n  type\n    .replace(/([A-Z])/g, ' $1')\n    .replace(/^./, (str) => str.toUpperCase())\n    .toLowerCase()\n    .replace(/^(\\w)/, (c) => c.toUpperCase())\n\n/** Inside the currently selected composition */\nconst selectedComposition = computed(\n  () => composition.value[Number(selectedOption.value?.id ?? '0')]?.value,\n)\n\n/** Controls whether the nested schema is displayed */\nconst showNestedSchema = ref(false)\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  <div class=\"property-rule\">\n    <!-- We merge allOf schemas into a single schema -->\n    <Schema\n      v-if=\"props.composition === 'allOf'\"\n      :breadcrumb=\"breadcrumb\"\n      :compact=\"compact\"\n      :compositionPath=\"compositionPath\"\n      :discriminator=\"discriminator\"\n      :eventBus=\"eventBus\"\n      :hideHeading=\"hideHeading\"\n      :hideModelNames\n      :level=\"level + 1\"\n      :name=\"name\"\n      :noncollapsible=\"true\"\n      :options=\"options\"\n      :schema=\"mergeAllOfSchemas(schema)\"\n      :schemaContext=\"schemaContext\" />\n\n    <template v-else>\n      <!-- Composition selector and panel for nested compositions -->\n      <ScalarListbox\n        v-model=\"selectedOption\"\n        :options=\"listboxOptions\"\n        resize>\n        <button\n          class=\"composition-selector bg-b-1.5 hover:bg-b-2 flex w-full cursor-pointer items-center gap-1 rounded-t-lg border px-2.5 py-2.5 pr-3 text-left\"\n          type=\"button\">\n          <span class=\"text-c-2\">{{ humanizeType(props.composition) }}</span>\n          <span\n            class=\"composition-selector-label text-c-1\"\n            :class=\"{\n              'line-through': selectedComposition?.deprecated,\n            }\">\n            {{ selectedOption?.label || 'Schema' }}\n          </span>\n          <div\n            v-if=\"selectedComposition?.deprecated\"\n            class=\"text-red\">\n            deprecated\n          </div>\n          <ScalarIconCaretDown />\n        </button>\n      </ScalarListbox>\n\n      <div class=\"composition-panel\">\n        <!-- Button to toggle nested schema display -->\n        <button\n          v-if=\"!showNestedSchema && level > 2\"\n          class=\"bg-b-1 hover:bg-b-2 text-c-1 flex w-full items-center justify-center gap-2 rounded-b-lg border border-t-0 px-2 py-2 text-sm font-medium transition-colors\"\n          type=\"button\"\n          @click=\"showNestedSchema = true\">\n          Show Schema Details\n          <ScalarIconCaretDown class=\"h-3 w-3\" />\n        </button>\n\n        <!-- Render the selected schema if it has content to display -->\n        <Schema\n          v-else\n          :breadcrumb=\"breadcrumb\"\n          :compact=\"compact\"\n          :compositionPath=\"compositionPath\"\n          :discriminator=\"discriminator\"\n          :eventBus=\"eventBus\"\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      </div>\n    </template>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"SchemaComposition.vue.script.js","names":[],"sources":["../../../../src/components/Content/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 { ScalarIconCaretDown } 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.1/strict/openapi-document'\nimport { computed, inject, ref, watch } from 'vue'\n\nimport type { SchemaOptions } from '@/components/Content/Schema/types'\nimport {\n  REQUEST_BODY_COMPOSITION_INDEX_SYMBOL,\n  type RequestBodyCompositionSelection,\n} from '@/features/Operation/request-body-composition-index'\n\nimport { getSchemaType } from './helpers/get-schema-type'\nimport { mergeAllOfSchemas } from './helpers/merge-all-of-schemas'\nimport { type CompositionKeyword } from './helpers/schema-composition'\nimport { getModelNameFromSchema } from './helpers/schema-name'\nimport Schema from './Schema.vue'\n\nconst props = withDefaults(\n  defineProps<{\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    /** 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  }>(),\n  {\n    compact: false,\n    hideHeading: false,\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 over 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      (getModelNameFromSchema(resolved)?.label ?? getSchemaType(resolved)) ||\n      'Schema'\n    return { id: String(index), label }\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\n/**\n * Humanize composition keyword name for display.\n * Converts camelCase to Title Case (e.g., oneOf -> One of).\n */\nconst humanizeType = (type: CompositionKeyword): string =>\n  type\n    .replace(/([A-Z])/g, ' $1')\n    .replace(/^./, (str) => str.toUpperCase())\n    .toLowerCase()\n    .replace(/^(\\w)/, (c) => c.toUpperCase())\n\n/** Inside the currently selected composition */\nconst selectedComposition = computed(\n  () => composition.value[Number(selectedOption.value?.id ?? '0')]?.value,\n)\n\n/** Controls whether the nested schema is displayed */\nconst showNestedSchema = ref(false)\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  <div class=\"property-rule\">\n    <!-- We merge allOf schemas into a single schema -->\n    <Schema\n      v-if=\"props.composition === 'allOf'\"\n      :breadcrumb=\"breadcrumb\"\n      :compact=\"compact\"\n      :compositionPath=\"compositionPath\"\n      :discriminator=\"discriminator\"\n      :eventBus=\"eventBus\"\n      :hideHeading=\"hideHeading\"\n      :hideModelNames\n      :level=\"level + 1\"\n      :name=\"name\"\n      :noncollapsible=\"true\"\n      :options=\"options\"\n      :schema=\"mergeAllOfSchemas(schema)\"\n      :schemaContext=\"schemaContext\" />\n\n    <template v-else>\n      <!-- Composition selector and panel for nested compositions -->\n      <ScalarListbox\n        v-model=\"selectedOption\"\n        :options=\"listboxOptions\"\n        resize>\n        <button\n          class=\"composition-selector bg-b-1.5 hover:bg-b-2 flex w-full cursor-pointer items-center gap-1 rounded-t-lg border px-2.5 py-2.5 pr-3 text-left\"\n          type=\"button\">\n          <span class=\"text-c-2\">{{ humanizeType(props.composition) }}</span>\n          <span\n            class=\"composition-selector-label text-c-1\"\n            :class=\"{\n              'line-through': selectedComposition?.deprecated,\n            }\">\n            {{ selectedOption?.label || 'Schema' }}\n          </span>\n          <div\n            v-if=\"selectedComposition?.deprecated\"\n            class=\"text-red\">\n            deprecated\n          </div>\n          <ScalarIconCaretDown />\n        </button>\n      </ScalarListbox>\n\n      <div class=\"composition-panel\">\n        <!-- Button to toggle nested schema display -->\n        <button\n          v-if=\"!showNestedSchema && level > 2\"\n          class=\"bg-b-1 hover:bg-b-2 text-c-1 flex w-full items-center justify-center gap-2 rounded-b-lg border border-t-0 px-2 py-2 text-sm font-medium transition-colors\"\n          type=\"button\"\n          @click=\"showNestedSchema = true\">\n          Show Schema Details\n          <ScalarIconCaretDown class=\"h-3 w-3\" />\n        </button>\n\n        <!-- Render the selected schema if it has content to display -->\n        <Schema\n          v-else\n          :breadcrumb=\"breadcrumb\"\n          :compact=\"compact\"\n          :compositionPath=\"compositionPath\"\n          :discriminator=\"discriminator\"\n          :eventBus=\"eventBus\"\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      </div>\n    </template>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/Content/Schema/SchemaEnumPropertyItem.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaEnumPropertyItem.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Content/Schema/SchemaEnumPropertyItem.vue"],"names":[],"mappings":"AAoGA,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAC;AA+EF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"SchemaEnumPropertyItem.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Content/Schema/SchemaEnumPropertyItem.vue"],"names":[],"mappings":"AAsGA,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAC;AA+EF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/Content/Schema/SchemaEnumPropertyItem.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import SchemaEnumPropertyItem_vue_vue_type_script_setup_true_lang_default from "./SchemaEnumPropertyItem.vue.script.js";
 /* empty css                                     */
 //#region src/components/Content/Schema/SchemaEnumPropertyItem.vue
-var SchemaEnumPropertyItem_default = /* @__PURE__ */ _plugin_vue_export_helper_default(SchemaEnumPropertyItem_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-f4b54bdd"]]);
+var SchemaEnumPropertyItem_default = /* @__PURE__ */ _plugin_vue_export_helper_default(SchemaEnumPropertyItem_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-4375ecfd"]]);
 //#endregion
 export { SchemaEnumPropertyItem_default as default };
 

package/dist/components/Content/Schema/SchemaEnumPropertyItem.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaEnumPropertyItem.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaEnumPropertyItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarMarkdown, ScalarWrappingText } from '@scalar/components'\n\ndefineProps<{\n  label: string\n  description?: string\n}>()\n</script>\n\n<template>\n  <li class=\"property-enum-value\">\n    <div class=\"property-enum-value-content\">\n      <span class=\"property-enum-value-label\">\n        <ScalarWrappingText\n          :text=\"label\"\n          preset=\"property\" />\n      </span>\n      <span\n        v-if=\"description\"\n        class=\"property-enum-value-description\">\n        <ScalarMarkdown :value=\"description\" />\n      </span>\n    </div>\n  </li>\n</template>\n\n<style scoped>\n.property-enum-value {\n  color: var(--scalar-color-3);\n  line-height: 1.5;\n  overflow-wrap: break-word;\n  display: flex;\n  align-items: stretch;\n  position: relative;\n\n  --decorator-width: 1px;\n  --decorator-color: color-mix(\n    in srgb,\n    var(--scalar-background-1),\n    var(--scalar-color-1) 25%\n  );\n}\n\n.property-enum-value-content {\n  display: flex;\n  flex-direction: column;\n  padding: 3px 0;\n}\n\n.property-enum-value-label {\n  font-family: var(--scalar-font-code);\n  color: var(--scalar-color-1);\n  font-size: var(--scalar-font-size-4);\n  position: relative;\n}\n\n.property-enum-value:last-of-type .property-enum-value-label {\n  padding-bottom: 0;\n}\n\n.property-enum-value::before {\n  content: '';\n  margin-right: 12px;\n  width: var(--decorator-width);\n  display: block;\n  background-color: var(--decorator-color);\n}\n\n.property-enum-value:last-of-type::before,\n.property-enum-values:has(.enum-toggle-button)\n  .property-enum-value:nth-last-child(2)::before {\n  height: calc(0.5lh + 4px);\n}\n\n.property-enum-value-label::after {\n  content: '';\n  position: absolute;\n  top: calc(0.5lh);\n  left: -12px;\n  width: 8px;\n  height: var(--decorator-width);\n  background-color: var(--decorator-color);\n}\n\n.property-enum-value:last-of-type::after {\n  bottom: 0;\n  height: 50%;\n  background: var(--scalar-background-1);\n  border-top: var(--scalar-border-width) solid var(--decorator-color);\n}\n\n.property-enum-value-description {\n  color: var(--scalar-color-3);\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"SchemaEnumPropertyItem.vue.js","names":[],"sources":["../../../../src/components/Content/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-value\">\n    <div class=\"property-enum-value-content\">\n      <span class=\"property-enum-value-label\">\n        <ScalarWrappingText\n          :text=\"label\"\n          preset=\"property\" />\n      </span>\n      <span\n        v-if=\"description\"\n        class=\"property-enum-value-description\">\n        <ScalarMarkdown :value=\"description\" />\n      </span>\n    </div>\n  </li>\n</template>\n\n<style scoped>\n.property-enum-value {\n  color: var(--scalar-color-3);\n  line-height: 1.5;\n  overflow-wrap: break-word;\n  display: flex;\n  align-items: stretch;\n  position: relative;\n\n  --decorator-width: 1px;\n  --decorator-color: color-mix(\n    in srgb,\n    var(--scalar-background-1),\n    var(--scalar-color-1) 25%\n  );\n}\n\n.property-enum-value-content {\n  display: flex;\n  flex-direction: column;\n  padding: 3px 0;\n}\n\n.property-enum-value-label {\n  font-family: var(--scalar-font-code);\n  color: var(--scalar-color-1);\n  font-size: var(--scalar-font-size-4);\n  position: relative;\n}\n\n.property-enum-value:last-of-type .property-enum-value-label {\n  padding-bottom: 0;\n}\n\n.property-enum-value::before {\n  content: '';\n  margin-right: 12px;\n  width: var(--decorator-width);\n  display: block;\n  background-color: var(--decorator-color);\n}\n\n.property-enum-value:last-of-type::before,\n.property-enum-values:has(.enum-toggle-button)\n  .property-enum-value:nth-last-child(2)::before {\n  height: calc(0.5lh + 4px);\n}\n\n.property-enum-value-label::after {\n  content: '';\n  position: absolute;\n  top: calc(0.5lh);\n  left: -12px;\n  width: 8px;\n  height: var(--decorator-width);\n  background-color: var(--decorator-color);\n}\n\n.property-enum-value:last-of-type::after {\n  bottom: 0;\n  height: 50%;\n  background: var(--scalar-background-1);\n  border-top: var(--scalar-border-width) solid var(--decorator-color);\n}\n\n.property-enum-value-description {\n  color: var(--scalar-color-3);\n}\n</style>\n"],"mappings":""}

package/dist/components/Content/Schema/SchemaEnumPropertyItem.vue.script.js

@@ -1,5 +1,6 @@
 import { createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, openBlock, unref } from "vue";
-import { ScalarMarkdown, ScalarWrappingText } from "@scalar/components";
+import { ScalarMarkdown } from "@scalar/components/markdown";
+import { ScalarWrappingText } from "@scalar/components/wrapping-text";
 //#region src/components/Content/Schema/SchemaEnumPropertyItem.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "property-enum-value" };
 var _hoisted_2 = { class: "property-enum-value-content" };

package/dist/components/Content/Schema/SchemaEnumPropertyItem.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaEnumPropertyItem.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaEnumPropertyItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarMarkdown, ScalarWrappingText } from '@scalar/components'\n\ndefineProps<{\n  label: string\n  description?: string\n}>()\n</script>\n\n<template>\n  <li class=\"property-enum-value\">\n    <div class=\"property-enum-value-content\">\n      <span class=\"property-enum-value-label\">\n        <ScalarWrappingText\n          :text=\"label\"\n          preset=\"property\" />\n      </span>\n      <span\n        v-if=\"description\"\n        class=\"property-enum-value-description\">\n        <ScalarMarkdown :value=\"description\" />\n      </span>\n    </div>\n  </li>\n</template>\n\n<style scoped>\n.property-enum-value {\n  color: var(--scalar-color-3);\n  line-height: 1.5;\n  overflow-wrap: break-word;\n  display: flex;\n  align-items: stretch;\n  position: relative;\n\n  --decorator-width: 1px;\n  --decorator-color: color-mix(\n    in srgb,\n    var(--scalar-background-1),\n    var(--scalar-color-1) 25%\n  );\n}\n\n.property-enum-value-content {\n  display: flex;\n  flex-direction: column;\n  padding: 3px 0;\n}\n\n.property-enum-value-label {\n  font-family: var(--scalar-font-code);\n  color: var(--scalar-color-1);\n  font-size: var(--scalar-font-size-4);\n  position: relative;\n}\n\n.property-enum-value:last-of-type .property-enum-value-label {\n  padding-bottom: 0;\n}\n\n.property-enum-value::before {\n  content: '';\n  margin-right: 12px;\n  width: var(--decorator-width);\n  display: block;\n  background-color: var(--decorator-color);\n}\n\n.property-enum-value:last-of-type::before,\n.property-enum-values:has(.enum-toggle-button)\n  .property-enum-value:nth-last-child(2)::before {\n  height: calc(0.5lh + 4px);\n}\n\n.property-enum-value-label::after {\n  content: '';\n  position: absolute;\n  top: calc(0.5lh);\n  left: -12px;\n  width: 8px;\n  height: var(--decorator-width);\n  background-color: var(--decorator-color);\n}\n\n.property-enum-value:last-of-type::after {\n  bottom: 0;\n  height: 50%;\n  background: var(--scalar-background-1);\n  border-top: var(--scalar-border-width) solid var(--decorator-color);\n}\n\n.property-enum-value-description {\n  color: var(--scalar-color-3);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;uBAUE,mBAaK,MAbL,YAaK,CAZH,mBAWM,OAXN,YAWM,CAVJ,mBAIO,QAJP,YAIO,CAHL,YAEsB,MAAA,mBAAA,EAAA;IADnB,MAAM,QAAA;IACP,QAAO;4BAGH,QAAA,eAAA,WAAA,EADR,mBAIO,QAJP,YAIO,CADL,YAAuC,MAAA,eAAA,EAAA,EAAtB,OAAO,QAAA,aAAW,EAAA,MAAA,GAAA,CAAA,QAAA,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"SchemaEnumPropertyItem.vue.script.js","names":[],"sources":["../../../../src/components/Content/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-value\">\n    <div class=\"property-enum-value-content\">\n      <span class=\"property-enum-value-label\">\n        <ScalarWrappingText\n          :text=\"label\"\n          preset=\"property\" />\n      </span>\n      <span\n        v-if=\"description\"\n        class=\"property-enum-value-description\">\n        <ScalarMarkdown :value=\"description\" />\n      </span>\n    </div>\n  </li>\n</template>\n\n<style scoped>\n.property-enum-value {\n  color: var(--scalar-color-3);\n  line-height: 1.5;\n  overflow-wrap: break-word;\n  display: flex;\n  align-items: stretch;\n  position: relative;\n\n  --decorator-width: 1px;\n  --decorator-color: color-mix(\n    in srgb,\n    var(--scalar-background-1),\n    var(--scalar-color-1) 25%\n  );\n}\n\n.property-enum-value-content {\n  display: flex;\n  flex-direction: column;\n  padding: 3px 0;\n}\n\n.property-enum-value-label {\n  font-family: var(--scalar-font-code);\n  color: var(--scalar-color-1);\n  font-size: var(--scalar-font-size-4);\n  position: relative;\n}\n\n.property-enum-value:last-of-type .property-enum-value-label {\n  padding-bottom: 0;\n}\n\n.property-enum-value::before {\n  content: '';\n  margin-right: 12px;\n  width: var(--decorator-width);\n  display: block;\n  background-color: var(--decorator-color);\n}\n\n.property-enum-value:last-of-type::before,\n.property-enum-values:has(.enum-toggle-button)\n  .property-enum-value:nth-last-child(2)::before {\n  height: calc(0.5lh + 4px);\n}\n\n.property-enum-value-label::after {\n  content: '';\n  position: absolute;\n  top: calc(0.5lh);\n  left: -12px;\n  width: 8px;\n  height: var(--decorator-width);\n  background-color: var(--decorator-color);\n}\n\n.property-enum-value:last-of-type::after {\n  bottom: 0;\n  height: 50%;\n  background: var(--scalar-background-1);\n  border-top: var(--scalar-border-width) solid var(--decorator-color);\n}\n\n.property-enum-value-description {\n  color: var(--scalar-color-3);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;uBAWE,mBAaK,MAbL,YAaK,CAZH,mBAWM,OAXN,YAWM,CAVJ,mBAIO,QAJP,YAIO,CAHL,YAEsB,MAAA,mBAAA,EAAA;IADnB,MAAM,QAAA;IACP,QAAO;4BAGH,QAAA,eAAA,WAAA,EADR,mBAIO,QAJP,YAIO,CADL,YAAuC,MAAA,eAAA,EAAA,EAAtB,OAAO,QAAA,aAAW,EAAA,MAAA,GAAA,CAAA,QAAA,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA,CAAA,CAAA"}

package/dist/components/Content/Schema/SchemaEnums.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import SchemaEnums_vue_vue_type_script_setup_true_lang_default from "./SchemaEnums.vue.script.js";
 /* empty css                          */
 //#region src/components/Content/Schema/SchemaEnums.vue
-var SchemaEnums_default = /* @__PURE__ */ _plugin_vue_export_helper_default(SchemaEnums_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-55c01b89"]]);
+var SchemaEnums_default = /* @__PURE__ */ _plugin_vue_export_helper_default(SchemaEnums_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-fa093e1b"]]);
 //#endregion
 export { SchemaEnums_default as default };
 

package/dist/components/Content/Schema/SchemaEnums.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaEnums.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaEnums.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components'\nimport { ScalarIconPlus } from '@scalar/icons'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed, ref } from 'vue'\n\nimport SchemaEnumPropertyItem from './SchemaEnumPropertyItem.vue'\n\nconst { value } = 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}>()\n\nconst ENUM_DISPLAY_THRESHOLD = 9\nconst INITIAL_VISIBLE_COUNT = 5\nconst THIN_SPACE = '\\u2009'\n\n/**\n * Extracts enum values from the schema object.\n * Handles both direct enum values and nested enum arrays.\n */\nconst enumValues = computed(() => {\n  if (!value) {\n    return []\n  }\n  return (\n    value.enum ||\n    (isArraySchema(value) && resolve.schema(value.items)?.enum) ||\n    []\n  )\n})\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\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 descriptions =\n    value?.['x-enumDescriptions'] ?? value?.['x-enum-descriptions']\n\n  if (!descriptions) {\n    return undefined\n  }\n\n  if (Array.isArray(descriptions)) {\n    return descriptions[index]\n  }\n\n  if (typeof descriptions === 'object' && descriptions !== null) {\n    return (descriptions as Record<string, string>)[String(enumValue)]\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 = value?.['x-enum-varnames'] ?? 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=\"enumValues.length > 0\"\n    class=\"property-enum\">\n    <div\n      v-if=\"propertyNames\"\n      class=\"property-enum-property-names\">\n      property names\n    </div>\n    <div\n      v-else\n      class=\"property-enum-property-names\">\n      values\n    </div>\n    <ul class=\"property-enum-values\">\n      <!-- Visible enum values -->\n      <SchemaEnumPropertyItem\n        v-for=\"(enumValue, index) in visibleEnumValues\"\n        :key=\"String(enumValue)\"\n        :description=\"getEnumValueDescription(enumValue, index)\"\n        :label=\"formatEnumValueWithName(enumValue, index)\" />\n\n      <!-- Hidden enum values (when expanded) -->\n      <template v-if=\"shouldUseLongListDisplay && isExpanded\">\n        <SchemaEnumPropertyItem\n          v-for=\"(enumValue, index) in hiddenEnumValues\"\n          :key=\"String(enumValue)\"\n          :description=\"\n            getEnumValueDescription(enumValue, initialVisibleCount + index)\n          \"\n          :label=\"\n            formatEnumValueWithName(enumValue, initialVisibleCount + index)\n          \" />\n      </template>\n\n      <!-- Toggle button for long lists -->\n      <li v-if=\"shouldUseLongListDisplay\">\n        <ScalarButton\n          class=\"enum-toggle-button my-2 flex h-fit gap-1 rounded-full border py-1.5 pr-2.5 pl-2 leading-none\"\n          variant=\"ghost\"\n          @click=\"toggleExpanded\">\n          <ScalarIconPlus\n            :class=\"{ 'rotate-45': isExpanded }\"\n            weight=\"bold\" />\n          {{ isExpanded ? 'Hide values' : 'Show all values' }}\n        </ScalarButton>\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.property-enum-values {\n  font-size: var(--scalar-font-size-3);\n  list-style: none;\n  margin-top: 8px;\n  padding-left: 2px;\n}\n\n.enum-toggle-button:hover {\n  color: var(--scalar-color-1);\n}\n\n.property-enum-property-names {\n  font-size: var(--scalar-font-size-4);\n  color: var(--scalar-color-2);\n  display: inline-block;\n  padding: 0 2px;\n  margin-top: 8px;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"SchemaEnums.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaEnums.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIconPlus } from '@scalar/icons'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed, ref } from 'vue'\n\nimport SchemaEnumPropertyItem from './SchemaEnumPropertyItem.vue'\n\nconst { value } = 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}>()\n\nconst ENUM_DISPLAY_THRESHOLD = 9\nconst INITIAL_VISIBLE_COUNT = 5\nconst THIN_SPACE = '\\u2009'\n\n/**\n * Extracts enum values from the schema object.\n * Handles both direct enum values and nested enum arrays.\n */\nconst enumValues = computed(() => {\n  if (!value) {\n    return []\n  }\n  return (\n    value.enum ||\n    (isArraySchema(value) && resolve.schema(value.items)?.enum) ||\n    []\n  )\n})\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\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 descriptions =\n    value?.['x-enumDescriptions'] ?? value?.['x-enum-descriptions']\n\n  if (!descriptions) {\n    return undefined\n  }\n\n  if (Array.isArray(descriptions)) {\n    return descriptions[index]\n  }\n\n  if (typeof descriptions === 'object' && descriptions !== null) {\n    return (descriptions as Record<string, string>)[String(enumValue)]\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 = value?.['x-enum-varnames'] ?? 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=\"enumValues.length > 0\"\n    class=\"property-enum\">\n    <div\n      v-if=\"propertyNames\"\n      class=\"property-enum-property-names\">\n      property names\n    </div>\n    <div\n      v-else\n      class=\"property-enum-property-names\">\n      values\n    </div>\n    <ul class=\"property-enum-values\">\n      <!-- Visible enum values -->\n      <SchemaEnumPropertyItem\n        v-for=\"(enumValue, index) in visibleEnumValues\"\n        :key=\"String(enumValue)\"\n        :description=\"getEnumValueDescription(enumValue, index)\"\n        :label=\"formatEnumValueWithName(enumValue, index)\" />\n\n      <!-- Hidden enum values (when expanded) -->\n      <template v-if=\"shouldUseLongListDisplay && isExpanded\">\n        <SchemaEnumPropertyItem\n          v-for=\"(enumValue, index) in hiddenEnumValues\"\n          :key=\"String(enumValue)\"\n          :description=\"\n            getEnumValueDescription(enumValue, initialVisibleCount + index)\n          \"\n          :label=\"\n            formatEnumValueWithName(enumValue, initialVisibleCount + index)\n          \" />\n      </template>\n\n      <!-- Toggle button for long lists -->\n      <li v-if=\"shouldUseLongListDisplay\">\n        <ScalarButton\n          class=\"enum-toggle-button my-2 flex h-fit gap-1 rounded-full border py-1.5 pr-2.5 pl-2 leading-none\"\n          variant=\"ghost\"\n          @click=\"toggleExpanded\">\n          <ScalarIconPlus\n            :class=\"{ 'rotate-45': isExpanded }\"\n            weight=\"bold\" />\n          {{ isExpanded ? 'Hide values' : 'Show all values' }}\n        </ScalarButton>\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.property-enum-values {\n  font-size: var(--scalar-font-size-3);\n  list-style: none;\n  margin-top: 8px;\n  padding-left: 2px;\n}\n\n.enum-toggle-button:hover {\n  color: var(--scalar-color-1);\n}\n\n.property-enum-property-names {\n  font-size: var(--scalar-font-size-4);\n  color: var(--scalar-color-2);\n  display: inline-block;\n  padding: 0 2px;\n  margin-top: 8px;\n}\n</style>\n"],"mappings":""}

package/dist/components/Content/Schema/SchemaEnums.vue.script.js

@@ -1,7 +1,7 @@
 import SchemaEnumPropertyItem_default from "./SchemaEnumPropertyItem.vue.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, renderList, toDisplayString, unref, withCtx } from "vue";
-import { ScalarButton } from "@scalar/components";
 import { ScalarIconPlus } from "@scalar/icons";
+import { ScalarButton } from "@scalar/components/button";
 import { resolve } from "@scalar/workspace-store/resolve";
 import { isArraySchema } from "@scalar/workspace-store/schemas/v3.1/strict/type-guards";
 //#region src/components/Content/Schema/SchemaEnums.vue?vue&type=script&setup=true&lang.ts

package/dist/components/Content/Schema/SchemaEnums.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaEnums.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaEnums.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components'\nimport { ScalarIconPlus } from '@scalar/icons'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed, ref } from 'vue'\n\nimport SchemaEnumPropertyItem from './SchemaEnumPropertyItem.vue'\n\nconst { value } = 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}>()\n\nconst ENUM_DISPLAY_THRESHOLD = 9\nconst INITIAL_VISIBLE_COUNT = 5\nconst THIN_SPACE = '\\u2009'\n\n/**\n * Extracts enum values from the schema object.\n * Handles both direct enum values and nested enum arrays.\n */\nconst enumValues = computed(() => {\n  if (!value) {\n    return []\n  }\n  return (\n    value.enum ||\n    (isArraySchema(value) && resolve.schema(value.items)?.enum) ||\n    []\n  )\n})\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\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 descriptions =\n    value?.['x-enumDescriptions'] ?? value?.['x-enum-descriptions']\n\n  if (!descriptions) {\n    return undefined\n  }\n\n  if (Array.isArray(descriptions)) {\n    return descriptions[index]\n  }\n\n  if (typeof descriptions === 'object' && descriptions !== null) {\n    return (descriptions as Record<string, string>)[String(enumValue)]\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 = value?.['x-enum-varnames'] ?? 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=\"enumValues.length > 0\"\n    class=\"property-enum\">\n    <div\n      v-if=\"propertyNames\"\n      class=\"property-enum-property-names\">\n      property names\n    </div>\n    <div\n      v-else\n      class=\"property-enum-property-names\">\n      values\n    </div>\n    <ul class=\"property-enum-values\">\n      <!-- Visible enum values -->\n      <SchemaEnumPropertyItem\n        v-for=\"(enumValue, index) in visibleEnumValues\"\n        :key=\"String(enumValue)\"\n        :description=\"getEnumValueDescription(enumValue, index)\"\n        :label=\"formatEnumValueWithName(enumValue, index)\" />\n\n      <!-- Hidden enum values (when expanded) -->\n      <template v-if=\"shouldUseLongListDisplay && isExpanded\">\n        <SchemaEnumPropertyItem\n          v-for=\"(enumValue, index) in hiddenEnumValues\"\n          :key=\"String(enumValue)\"\n          :description=\"\n            getEnumValueDescription(enumValue, initialVisibleCount + index)\n          \"\n          :label=\"\n            formatEnumValueWithName(enumValue, initialVisibleCount + index)\n          \" />\n      </template>\n\n      <!-- Toggle button for long lists -->\n      <li v-if=\"shouldUseLongListDisplay\">\n        <ScalarButton\n          class=\"enum-toggle-button my-2 flex h-fit gap-1 rounded-full border py-1.5 pr-2.5 pl-2 leading-none\"\n          variant=\"ghost\"\n          @click=\"toggleExpanded\">\n          <ScalarIconPlus\n            :class=\"{ 'rotate-45': isExpanded }\"\n            weight=\"bold\" />\n          {{ isExpanded ? 'Hide values' : 'Show all values' }}\n        </ScalarButton>\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.property-enum-values {\n  font-size: var(--scalar-font-size-3);\n  list-style: none;\n  margin-top: 8px;\n  padding-left: 2px;\n}\n\n.enum-toggle-button:hover {\n  color: var(--scalar-color-1);\n}\n\n.property-enum-property-names {\n  font-size: var(--scalar-font-size-4);\n  color: var(--scalar-color-2);\n  display: inline-block;\n  padding: 0 2px;\n  margin-top: 8px;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAiBA,IAAM,yBAAyB;AAC/B,IAAM,wBAAwB;AAC9B,IAAM,aAAa;;;;;;;;;;;;EAMnB,MAAM,aAAa,eAAe;AAChC,OAAI,CAAC,QAAA,MACH,QAAO,EAAC;AAEV,UACE,QAAA,MAAM,QACL,cAAc,QAAA,MAAM,IAAI,QAAQ,OAAO,QAAA,MAAM,MAAM,EAAE,QACtD,EAAC;IAEJ;;;;;EAMD,MAAM,2BAA2B,eACzB,WAAW,MAAM,SAAS,uBAClC;EAEA,MAAM,sBAAsB,eAC1B,yBAAyB,QACrB,wBACA,WAAW,MAAM,OACvB;EAEA,MAAM,oBAAoB,eACxB,WAAW,MAAM,MAAM,GAAG,oBAAoB,MAAM,CACtD;EAEA,MAAM,mBAAmB,eACvB,WAAW,MAAM,MAAM,oBAAoB,MAAM,CACnD;;;;;EAMA,MAAM,2BACJ,WACA,UACuB;GACvB,MAAM,eACJ,QAAA,QAAQ,yBAAyB,QAAA,QAAQ;AAE3C,OAAI,CAAC,aACH;AAGF,OAAI,MAAM,QAAQ,aAAa,CAC7B,QAAO,aAAa;AAGtB,OAAI,OAAO,iBAAiB,YAAY,iBAAiB,KACvD,QAAQ,aAAwC,OAAO,UAAU;;;;;;EAUrE,MAAM,2BAA2B,WAAgB,UAA0B;GACzE,MAAM,WAAW,QAAA,QAAQ,sBAAsB,QAAA,QAAQ;GACvD,MAAM,UAAU,MAAM,QAAQ,SAAS,GAAG,SAAS,SAAS,KAAA;AAC5D,UAAO,UACH,GAAG,YAAY,WAAW,GAAG,aAAa,YAC1C,OAAO,UAAS;;;;;EAMtB,MAAM,aAAa,IAAI,MAAK;EAE5B,MAAM,uBAAuB;AAC3B,cAAW,QAAQ,CAAC,WAAW;;;UAMvB,WAAA,MAAW,SAAM,KAAA,WAAA,EADzB,mBA+CM,OA/CN,YA+CM,CA3CI,QAAA,iBAAA,WAAA,EADR,mBAIM,OAJN,YAEuC,mBAEvC,KAAA,WAAA,EACA,mBAIM,OAJN,YAEuC,WAEvC,GACA,mBAiCK,MAjCL,YAiCK;sBA/BH,mBAIuD,UAAA,MAAA,WAHxB,kBAAA,QAArB,WAAW,UAAK;yBAD1B,YAIuD,gCAAA;MAFpD,KAAK,OAAO,UAAS;MACrB,aAAa,wBAAwB,WAAW,MAAK;MACrD,OAAO,wBAAwB,WAAW,MAAK;;;IAGlC,yBAAA,SAA4B,WAAA,SAAA,UAAA,KAAA,EAC1C,mBAQM,UAAA,EAAA,KAAA,GAAA,EAAA,WAPyB,iBAAA,QAArB,WAAW,UAAK;yBAD1B,YAQM,gCAAA;MANH,KAAK,OAAO,UAAS;MACrB,aAA0B,wBAAwB,WAAW,oBAAA,QAAsB,MAAK;MAGxF,OAAoB,wBAAwB,WAAW,oBAAA,QAAsB,MAAK;;;IAM7E,yBAAA,SAAA,WAAA,EAAV,mBAUK,MAAA,YAAA,CATH,YAQe,MAAA,aAAA,EAAA;KAPb,OAAM;KACN,SAAQ;KACP,SAAO;;4BAGU,CAFlB,YAEkB,MAAA,eAAA,EAAA;MADf,OAAK,eAAA,EAAA,aAAiB,WAAA,OAAU,CAAA;MACjC,QAAO;6CAAS,MAClB,gBAAG,WAAA,QAAU,gBAAA,kBAAA,EAAA,EAAA,CAAA,CAAA"}
+{"version":3,"file":"SchemaEnums.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaEnums.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIconPlus } from '@scalar/icons'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed, ref } from 'vue'\n\nimport SchemaEnumPropertyItem from './SchemaEnumPropertyItem.vue'\n\nconst { value } = 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}>()\n\nconst ENUM_DISPLAY_THRESHOLD = 9\nconst INITIAL_VISIBLE_COUNT = 5\nconst THIN_SPACE = '\\u2009'\n\n/**\n * Extracts enum values from the schema object.\n * Handles both direct enum values and nested enum arrays.\n */\nconst enumValues = computed(() => {\n  if (!value) {\n    return []\n  }\n  return (\n    value.enum ||\n    (isArraySchema(value) && resolve.schema(value.items)?.enum) ||\n    []\n  )\n})\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\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 descriptions =\n    value?.['x-enumDescriptions'] ?? value?.['x-enum-descriptions']\n\n  if (!descriptions) {\n    return undefined\n  }\n\n  if (Array.isArray(descriptions)) {\n    return descriptions[index]\n  }\n\n  if (typeof descriptions === 'object' && descriptions !== null) {\n    return (descriptions as Record<string, string>)[String(enumValue)]\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 = value?.['x-enum-varnames'] ?? 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=\"enumValues.length > 0\"\n    class=\"property-enum\">\n    <div\n      v-if=\"propertyNames\"\n      class=\"property-enum-property-names\">\n      property names\n    </div>\n    <div\n      v-else\n      class=\"property-enum-property-names\">\n      values\n    </div>\n    <ul class=\"property-enum-values\">\n      <!-- Visible enum values -->\n      <SchemaEnumPropertyItem\n        v-for=\"(enumValue, index) in visibleEnumValues\"\n        :key=\"String(enumValue)\"\n        :description=\"getEnumValueDescription(enumValue, index)\"\n        :label=\"formatEnumValueWithName(enumValue, index)\" />\n\n      <!-- Hidden enum values (when expanded) -->\n      <template v-if=\"shouldUseLongListDisplay && isExpanded\">\n        <SchemaEnumPropertyItem\n          v-for=\"(enumValue, index) in hiddenEnumValues\"\n          :key=\"String(enumValue)\"\n          :description=\"\n            getEnumValueDescription(enumValue, initialVisibleCount + index)\n          \"\n          :label=\"\n            formatEnumValueWithName(enumValue, initialVisibleCount + index)\n          \" />\n      </template>\n\n      <!-- Toggle button for long lists -->\n      <li v-if=\"shouldUseLongListDisplay\">\n        <ScalarButton\n          class=\"enum-toggle-button my-2 flex h-fit gap-1 rounded-full border py-1.5 pr-2.5 pl-2 leading-none\"\n          variant=\"ghost\"\n          @click=\"toggleExpanded\">\n          <ScalarIconPlus\n            :class=\"{ 'rotate-45': isExpanded }\"\n            weight=\"bold\" />\n          {{ isExpanded ? 'Hide values' : 'Show all values' }}\n        </ScalarButton>\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.property-enum-values {\n  font-size: var(--scalar-font-size-3);\n  list-style: none;\n  margin-top: 8px;\n  padding-left: 2px;\n}\n\n.enum-toggle-button:hover {\n  color: var(--scalar-color-1);\n}\n\n.property-enum-property-names {\n  font-size: var(--scalar-font-size-4);\n  color: var(--scalar-color-2);\n  display: inline-block;\n  padding: 0 2px;\n  margin-top: 8px;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAiBA,IAAM,yBAAyB;AAC/B,IAAM,wBAAwB;AAC9B,IAAM,aAAa;;;;;;;;;;;;EAMnB,MAAM,aAAa,eAAe;AAChC,OAAI,CAAC,QAAA,MACH,QAAO,EAAC;AAEV,UACE,QAAA,MAAM,QACL,cAAc,QAAA,MAAM,IAAI,QAAQ,OAAO,QAAA,MAAM,MAAM,EAAE,QACtD,EAAC;IAEJ;;;;;EAMD,MAAM,2BAA2B,eACzB,WAAW,MAAM,SAAS,uBAClC;EAEA,MAAM,sBAAsB,eAC1B,yBAAyB,QACrB,wBACA,WAAW,MAAM,OACvB;EAEA,MAAM,oBAAoB,eACxB,WAAW,MAAM,MAAM,GAAG,oBAAoB,MAAM,CACtD;EAEA,MAAM,mBAAmB,eACvB,WAAW,MAAM,MAAM,oBAAoB,MAAM,CACnD;;;;;EAMA,MAAM,2BACJ,WACA,UACuB;GACvB,MAAM,eACJ,QAAA,QAAQ,yBAAyB,QAAA,QAAQ;AAE3C,OAAI,CAAC,aACH;AAGF,OAAI,MAAM,QAAQ,aAAa,CAC7B,QAAO,aAAa;AAGtB,OAAI,OAAO,iBAAiB,YAAY,iBAAiB,KACvD,QAAQ,aAAwC,OAAO,UAAU;;;;;;EAUrE,MAAM,2BAA2B,WAAgB,UAA0B;GACzE,MAAM,WAAW,QAAA,QAAQ,sBAAsB,QAAA,QAAQ;GACvD,MAAM,UAAU,MAAM,QAAQ,SAAS,GAAG,SAAS,SAAS,KAAA;AAC5D,UAAO,UACH,GAAG,YAAY,WAAW,GAAG,aAAa,YAC1C,OAAO,UAAS;;;;;EAMtB,MAAM,aAAa,IAAI,MAAK;EAE5B,MAAM,uBAAuB;AAC3B,cAAW,QAAQ,CAAC,WAAW;;;UAMvB,WAAA,MAAW,SAAM,KAAA,WAAA,EADzB,mBA+CM,OA/CN,YA+CM,CA3CI,QAAA,iBAAA,WAAA,EADR,mBAIM,OAJN,YAEuC,mBAEvC,KAAA,WAAA,EACA,mBAIM,OAJN,YAEuC,WAEvC,GACA,mBAiCK,MAjCL,YAiCK;sBA/BH,mBAIuD,UAAA,MAAA,WAHxB,kBAAA,QAArB,WAAW,UAAK;yBAD1B,YAIuD,gCAAA;MAFpD,KAAK,OAAO,UAAS;MACrB,aAAa,wBAAwB,WAAW,MAAK;MACrD,OAAO,wBAAwB,WAAW,MAAK;;;IAGlC,yBAAA,SAA4B,WAAA,SAAA,UAAA,KAAA,EAC1C,mBAQM,UAAA,EAAA,KAAA,GAAA,EAAA,WAPyB,iBAAA,QAArB,WAAW,UAAK;yBAD1B,YAQM,gCAAA;MANH,KAAK,OAAO,UAAS;MACrB,aAA0B,wBAAwB,WAAW,oBAAA,QAAsB,MAAK;MAGxF,OAAoB,wBAAwB,WAAW,oBAAA,QAAsB,MAAK;;;IAM7E,yBAAA,SAAA,WAAA,EAAV,mBAUK,MAAA,YAAA,CATH,YAQe,MAAA,aAAA,EAAA;KAPb,OAAM;KACN,SAAQ;KACP,SAAO;;4BAGU,CAFlB,YAEkB,MAAA,eAAA,EAAA;MADf,OAAK,eAAA,EAAA,aAAiB,WAAA,OAAU,CAAA;MACjC,QAAO;6CAAS,MAClB,gBAAG,WAAA,QAAU,gBAAA,kBAAA,EAAA,EAAA,CAAA,CAAA"}

package/dist/components/Content/Schema/SchemaHeading.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import SchemaHeading_vue_vue_type_script_setup_true_lang_default from "./SchemaHeading.vue.script.js";
 /* empty css                            */
 //#region src/components/Content/Schema/SchemaHeading.vue
-var SchemaHeading_default = /* @__PURE__ */ _plugin_vue_export_helper_default(SchemaHeading_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-70cb5c13"]]);
+var SchemaHeading_default = /* @__PURE__ */ _plugin_vue_export_helper_default(SchemaHeading_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-78e7c684"]]);
 //#endregion
 export { SchemaHeading_default as default };
 

package/dist/components/Content/Schema/SchemaHeading.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaHeading.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaHeading.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarWrappingText } from '@scalar/components'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed } from 'vue'\n\nimport { isTypeObject } from '@/components/Content/Schema/helpers/is-type-object'\n\nconst { value } = defineProps<{\n  value: SchemaObject\n  name?: string\n}>()\n\n/** Generate a failsafe type from the properties when we don't have one */\nconst failsafeType = computed(() => {\n  if ('type' in value) {\n    return value.type\n  }\n\n  if (value.enum) {\n    return 'enum'\n  }\n\n  if (isArraySchema(value) && value.items) {\n    return 'array'\n  }\n\n  if (isTypeObject(value) && (value.properties || value.additionalProperties)) {\n    return 'object'\n  }\n\n  return 'unknown'\n})\n</script>\n\n<template>\n  <span\n    v-if=\"typeof value === 'object'\"\n    class=\"schema-type\">\n    <span\n      class=\"schema-type-icon\"\n      :title=\"\n        'type' in value && typeof value.type === 'string'\n          ? value.type\n          : 'type' in value && Array.isArray(value.type)\n            ? value.type.join(' | ')\n            : 'unknown type'\n      \">\n      <template v-if=\"isTypeObject(value)\"> {} </template>\n      <template v-if=\"isArraySchema(value)\"> [] </template>\n      <template v-if=\"value.enum\"> enum </template>\n    </span>\n    <template v-if=\"name\">\n      <ScalarWrappingText\n        :text=\"name\"\n        preset=\"property\" />\n    </template>\n    <template v-else>\n      {{ failsafeType }}\n    </template>\n  </span>\n</template>\n<style scoped>\n/* Style the \"icon\" */\n.schema-type-icon {\n  color: var(--scalar-color-1);\n  display: none;\n}\n.schema-type {\n  font-family: var(--scalar-font-code);\n  color: var(--scalar-color-1);\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"SchemaHeading.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaHeading.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarWrappingText } from '@scalar/components/wrapping-text'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed } from 'vue'\n\nimport { isTypeObject } from '@/components/Content/Schema/helpers/is-type-object'\n\nconst { value } = defineProps<{\n  value: SchemaObject\n  name?: string\n}>()\n\n/** Generate a failsafe type from the properties when we don't have one */\nconst failsafeType = computed(() => {\n  if ('type' in value) {\n    return value.type\n  }\n\n  if (value.enum) {\n    return 'enum'\n  }\n\n  if (isArraySchema(value) && value.items) {\n    return 'array'\n  }\n\n  if (isTypeObject(value) && (value.properties || value.additionalProperties)) {\n    return 'object'\n  }\n\n  return 'unknown'\n})\n</script>\n\n<template>\n  <span\n    v-if=\"typeof value === 'object'\"\n    class=\"schema-type\">\n    <span\n      class=\"schema-type-icon\"\n      :title=\"\n        'type' in value && typeof value.type === 'string'\n          ? value.type\n          : 'type' in value && Array.isArray(value.type)\n            ? value.type.join(' | ')\n            : 'unknown type'\n      \">\n      <template v-if=\"isTypeObject(value)\"> {} </template>\n      <template v-if=\"isArraySchema(value)\"> [] </template>\n      <template v-if=\"value.enum\"> enum </template>\n    </span>\n    <template v-if=\"name\">\n      <ScalarWrappingText\n        :text=\"name\"\n        preset=\"property\" />\n    </template>\n    <template v-else>\n      {{ failsafeType }}\n    </template>\n  </span>\n</template>\n<style scoped>\n/* Style the \"icon\" */\n.schema-type-icon {\n  color: var(--scalar-color-1);\n  display: none;\n}\n.schema-type {\n  font-family: var(--scalar-font-code);\n  color: var(--scalar-color-1);\n}\n</style>\n"],"mappings":""}

package/dist/components/Content/Schema/SchemaHeading.vue.script.js

@@ -1,6 +1,6 @@
 import { isTypeObject } from "./helpers/is-type-object.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, openBlock, toDisplayString, unref } from "vue";
-import { ScalarWrappingText } from "@scalar/components";
+import { ScalarWrappingText } from "@scalar/components/wrapping-text";
 import { isArraySchema } from "@scalar/workspace-store/schemas/v3.1/strict/type-guards";
 //#region src/components/Content/Schema/SchemaHeading.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = {

package/dist/components/Content/Schema/SchemaHeading.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaHeading.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaHeading.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarWrappingText } from '@scalar/components'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed } from 'vue'\n\nimport { isTypeObject } from '@/components/Content/Schema/helpers/is-type-object'\n\nconst { value } = defineProps<{\n  value: SchemaObject\n  name?: string\n}>()\n\n/** Generate a failsafe type from the properties when we don't have one */\nconst failsafeType = computed(() => {\n  if ('type' in value) {\n    return value.type\n  }\n\n  if (value.enum) {\n    return 'enum'\n  }\n\n  if (isArraySchema(value) && value.items) {\n    return 'array'\n  }\n\n  if (isTypeObject(value) && (value.properties || value.additionalProperties)) {\n    return 'object'\n  }\n\n  return 'unknown'\n})\n</script>\n\n<template>\n  <span\n    v-if=\"typeof value === 'object'\"\n    class=\"schema-type\">\n    <span\n      class=\"schema-type-icon\"\n      :title=\"\n        'type' in value && typeof value.type === 'string'\n          ? value.type\n          : 'type' in value && Array.isArray(value.type)\n            ? value.type.join(' | ')\n            : 'unknown type'\n      \">\n      <template v-if=\"isTypeObject(value)\"> {} </template>\n      <template v-if=\"isArraySchema(value)\"> [] </template>\n      <template v-if=\"value.enum\"> enum </template>\n    </span>\n    <template v-if=\"name\">\n      <ScalarWrappingText\n        :text=\"name\"\n        preset=\"property\" />\n    </template>\n    <template v-else>\n      {{ failsafeType }}\n    </template>\n  </span>\n</template>\n<style scoped>\n/* Style the \"icon\" */\n.schema-type-icon {\n  color: var(--scalar-color-1);\n  display: none;\n}\n.schema-type {\n  font-family: var(--scalar-font-code);\n  color: var(--scalar-color-1);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAcA,MAAM,eAAe,eAAe;AAClC,OAAI,UAAU,QAAA,MACZ,QAAO,QAAA,MAAM;AAGf,OAAI,QAAA,MAAM,KACR,QAAO;AAGT,OAAI,cAAc,QAAA,MAAM,IAAI,QAAA,MAAM,MAChC,QAAO;AAGT,OAAI,aAAa,QAAA,MAAM,KAAK,QAAA,MAAM,cAAc,QAAA,MAAM,sBACpD,QAAO;AAGT,UAAO;IACR;;iBAKgB,QAAA,UAAK,YAAA,WAAA,EADpB,mBAwBO,QAxBP,YAwBO,CArBL,mBAYO,QAAA;IAXL,OAAM;IACL,OAAA,UAA0B,QAAA,SAAK,OAAW,QAAA,MAAM,SAAI,WAA0B,QAAA,MAAM,OAAA,UAA2B,QAAA,SAAS,MAAM,QAAQ,QAAA,MAAM,KAAI,GAAgB,QAAA,MAAM,KAAK,KAAI,MAAA,GAAA;;IAOhK,MAAA,aAAY,CAAC,QAAA,MAAK,IAAA,WAAA,EAAlC,mBAAoD,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAf,OAAI,CAAA,EAAA,GAAA,IAAA,mBAAA,IAAA,KAAA;IACzB,MAAA,cAAa,CAAC,QAAA,MAAK,IAAA,WAAA,EAAnC,mBAAqD,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAf,OAAI,CAAA,EAAA,GAAA,IAAA,mBAAA,IAAA,KAAA;IAC1B,QAAA,MAAM,QAAA,WAAA,EAAtB,mBAA6C,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAjB,SAAM,CAAA,EAAA,GAAA,IAAA,mBAAA,IAAA,KAAA;sBAEpB,QAAA,QAAA,WAAA,EACd,YAEsB,MAAA,mBAAA,EAAA;;IADnB,MAAM,QAAA;IACP,QAAO;0CAEX,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,aAAA,MAAY,EAAA,EAAA,CAAA,EAAA,GAAA,EAAA,CAAA,IAAA,mBAAA,IAAA,KAAA"}
+{"version":3,"file":"SchemaHeading.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaHeading.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarWrappingText } from '@scalar/components/wrapping-text'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed } from 'vue'\n\nimport { isTypeObject } from '@/components/Content/Schema/helpers/is-type-object'\n\nconst { value } = defineProps<{\n  value: SchemaObject\n  name?: string\n}>()\n\n/** Generate a failsafe type from the properties when we don't have one */\nconst failsafeType = computed(() => {\n  if ('type' in value) {\n    return value.type\n  }\n\n  if (value.enum) {\n    return 'enum'\n  }\n\n  if (isArraySchema(value) && value.items) {\n    return 'array'\n  }\n\n  if (isTypeObject(value) && (value.properties || value.additionalProperties)) {\n    return 'object'\n  }\n\n  return 'unknown'\n})\n</script>\n\n<template>\n  <span\n    v-if=\"typeof value === 'object'\"\n    class=\"schema-type\">\n    <span\n      class=\"schema-type-icon\"\n      :title=\"\n        'type' in value && typeof value.type === 'string'\n          ? value.type\n          : 'type' in value && Array.isArray(value.type)\n            ? value.type.join(' | ')\n            : 'unknown type'\n      \">\n      <template v-if=\"isTypeObject(value)\"> {} </template>\n      <template v-if=\"isArraySchema(value)\"> [] </template>\n      <template v-if=\"value.enum\"> enum </template>\n    </span>\n    <template v-if=\"name\">\n      <ScalarWrappingText\n        :text=\"name\"\n        preset=\"property\" />\n    </template>\n    <template v-else>\n      {{ failsafeType }}\n    </template>\n  </span>\n</template>\n<style scoped>\n/* Style the \"icon\" */\n.schema-type-icon {\n  color: var(--scalar-color-1);\n  display: none;\n}\n.schema-type {\n  font-family: var(--scalar-font-code);\n  color: var(--scalar-color-1);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAcA,MAAM,eAAe,eAAe;AAClC,OAAI,UAAU,QAAA,MACZ,QAAO,QAAA,MAAM;AAGf,OAAI,QAAA,MAAM,KACR,QAAO;AAGT,OAAI,cAAc,QAAA,MAAM,IAAI,QAAA,MAAM,MAChC,QAAO;AAGT,OAAI,aAAa,QAAA,MAAM,KAAK,QAAA,MAAM,cAAc,QAAA,MAAM,sBACpD,QAAO;AAGT,UAAO;IACR;;iBAKgB,QAAA,UAAK,YAAA,WAAA,EADpB,mBAwBO,QAxBP,YAwBO,CArBL,mBAYO,QAAA;IAXL,OAAM;IACL,OAAA,UAA0B,QAAA,SAAK,OAAW,QAAA,MAAM,SAAI,WAA0B,QAAA,MAAM,OAAA,UAA2B,QAAA,SAAS,MAAM,QAAQ,QAAA,MAAM,KAAI,GAAgB,QAAA,MAAM,KAAK,KAAI,MAAA,GAAA;;IAOhK,MAAA,aAAY,CAAC,QAAA,MAAK,IAAA,WAAA,EAAlC,mBAAoD,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAf,OAAI,CAAA,EAAA,GAAA,IAAA,mBAAA,IAAA,KAAA;IACzB,MAAA,cAAa,CAAC,QAAA,MAAK,IAAA,WAAA,EAAnC,mBAAqD,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAf,OAAI,CAAA,EAAA,GAAA,IAAA,mBAAA,IAAA,KAAA;IAC1B,QAAA,MAAM,QAAA,WAAA,EAAtB,mBAA6C,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAjB,SAAM,CAAA,EAAA,GAAA,IAAA,mBAAA,IAAA,KAAA;sBAEpB,QAAA,QAAA,WAAA,EACd,YAEsB,MAAA,mBAAA,EAAA;;IADnB,MAAM,QAAA;IACP,QAAO;0CAEX,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,aAAA,MAAY,EAAA,EAAA,CAAA,EAAA,GAAA,EAAA,CAAA,IAAA,mBAAA,IAAA,KAAA"}

package/dist/components/Content/Schema/SchemaObjectExampleCodeBlock.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaObjectExampleCodeBlock.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaObjectExampleCodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ExamplePicker } from '@scalar/api-client/blocks/operation-code-sample'\nimport {\n  ScalarCard,\n  ScalarCardFooter,\n  ScalarCardSection,\n  ScalarCodeBlock,\n} from '@scalar/components'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref } from 'vue'\n\nconst { schema } = defineProps<{ schema: SchemaObject }>()\n\n/** Grab the examples for the schema object */\nconst examples = computed<Record<string, string>>(() => {\n  const base: Record<string, string> = {}\n\n  // x-examples extension\n  if (schema['x-examples']) {\n    Object.entries(schema['x-examples']).forEach(([key, value]) => {\n      base[key] =\n        typeof value === 'object'\n          ? JSON.stringify(value, null, 2)\n          : String(value)\n    })\n  }\n\n  // Regular schema examples array\n  if (schema.examples) {\n    schema.examples.forEach((value, index) => {\n      base[`Example ${index + 1}`] =\n        typeof value === 'object'\n          ? JSON.stringify(value, null, 2)\n          : String(value)\n    })\n  }\n\n  return base\n})\n\n/** The currently selected example key */\nconst selectedExampleKey = ref<string>(Object.keys(examples.value)[0] ?? '')\n</script>\n<template>\n  <ScalarCard\n    v-if=\"Object.keys(examples).length > 0\"\n    class=\"dark-mode\">\n    <!-- Code snippet -->\n    <ScalarCardSection>\n      <div class=\"code-snippet\">\n        <ScalarCodeBlock\n          class=\"bg-b-2\"\n          lang=\"json\"\n          lineNumbers\n          :prettyPrintedContent=\"\n            examples[selectedExampleKey] ??\n            'There was an error loading the example'\n          \" />\n      </div>\n    </ScalarCardSection>\n\n    <!-- Example picker -->\n    <ScalarCardFooter\n      v-if=\"Object.keys(examples).length > 1\"\n      class=\"bg-b-3\">\n      <ExamplePicker\n        v-model=\"selectedExampleKey\"\n        :examples />\n    </ScalarCardFooter>\n  </ScalarCard>\n</template>\n"],"mappings":""}
+{"version":3,"file":"SchemaObjectExampleCodeBlock.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaObjectExampleCodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ExamplePicker } from '@scalar/api-client/blocks/operation-code-sample'\nimport {\n  ScalarCard,\n  ScalarCardFooter,\n  ScalarCardSection,\n} from '@scalar/components/card'\nimport { ScalarCodeBlock } from '@scalar/components/code-block'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref } from 'vue'\n\nconst { schema } = defineProps<{ schema: SchemaObject }>()\n\n/** Grab the examples for the schema object */\nconst examples = computed<Record<string, string>>(() => {\n  const base: Record<string, string> = {}\n\n  // x-examples extension\n  if (schema['x-examples']) {\n    Object.entries(schema['x-examples']).forEach(([key, value]) => {\n      base[key] =\n        typeof value === 'object'\n          ? JSON.stringify(value, null, 2)\n          : String(value)\n    })\n  }\n\n  // Regular schema examples array\n  if (schema.examples) {\n    schema.examples.forEach((value, index) => {\n      base[`Example ${index + 1}`] =\n        typeof value === 'object'\n          ? JSON.stringify(value, null, 2)\n          : String(value)\n    })\n  }\n\n  return base\n})\n\n/** The currently selected example key */\nconst selectedExampleKey = ref<string>(Object.keys(examples.value)[0] ?? '')\n</script>\n<template>\n  <ScalarCard\n    v-if=\"Object.keys(examples).length > 0\"\n    class=\"dark-mode\">\n    <!-- Code snippet -->\n    <ScalarCardSection>\n      <div class=\"code-snippet\">\n        <ScalarCodeBlock\n          class=\"bg-b-2\"\n          lang=\"json\"\n          lineNumbers\n          :prettyPrintedContent=\"\n            examples[selectedExampleKey] ??\n            'There was an error loading the example'\n          \" />\n      </div>\n    </ScalarCardSection>\n\n    <!-- Example picker -->\n    <ScalarCardFooter\n      v-if=\"Object.keys(examples).length > 1\"\n      class=\"bg-b-3\">\n      <ExamplePicker\n        v-model=\"selectedExampleKey\"\n        :examples />\n    </ScalarCardFooter>\n  </ScalarCard>\n</template>\n"],"mappings":""}

package/dist/components/Content/Schema/SchemaObjectExampleCodeBlock.vue.script.js

@@ -1,6 +1,7 @@
 import { computed, createBlock, createCommentVNode, createElementVNode, createVNode, defineComponent, openBlock, ref, unref, withCtx } from "vue";
-import { ScalarCard, ScalarCardFooter, ScalarCardSection, ScalarCodeBlock } from "@scalar/components";
 import { ExamplePicker } from "@scalar/api-client/blocks/operation-code-sample";
+import { ScalarCodeBlock } from "@scalar/components/code-block";
+import { ScalarCard, ScalarCardFooter, ScalarCardSection } from "@scalar/components/card";
 //#region src/components/Content/Schema/SchemaObjectExampleCodeBlock.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "code-snippet" };
 var SchemaObjectExampleCodeBlock_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({

package/dist/components/Content/Schema/SchemaObjectExampleCodeBlock.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaObjectExampleCodeBlock.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaObjectExampleCodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ExamplePicker } from '@scalar/api-client/blocks/operation-code-sample'\nimport {\n  ScalarCard,\n  ScalarCardFooter,\n  ScalarCardSection,\n  ScalarCodeBlock,\n} from '@scalar/components'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref } from 'vue'\n\nconst { schema } = defineProps<{ schema: SchemaObject }>()\n\n/** Grab the examples for the schema object */\nconst examples = computed<Record<string, string>>(() => {\n  const base: Record<string, string> = {}\n\n  // x-examples extension\n  if (schema['x-examples']) {\n    Object.entries(schema['x-examples']).forEach(([key, value]) => {\n      base[key] =\n        typeof value === 'object'\n          ? JSON.stringify(value, null, 2)\n          : String(value)\n    })\n  }\n\n  // Regular schema examples array\n  if (schema.examples) {\n    schema.examples.forEach((value, index) => {\n      base[`Example ${index + 1}`] =\n        typeof value === 'object'\n          ? JSON.stringify(value, null, 2)\n          : String(value)\n    })\n  }\n\n  return base\n})\n\n/** The currently selected example key */\nconst selectedExampleKey = ref<string>(Object.keys(examples.value)[0] ?? '')\n</script>\n<template>\n  <ScalarCard\n    v-if=\"Object.keys(examples).length > 0\"\n    class=\"dark-mode\">\n    <!-- Code snippet -->\n    <ScalarCardSection>\n      <div class=\"code-snippet\">\n        <ScalarCodeBlock\n          class=\"bg-b-2\"\n          lang=\"json\"\n          lineNumbers\n          :prettyPrintedContent=\"\n            examples[selectedExampleKey] ??\n            'There was an error loading the example'\n          \" />\n      </div>\n    </ScalarCardSection>\n\n    <!-- Example picker -->\n    <ScalarCardFooter\n      v-if=\"Object.keys(examples).length > 1\"\n      class=\"bg-b-3\">\n      <ExamplePicker\n        v-model=\"selectedExampleKey\"\n        :examples />\n    </ScalarCardFooter>\n  </ScalarCard>\n</template>\n"],"mappings":";;;;;;;;;;EAcA,MAAM,WAAW,eAAuC;GACtD,MAAM,OAA+B,EAAC;AAGtC,OAAI,QAAA,OAAO,cACT,QAAO,QAAQ,QAAA,OAAO,cAAc,CAAC,SAAS,CAAC,KAAK,WAAW;AAC7D,SAAK,OACH,OAAO,UAAU,WACb,KAAK,UAAU,OAAO,MAAM,EAAC,GAC7B,OAAO,MAAK;KACnB;AAIH,OAAI,QAAA,OAAO,SACT,SAAA,OAAO,SAAS,SAAS,OAAO,UAAU;AACxC,SAAK,WAAW,QAAQ,OACtB,OAAO,UAAU,WACb,KAAK,UAAU,OAAO,MAAM,EAAC,GAC7B,OAAO,MAAK;KACnB;AAGH,UAAO;IACR;;EAGD,MAAM,qBAAqB,IAAY,OAAO,KAAK,SAAS,MAAM,CAAC,MAAM,GAAE;;UAIjE,OAAO,KAAK,SAAA,MAAQ,CAAE,SAAM,KAAA,WAAA,EADpC,YAyBa,MAAA,WAAA,EAAA;;IAvBX,OAAM;;2BAac,CAXpB,YAWoB,MAAA,kBAAA,EAAA,MAAA;4BADZ,CATN,mBASM,OATN,YASM,CARJ,YAOM,MAAA,gBAAA,EAAA;MANJ,OAAM;MACN,MAAK;MACL,aAAA;MACC,sBAAmC,SAAA,MAAS,mBAAA,UAAA;;;QAS3C,OAAO,KAAK,SAAA,MAAQ,CAAE,SAAM,KAAA,WAAA,EADpC,YAMmB,MAAA,iBAAA,EAAA;;KAJjB,OAAM;;4BAGQ,CAFd,YAEc,MAAA,cAAA,EAAA;kBADH,mBAAA;sFAAkB,QAAA;MAC1B,UAAA,SAAA"}
+{"version":3,"file":"SchemaObjectExampleCodeBlock.vue.script.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaObjectExampleCodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ExamplePicker } from '@scalar/api-client/blocks/operation-code-sample'\nimport {\n  ScalarCard,\n  ScalarCardFooter,\n  ScalarCardSection,\n} from '@scalar/components/card'\nimport { ScalarCodeBlock } from '@scalar/components/code-block'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref } from 'vue'\n\nconst { schema } = defineProps<{ schema: SchemaObject }>()\n\n/** Grab the examples for the schema object */\nconst examples = computed<Record<string, string>>(() => {\n  const base: Record<string, string> = {}\n\n  // x-examples extension\n  if (schema['x-examples']) {\n    Object.entries(schema['x-examples']).forEach(([key, value]) => {\n      base[key] =\n        typeof value === 'object'\n          ? JSON.stringify(value, null, 2)\n          : String(value)\n    })\n  }\n\n  // Regular schema examples array\n  if (schema.examples) {\n    schema.examples.forEach((value, index) => {\n      base[`Example ${index + 1}`] =\n        typeof value === 'object'\n          ? JSON.stringify(value, null, 2)\n          : String(value)\n    })\n  }\n\n  return base\n})\n\n/** The currently selected example key */\nconst selectedExampleKey = ref<string>(Object.keys(examples.value)[0] ?? '')\n</script>\n<template>\n  <ScalarCard\n    v-if=\"Object.keys(examples).length > 0\"\n    class=\"dark-mode\">\n    <!-- Code snippet -->\n    <ScalarCardSection>\n      <div class=\"code-snippet\">\n        <ScalarCodeBlock\n          class=\"bg-b-2\"\n          lang=\"json\"\n          lineNumbers\n          :prettyPrintedContent=\"\n            examples[selectedExampleKey] ??\n            'There was an error loading the example'\n          \" />\n      </div>\n    </ScalarCardSection>\n\n    <!-- Example picker -->\n    <ScalarCardFooter\n      v-if=\"Object.keys(examples).length > 1\"\n      class=\"bg-b-3\">\n      <ExamplePicker\n        v-model=\"selectedExampleKey\"\n        :examples />\n    </ScalarCardFooter>\n  </ScalarCard>\n</template>\n"],"mappings":";;;;;;;;;;;EAcA,MAAM,WAAW,eAAuC;GACtD,MAAM,OAA+B,EAAC;AAGtC,OAAI,QAAA,OAAO,cACT,QAAO,QAAQ,QAAA,OAAO,cAAc,CAAC,SAAS,CAAC,KAAK,WAAW;AAC7D,SAAK,OACH,OAAO,UAAU,WACb,KAAK,UAAU,OAAO,MAAM,EAAC,GAC7B,OAAO,MAAK;KACnB;AAIH,OAAI,QAAA,OAAO,SACT,SAAA,OAAO,SAAS,SAAS,OAAO,UAAU;AACxC,SAAK,WAAW,QAAQ,OACtB,OAAO,UAAU,WACb,KAAK,UAAU,OAAO,MAAM,EAAC,GAC7B,OAAO,MAAK;KACnB;AAGH,UAAO;IACR;;EAGD,MAAM,qBAAqB,IAAY,OAAO,KAAK,SAAS,MAAM,CAAC,MAAM,GAAE;;UAIjE,OAAO,KAAK,SAAA,MAAQ,CAAE,SAAM,KAAA,WAAA,EADpC,YAyBa,MAAA,WAAA,EAAA;;IAvBX,OAAM;;2BAac,CAXpB,YAWoB,MAAA,kBAAA,EAAA,MAAA;4BADZ,CATN,mBASM,OATN,YASM,CARJ,YAOM,MAAA,gBAAA,EAAA;MANJ,OAAM;MACN,MAAK;MACL,aAAA;MACC,sBAAmC,SAAA,MAAS,mBAAA,UAAA;;;QAS3C,OAAO,KAAK,SAAA,MAAQ,CAAE,SAAM,KAAA,WAAA,EADpC,YAMmB,MAAA,iBAAA,EAAA;;KAJjB,OAAM;;4BAGQ,CAFd,YAEc,MAAA,cAAA,EAAA;kBADH,mBAAA;sFAAkB,QAAA;MAC1B,UAAA,SAAA"}

package/dist/components/Content/Schema/SchemaProperty.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaProperty.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Content/Schema/SchemaProperty.vue"],"names":[],"mappings":"AAseA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEvE,OAAO,KAAK,EACV,mBAAmB,EACnB,YAAY,EACb,MAAM,8DAA8D,CAAA;AAErE,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,KAAK,CAAA;AAI9C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAA;AAetE;;;;;GAKG;AAEH,KAAK,WAAW,GAAG;IACf,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACvB,MAAM,EAAE,YAAY,GAAG,SAAS,CAAA;IAChC,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,aAAa,CAAC,EAAE,mBAAmB,CAAA;IACnC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,kGAAkG;IAClG,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,OAAO,CAAC,EAAE,sBAAsB,GAAG,mBAAmB,CAAA;IACtD,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAA;IAClC,OAAO,EAAE,aAAa,CAAA;IACtB,+EAA+E;IAC/E,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAA;IAC5B,mFAAmF;IACnF,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,uFAAuF;IACvF,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,oFAAoF;IACpF,sBAAsB,CAAC,EAAE,MAAM,CAAA;CAChC,CAAC;AAwgBJ,QAAA,MAAM,YAAY;WA9hBN,MAAM;cAEH,OAAO;aACR,OAAO;oBAGA,OAAO;6EA2hB1B,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"SchemaProperty.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Content/Schema/SchemaProperty.vue"],"names":[],"mappings":"AAweA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEvE,OAAO,KAAK,EACV,mBAAmB,EACnB,YAAY,EACb,MAAM,8DAA8D,CAAA;AAErE,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,KAAK,CAAA;AAI9C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAA;AAetE;;;;;GAKG;AAEH,KAAK,WAAW,GAAG;IACf,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACvB,MAAM,EAAE,YAAY,GAAG,SAAS,CAAA;IAChC,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,aAAa,CAAC,EAAE,mBAAmB,CAAA;IACnC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,kGAAkG;IAClG,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,OAAO,CAAC,EAAE,sBAAsB,GAAG,mBAAmB,CAAA;IACtD,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAA;IAClC,OAAO,EAAE,aAAa,CAAA;IACtB,+EAA+E;IAC/E,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAA;IAC5B,mFAAmF;IACnF,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,uFAAuF;IACvF,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,oFAAoF;IACpF,sBAAsB,CAAC,EAAE,MAAM,CAAA;CAChC,CAAC;AAwgBJ,QAAA,MAAM,YAAY;WA9hBN,MAAM;cAEH,OAAO;aACR,OAAO;oBAGA,OAAO;6EA2hB1B,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/Content/Schema/SchemaProperty.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import SchemaProperty_vue_vue_type_script_setup_true_lang_default from "./SchemaProperty.vue.script.js";
 /* empty css                             */
 //#region src/components/Content/Schema/SchemaProperty.vue
-var SchemaProperty_default = /* @__PURE__ */ _plugin_vue_export_helper_default(SchemaProperty_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-c8e3c666"]]);
+var SchemaProperty_default = /* @__PURE__ */ _plugin_vue_export_helper_default(SchemaProperty_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-f0cfe514"]]);
 //#endregion
 export { SchemaProperty_default as default };
 

package/dist/components/Content/Schema/SchemaProperty.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"SchemaProperty.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaProperty.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarMarkdown, ScalarWrappingText } from '@scalar/components'\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.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed, type Component } from 'vue'\n\nimport { WithBreadcrumb } from '@/components/Anchor'\nimport { isTypeObject } from '@/components/Content/Schema/helpers/is-type-object'\nimport type { SchemaOptions } from '@/components/Content/Schema/types'\nimport { SpecificationExtension } from '@/features/specification-extension'\n\nimport { getCompositionsToRender } from './helpers/get-compositions-to-render'\nimport { getEnumValues } from './helpers/get-enum-values'\nimport { getPropertyDescription } from './helpers/get-property-description'\nimport { hasComplexArrayItems } from './helpers/has-complex-array-items'\nimport { optimizeValueForDisplay } from './helpers/optimize-value-for-display'\nimport { shouldDisplayDescription } from './helpers/should-display-description'\nimport { shouldDisplayHeading } from './helpers/should-display-heading'\nimport Schema from './Schema.vue'\nimport SchemaComposition from './SchemaComposition.vue'\nimport SchemaEnums from './SchemaEnums.vue'\nimport SchemaPropertyHeading from './SchemaPropertyHeading.vue'\n\n/**\n * Note: We're taking in a prop called `value` which should be a JSON Schema.\n *\n * We're using `optimizeValueForDisplay` to merge null types in compositions (anyOf, allOf, oneOf, not).\n * So you should basically use the optimizedValue everywhere in the component.\n */\n\nconst props = withDefaults(\n  defineProps<{\n    is?: string | Component\n    schema: SchemaObject | undefined\n    noncollapsible?: boolean\n    level?: number\n    name?: string\n    required?: boolean\n    compact?: boolean\n    discriminator?: DiscriminatorObject\n    description?: string\n    hideModelNames?: boolean\n    hideHeading?: boolean\n    /** When the root schema was resolved from a $ref, pass the ref name for display (e.g. \"Data\"). */\n    modelName?: string | null\n    variant?: 'additionalProperties' | 'patternProperties'\n    breadcrumb?: string[]\n    eventBus: WorkspaceEventBus | null\n    options: SchemaOptions\n    /** Enum values for property names (from JSON Schema propertyNames keyword). */\n    propertyNamesEnum?: string[]\n    /** When \"requestBody\", composition selection is synced 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    /** Internal path segment for this property when building nested composition keys */\n    compositionPathSegment?: string\n  }>(),\n  {\n    level: 0,\n    required: false,\n    compact: false,\n    hideModelNames: false,\n  },\n)\n\n/** Simplified composition with `null` type. */\nconst optimizedValue = computed(() => optimizeValueForDisplay(props.schema))\n\nconst childBreadcrumb = computed<string[] | undefined>(() =>\n  props.breadcrumb && props.name\n    ? [...props.breadcrumb, props.name]\n    : undefined,\n)\n\nconst currentCompositionPath = computed<string[]>(() =>\n  props.compositionPathSegment\n    ? [...(props.compositionPath ?? []), props.compositionPathSegment]\n    : (props.compositionPath ?? []),\n)\n\nconst arrayItemsCompositionPath = computed<string[]>(() => [\n  ...currentCompositionPath.value,\n  'items',\n])\n\nconst shouldHaveLink = computed(() => props.level <= 2)\n\n/** Checks if array items have complex structure */\nconst hasComplexArrayItemsComputed = computed(() =>\n  hasComplexArrayItems(optimizedValue.value),\n)\n\n/** Check if enum should be displayed (from value schema or from propertyNames) */\nconst hasEnum = computed(() => enumValues.value.length > 0)\n\n/** Determine if object properties should be displayed */\nconst shouldRenderObjectProperties = computed(() => {\n  const value = optimizedValue.value\n  if (!value) {\n    return false\n  }\n\n  return (\n    isTypeObject(value) &&\n    ('properties' in value || 'additionalProperties' in value)\n  )\n})\n\n/** Determine if array of objects should be rendered */\nconst shouldRenderArrayOfObjects = computed(() => {\n  const value = optimizedValue.value\n  if (!value || !isArraySchema(value) || typeof value.items !== 'object') {\n    return false\n  }\n\n  return hasComplexArrayItemsComputed.value\n})\n\n/** Extract enum values from schema or array items */\nconst enumValues = computed(() => getEnumValues(optimizedValue.value))\n\n/** Generate property description from type/format */\nconst propertyDescription = computed(() =>\n  getPropertyDescription(optimizedValue.value),\n)\n\n/** Determine if description should be displayed */\nconst displayDescription = computed(() =>\n  shouldDisplayDescription(optimizedValue.value, props.description),\n)\n\n/**\n * When the property already renders the description, avoid repeating it in the nested object schema card.\n */\nconst objectSchemaForChildren = computed(() => {\n  const value = optimizedValue.value\n  if (!value || !displayDescription.value || !('description' in value)) {\n    return value\n  }\n\n  const { description: _description, ...schemaWithoutDescription } = value\n  return schemaWithoutDescription as SchemaObject\n})\n\n/** Determine if property heading should be displayed */\nconst shouldDisplayHeadingComputed = computed(() =>\n  shouldDisplayHeading(optimizedValue.value, props.name, props.required),\n)\n\n/** Computes which compositions should be rendered and with which values */\nconst compositionsToRender = computed(() =>\n  getCompositionsToRender(optimizedValue.value),\n)\n\n/** Get resolved array items for rendering */\nconst resolvedArrayItems = computed(() => {\n  const value = optimizedValue.value\n  if (!value || !isArraySchema(value) || typeof value.items !== 'object') {\n    return undefined\n  }\n  return resolve.schema(value.items)\n})\n\n/** Check if discriminator matches current property */\nconst isDiscriminatorProperty = computed(() =>\n  Boolean(props.name && props.discriminator?.propertyName === props.name),\n)\n</script>\n<template>\n  <component\n    :is=\"is ?? 'li'\"\n    class=\"property\"\n    :class=\"[\n      `property--level-${level}`,\n      {\n        'property--compact': compact,\n        'property--deprecated': optimizedValue?.deprecated,\n      },\n    ]\">\n    <SchemaPropertyHeading\n      v-if=\"shouldDisplayHeadingComputed\"\n      class=\"group\"\n      :enum=\"hasEnum\"\n      :eventBus=\"eventBus\"\n      :hideModelNames\n      :isDiscriminator=\"isDiscriminatorProperty\"\n      :modelName=\"modelName\"\n      :required\n      :value=\"optimizedValue\">\n      <template\n        v-if=\"name\"\n        #name>\n        <WithBreadcrumb\n          :breadcrumb=\"shouldHaveLink ? childBreadcrumb : undefined\"\n          :eventBus=\"eventBus\">\n          <span\n            v-if=\"variant === 'patternProperties'\"\n            class=\"property-name-pattern-properties\">\n            <ScalarWrappingText\n              preset=\"property\"\n              :text=\"name\" />\n          </span>\n          <span\n            v-else-if=\"variant === 'additionalProperties'\"\n            class=\"property-name-additional-properties\">\n            <ScalarWrappingText\n              preset=\"property\"\n              :text=\"name\" />\n          </span>\n          <ScalarWrappingText\n            v-else\n            preset=\"property\"\n            :text=\"name\" />\n        </WithBreadcrumb>\n      </template>\n      <template\n        v-if=\"optimizedValue?.example !== undefined\"\n        #example>\n        Example:\n        {{ optimizedValue.example }}\n      </template>\n    </SchemaPropertyHeading>\n\n    <!-- Description -->\n    <div\n      v-if=\"displayDescription || propertyDescription\"\n      class=\"property-description\">\n      <ScalarMarkdown\n        :value=\"displayDescription || propertyDescription || ''\" />\n    </div>\n\n    <!-- Enum for property names -->\n    <SchemaEnums\n      v-if=\"propertyNamesEnum && propertyNamesEnum.length > 0\"\n      propertyNames\n      :value=\"{ enum: propertyNamesEnum } as SchemaObject\" />\n\n    <!-- Enum values -->\n    <SchemaEnums\n      v-if=\"enumValues.length > 0\"\n      :value=\"optimizedValue\" />\n\n    <!-- Object -->\n    <div\n      v-if=\"shouldRenderObjectProperties\"\n      class=\"children\">\n      <Schema\n        :breadcrumb=\"childBreadcrumb\"\n        :compact=\"compact\"\n        :compositionPath=\"currentCompositionPath\"\n        :eventBus=\"eventBus\"\n        :hideModelNames\n        :level=\"level + 1\"\n        :name=\"name\"\n        :noncollapsible=\"noncollapsible\"\n        :options=\"options\"\n        :schema=\"objectSchemaForChildren\"\n        :schemaContext=\"schemaContext\" />\n    </div>\n\n    <!-- Array of objects or nested arrays -->\n    <div\n      v-if=\"shouldRenderArrayOfObjects && resolvedArrayItems\"\n      class=\"children\">\n      <Schema\n        :compact=\"compact\"\n        :compositionPath=\"arrayItemsCompositionPath\"\n        :eventBus=\"eventBus\"\n        :hideModelNames\n        :level=\"level + 1\"\n        :name=\"name\"\n        :noncollapsible=\"noncollapsible\"\n        :options=\"options\"\n        :schema=\"resolve.schema(resolvedArrayItems)\"\n        :schemaContext=\"schemaContext\" />\n    </div>\n\n    <!-- Compositions -->\n    <SchemaComposition\n      v-for=\"compositionData in compositionsToRender\"\n      :key=\"compositionData.composition\"\n      :breadcrumb=\"breadcrumb\"\n      :compact=\"compact\"\n      :composition=\"compositionData.composition\"\n      :compositionPath=\"currentCompositionPath\"\n      :discriminator=\"schema?.discriminator\"\n      :eventBus=\"eventBus\"\n      :hideHeading=\"hideHeading\"\n      :hideModelNames\n      :level=\"level\"\n      :name=\"name\"\n      :noncollapsible=\"noncollapsible\"\n      :options=\"options\"\n      :schema=\"compositionData.value\"\n      :schemaContext=\"schemaContext\" />\n    <SpecificationExtension :value=\"optimizedValue\" />\n  </component>\n</template>\n\n<style scoped>\n.property {\n  color: var(--scalar-color-1);\n  display: flex;\n  flex-direction: column;\n  padding: 10px;\n  font-size: var(--scalar-small);\n  position: relative;\n}\n\n/** Remove top padding for top level schema card */\n.property.property--level-0:has(\n    > .property-rule\n      > .schema-card\n      > .schema-properties.schema-properties-open\n      > ul\n      > li.property\n  ) {\n  padding-top: 0;\n}\n\n.property--compact.property--level-0,\n.property--compact.property--level-1 {\n  padding: 10px 0;\n}\n\n.composition-panel .property.property.property.property--level-0 {\n  padding: 0px;\n}\n\n.property--compact.property--level-0\n  .composition-panel\n  .property--compact.property--level-1 {\n  padding: 8px;\n}\n\n/*  if a property doesn't have a heading, remove the top padding */\n.property:has(> .property-rule:nth-of-type(1)):not(.property--compact) {\n  padding-top: 8px;\n  padding-bottom: 8px;\n}\n\n.property--deprecated {\n  background: repeating-linear-gradient(\n    -45deg,\n    var(--scalar-background-2) 0,\n    var(--scalar-background-2) 2px,\n    transparent 2px,\n    transparent 5px\n  );\n  background-size: 100%;\n}\n\n.property--deprecated > * {\n  opacity: 0.75;\n}\n\n.property-description {\n  margin-top: 6px;\n  line-height: 1.4;\n  font-size: var(--scalar-small);\n}\n\n.property-description:has(+ .property-rule) {\n  margin-bottom: 9px;\n}\n\n:deep(.property-description) * {\n  color: var(--scalar-color-2) !important;\n}\n\n.property:not(:last-of-type) {\n  border-bottom: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n\n.property-description + .children,\n.children + .property-rule {\n  margin-top: 9px;\n}\n\n.children {\n  display: flex;\n  flex-direction: column;\n}\n\n.children .property--compact.property--level-1 {\n  padding: 12px;\n}\n\n.property-example-value {\n  all: unset;\n  font-family: var(--scalar-font-code);\n  padding: 6px;\n  border-top: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n\n.property-rule {\n  border-radius: var(--scalar-radius-lg);\n  display: flex;\n  flex-direction: column;\n}\n\n.property--level-2 :deep(.relative > button) {\n  left: -2rem;\n}\n\n.property-rule\n  :deep(\n    .composition-panel\n      .schema-card--level-1\n      > .schema-properties.schema-properties-open\n  ) {\n  border-radius: 0 0 var(--scalar-radius-lg) var(--scalar-radius-lg);\n}\n\n.property-rule\n  :deep(.composition-panel > .schema-card > .schema-card-description) {\n  padding: 10px;\n  border-left: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-right: var(--scalar-border-width) solid var(--scalar-border-color);\n\n  & + .schema-properties {\n    margin-top: 0;\n  }\n}\n\n.property-example {\n  background: transparent;\n  border: none;\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n}\n\n.property-example-label,\n.property-example-value {\n  padding: 3px 0 0 0;\n}\n\n.property-example-value {\n  background: var(--scalar-background-2);\n  border-top: 0;\n  border-radius: var(--scalar-radius);\n  padding: 3px 4px;\n}\n\n.property-name {\n  font-family: var(--scalar-font-code);\n  font-weight: var(--scalar-semibold);\n}\n\n.property-name-additional-properties::before,\n.property-name-pattern-properties::before {\n  text-transform: uppercase;\n  font-size: var(--scalar-micro);\n  display: inline-block;\n  padding: 2px 4px;\n  border-radius: var(--scalar-radius);\n  color: var(--scalar-color-1);\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n  background-color: var(--scalar-background-2);\n  margin-right: 4px;\n}\n\n.property-name-pattern-properties::before {\n  content: 'regex';\n}\n\n.property-name-additional-properties,\n.property-name-pattern-properties {\n  border: 1px dashed var(--scalar-border-color);\n  color: var(--scalar-color-accent);\n  display: inline-block;\n  padding: 2px;\n  border-radius: var(--scalar-radius);\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"SchemaProperty.vue.js","names":[],"sources":["../../../../src/components/Content/Schema/SchemaProperty.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarMarkdown } from '@scalar/components/markdown'\nimport { ScalarWrappingText } from '@scalar/components/wrapping-text'\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.1/strict/openapi-document'\nimport { isArraySchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed, type Component } from 'vue'\n\nimport { WithBreadcrumb } from '@/components/Anchor'\nimport { isTypeObject } from '@/components/Content/Schema/helpers/is-type-object'\nimport type { SchemaOptions } from '@/components/Content/Schema/types'\nimport { SpecificationExtension } from '@/features/specification-extension'\n\nimport { getCompositionsToRender } from './helpers/get-compositions-to-render'\nimport { getEnumValues } from './helpers/get-enum-values'\nimport { getPropertyDescription } from './helpers/get-property-description'\nimport { hasComplexArrayItems } from './helpers/has-complex-array-items'\nimport { optimizeValueForDisplay } from './helpers/optimize-value-for-display'\nimport { shouldDisplayDescription } from './helpers/should-display-description'\nimport { shouldDisplayHeading } from './helpers/should-display-heading'\nimport Schema from './Schema.vue'\nimport SchemaComposition from './SchemaComposition.vue'\nimport SchemaEnums from './SchemaEnums.vue'\nimport SchemaPropertyHeading from './SchemaPropertyHeading.vue'\n\n/**\n * Note: We're taking in a prop called `value` which should be a JSON Schema.\n *\n * We're using `optimizeValueForDisplay` to merge null types in compositions (anyOf, allOf, oneOf, not).\n * So you should basically use the optimizedValue everywhere in the component.\n */\n\nconst props = withDefaults(\n  defineProps<{\n    is?: string | Component\n    schema: SchemaObject | undefined\n    noncollapsible?: boolean\n    level?: number\n    name?: string\n    required?: boolean\n    compact?: boolean\n    discriminator?: DiscriminatorObject\n    description?: string\n    hideModelNames?: boolean\n    hideHeading?: boolean\n    /** When the root schema was resolved from a $ref, pass the ref name for display (e.g. \"Data\"). */\n    modelName?: string | null\n    variant?: 'additionalProperties' | 'patternProperties'\n    breadcrumb?: string[]\n    eventBus: WorkspaceEventBus | null\n    options: SchemaOptions\n    /** Enum values for property names (from JSON Schema propertyNames keyword). */\n    propertyNamesEnum?: string[]\n    /** When \"requestBody\", composition selection is synced 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    /** Internal path segment for this property when building nested composition keys */\n    compositionPathSegment?: string\n  }>(),\n  {\n    level: 0,\n    required: false,\n    compact: false,\n    hideModelNames: false,\n  },\n)\n\n/** Simplified composition with `null` type. */\nconst optimizedValue = computed(() => optimizeValueForDisplay(props.schema))\n\nconst childBreadcrumb = computed<string[] | undefined>(() =>\n  props.breadcrumb && props.name\n    ? [...props.breadcrumb, props.name]\n    : undefined,\n)\n\nconst currentCompositionPath = computed<string[]>(() =>\n  props.compositionPathSegment\n    ? [...(props.compositionPath ?? []), props.compositionPathSegment]\n    : (props.compositionPath ?? []),\n)\n\nconst arrayItemsCompositionPath = computed<string[]>(() => [\n  ...currentCompositionPath.value,\n  'items',\n])\n\nconst shouldHaveLink = computed(() => props.level <= 2)\n\n/** Checks if array items have complex structure */\nconst hasComplexArrayItemsComputed = computed(() =>\n  hasComplexArrayItems(optimizedValue.value),\n)\n\n/** Check if enum should be displayed (from value schema or from propertyNames) */\nconst hasEnum = computed(() => enumValues.value.length > 0)\n\n/** Determine if object properties should be displayed */\nconst shouldRenderObjectProperties = computed(() => {\n  const value = optimizedValue.value\n  if (!value) {\n    return false\n  }\n\n  return (\n    isTypeObject(value) &&\n    ('properties' in value || 'additionalProperties' in value)\n  )\n})\n\n/** Determine if array of objects should be rendered */\nconst shouldRenderArrayOfObjects = computed(() => {\n  const value = optimizedValue.value\n  if (!value || !isArraySchema(value) || typeof value.items !== 'object') {\n    return false\n  }\n\n  return hasComplexArrayItemsComputed.value\n})\n\n/** Extract enum values from schema or array items */\nconst enumValues = computed(() => getEnumValues(optimizedValue.value))\n\n/** Generate property description from type/format */\nconst propertyDescription = computed(() =>\n  getPropertyDescription(optimizedValue.value),\n)\n\n/** Determine if description should be displayed */\nconst displayDescription = computed(() =>\n  shouldDisplayDescription(optimizedValue.value, props.description),\n)\n\n/**\n * When the property already renders the description, avoid repeating it in the nested object schema card.\n */\nconst objectSchemaForChildren = computed(() => {\n  const value = optimizedValue.value\n  if (!value || !displayDescription.value || !('description' in value)) {\n    return value\n  }\n\n  const { description: _description, ...schemaWithoutDescription } = value\n  return schemaWithoutDescription as SchemaObject\n})\n\n/** Determine if property heading should be displayed */\nconst shouldDisplayHeadingComputed = computed(() =>\n  shouldDisplayHeading(optimizedValue.value, props.name, props.required),\n)\n\n/** Computes which compositions should be rendered and with which values */\nconst compositionsToRender = computed(() =>\n  getCompositionsToRender(optimizedValue.value),\n)\n\n/** Get resolved array items for rendering */\nconst resolvedArrayItems = computed(() => {\n  const value = optimizedValue.value\n  if (!value || !isArraySchema(value) || typeof value.items !== 'object') {\n    return undefined\n  }\n  return resolve.schema(value.items)\n})\n\n/** Check if discriminator matches current property */\nconst isDiscriminatorProperty = computed(() =>\n  Boolean(props.name && props.discriminator?.propertyName === props.name),\n)\n</script>\n<template>\n  <component\n    :is=\"is ?? 'li'\"\n    class=\"property\"\n    :class=\"[\n      `property--level-${level}`,\n      {\n        'property--compact': compact,\n        'property--deprecated': optimizedValue?.deprecated,\n      },\n    ]\">\n    <SchemaPropertyHeading\n      v-if=\"shouldDisplayHeadingComputed\"\n      class=\"group\"\n      :enum=\"hasEnum\"\n      :eventBus=\"eventBus\"\n      :hideModelNames\n      :isDiscriminator=\"isDiscriminatorProperty\"\n      :modelName=\"modelName\"\n      :required\n      :value=\"optimizedValue\">\n      <template\n        v-if=\"name\"\n        #name>\n        <WithBreadcrumb\n          :breadcrumb=\"shouldHaveLink ? childBreadcrumb : undefined\"\n          :eventBus=\"eventBus\">\n          <span\n            v-if=\"variant === 'patternProperties'\"\n            class=\"property-name-pattern-properties\">\n            <ScalarWrappingText\n              preset=\"property\"\n              :text=\"name\" />\n          </span>\n          <span\n            v-else-if=\"variant === 'additionalProperties'\"\n            class=\"property-name-additional-properties\">\n            <ScalarWrappingText\n              preset=\"property\"\n              :text=\"name\" />\n          </span>\n          <ScalarWrappingText\n            v-else\n            preset=\"property\"\n            :text=\"name\" />\n        </WithBreadcrumb>\n      </template>\n      <template\n        v-if=\"optimizedValue?.example !== undefined\"\n        #example>\n        Example:\n        {{ optimizedValue.example }}\n      </template>\n    </SchemaPropertyHeading>\n\n    <!-- Description -->\n    <div\n      v-if=\"displayDescription || propertyDescription\"\n      class=\"property-description\">\n      <ScalarMarkdown\n        :value=\"displayDescription || propertyDescription || ''\" />\n    </div>\n\n    <!-- Enum for property names -->\n    <SchemaEnums\n      v-if=\"propertyNamesEnum && propertyNamesEnum.length > 0\"\n      propertyNames\n      :value=\"{ enum: propertyNamesEnum } as SchemaObject\" />\n\n    <!-- Enum values -->\n    <SchemaEnums\n      v-if=\"enumValues.length > 0\"\n      :value=\"optimizedValue\" />\n\n    <!-- Object -->\n    <div\n      v-if=\"shouldRenderObjectProperties\"\n      class=\"children\">\n      <Schema\n        :breadcrumb=\"childBreadcrumb\"\n        :compact=\"compact\"\n        :compositionPath=\"currentCompositionPath\"\n        :eventBus=\"eventBus\"\n        :hideModelNames\n        :level=\"level + 1\"\n        :name=\"name\"\n        :noncollapsible=\"noncollapsible\"\n        :options=\"options\"\n        :schema=\"objectSchemaForChildren\"\n        :schemaContext=\"schemaContext\" />\n    </div>\n\n    <!-- Array of objects or nested arrays -->\n    <div\n      v-if=\"shouldRenderArrayOfObjects && resolvedArrayItems\"\n      class=\"children\">\n      <Schema\n        :compact=\"compact\"\n        :compositionPath=\"arrayItemsCompositionPath\"\n        :eventBus=\"eventBus\"\n        :hideModelNames\n        :level=\"level + 1\"\n        :name=\"name\"\n        :noncollapsible=\"noncollapsible\"\n        :options=\"options\"\n        :schema=\"resolve.schema(resolvedArrayItems)\"\n        :schemaContext=\"schemaContext\" />\n    </div>\n\n    <!-- Compositions -->\n    <SchemaComposition\n      v-for=\"compositionData in compositionsToRender\"\n      :key=\"compositionData.composition\"\n      :breadcrumb=\"breadcrumb\"\n      :compact=\"compact\"\n      :composition=\"compositionData.composition\"\n      :compositionPath=\"currentCompositionPath\"\n      :discriminator=\"schema?.discriminator\"\n      :eventBus=\"eventBus\"\n      :hideHeading=\"hideHeading\"\n      :hideModelNames\n      :level=\"level\"\n      :name=\"name\"\n      :noncollapsible=\"noncollapsible\"\n      :options=\"options\"\n      :schema=\"compositionData.value\"\n      :schemaContext=\"schemaContext\" />\n    <SpecificationExtension :value=\"optimizedValue\" />\n  </component>\n</template>\n\n<style scoped>\n.property {\n  color: var(--scalar-color-1);\n  display: flex;\n  flex-direction: column;\n  padding: 10px;\n  font-size: var(--scalar-small);\n  position: relative;\n}\n\n/** Remove top padding for top level schema card */\n.property.property--level-0:has(\n    > .property-rule\n      > .schema-card\n      > .schema-properties.schema-properties-open\n      > ul\n      > li.property\n  ) {\n  padding-top: 0;\n}\n\n.property--compact.property--level-0,\n.property--compact.property--level-1 {\n  padding: 10px 0;\n}\n\n.composition-panel .property.property.property.property--level-0 {\n  padding: 0px;\n}\n\n.property--compact.property--level-0\n  .composition-panel\n  .property--compact.property--level-1 {\n  padding: 8px;\n}\n\n/*  if a property doesn't have a heading, remove the top padding */\n.property:has(> .property-rule:nth-of-type(1)):not(.property--compact) {\n  padding-top: 8px;\n  padding-bottom: 8px;\n}\n\n.property--deprecated {\n  background: repeating-linear-gradient(\n    -45deg,\n    var(--scalar-background-2) 0,\n    var(--scalar-background-2) 2px,\n    transparent 2px,\n    transparent 5px\n  );\n  background-size: 100%;\n}\n\n.property--deprecated > * {\n  opacity: 0.75;\n}\n\n.property-description {\n  margin-top: 6px;\n  line-height: 1.4;\n  font-size: var(--scalar-small);\n}\n\n.property-description:has(+ .property-rule) {\n  margin-bottom: 9px;\n}\n\n:deep(.property-description) * {\n  color: var(--scalar-color-2) !important;\n}\n\n.property:not(:last-of-type) {\n  border-bottom: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n\n.property-description + .children,\n.children + .property-rule {\n  margin-top: 9px;\n}\n\n.children {\n  display: flex;\n  flex-direction: column;\n}\n\n.children .property--compact.property--level-1 {\n  padding: 12px;\n}\n\n.property-example-value {\n  all: unset;\n  font-family: var(--scalar-font-code);\n  padding: 6px;\n  border-top: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n\n.property-rule {\n  border-radius: var(--scalar-radius-lg);\n  display: flex;\n  flex-direction: column;\n}\n\n.property--level-2 :deep(.relative > button) {\n  left: -2rem;\n}\n\n.property-rule\n  :deep(\n    .composition-panel\n      .schema-card--level-1\n      > .schema-properties.schema-properties-open\n  ) {\n  border-radius: 0 0 var(--scalar-radius-lg) var(--scalar-radius-lg);\n}\n\n.property-rule\n  :deep(.composition-panel > .schema-card > .schema-card-description) {\n  padding: 10px;\n  border-left: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-right: var(--scalar-border-width) solid var(--scalar-border-color);\n\n  & + .schema-properties {\n    margin-top: 0;\n  }\n}\n\n.property-example {\n  background: transparent;\n  border: none;\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n}\n\n.property-example-label,\n.property-example-value {\n  padding: 3px 0 0 0;\n}\n\n.property-example-value {\n  background: var(--scalar-background-2);\n  border-top: 0;\n  border-radius: var(--scalar-radius);\n  padding: 3px 4px;\n}\n\n.property-name {\n  font-family: var(--scalar-font-code);\n  font-weight: var(--scalar-semibold);\n}\n\n.property-name-additional-properties::before,\n.property-name-pattern-properties::before {\n  text-transform: uppercase;\n  font-size: var(--scalar-micro);\n  display: inline-block;\n  padding: 2px 4px;\n  border-radius: var(--scalar-radius);\n  color: var(--scalar-color-1);\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n  background-color: var(--scalar-background-2);\n  margin-right: 4px;\n}\n\n.property-name-pattern-properties::before {\n  content: 'regex';\n}\n\n.property-name-additional-properties,\n.property-name-pattern-properties {\n  border: 1px dashed var(--scalar-border-color);\n  color: var(--scalar-color-accent);\n  display: inline-block;\n  padding: 2px;\n  border-radius: var(--scalar-radius);\n}\n</style>\n"],"mappings":""}