@scalar/api-reference 0.1.23 → 0.1.24

package/dist/components/ApiClientModal.vue.d.ts

@@ -1,6 +1,6 @@
 import { type Spec } from '../types';
 export { useApiClientStore } from '@scalar/api-client';
-declare const _default: import("vue").DefineComponent<{
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     spec: {
         type: import("vue").PropType<Spec>;
         required: true;
@@ -8,6 +8,12 @@ declare const _default: import("vue").DefineComponent<{
     overloadShow: {
         type: import("vue").PropType<boolean>;
     };
+    tabMode: {
+        type: import("vue").PropType<boolean>;
+    };
+    activeTab: {
+        type: import("vue").PropType<string>;
+    };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     spec: {
         type: import("vue").PropType<Spec>;
@@ -16,6 +22,20 @@ declare const _default: import("vue").DefineComponent<{
     overloadShow: {
         type: import("vue").PropType<boolean>;
     };
-}>>, {}, {}>;
+    tabMode: {
+        type: import("vue").PropType<boolean>;
+    };
+    activeTab: {
+        type: import("vue").PropType<string>;
+    };
+}>>, {}, {}>, {
+    header?(_: {}): any;
+    "active-tab"?(_: {}): any;
+}>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
 //# sourceMappingURL=ApiClientModal.vue.d.ts.map

package/dist/components/ApiClientModal.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ApiClientModal.vue.d.ts","sourceRoot":"","sources":["../../src/components/ApiClientModal.vue.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,UAAU,CAAA;AAIpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;;;;;;;;;;;;;;;;;;AACtD,wBAwJ8C"}
+{"version":3,"file":"ApiClientModal.vue.d.ts","sourceRoot":"","sources":["../../src/components/ApiClientModal.vue.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,UAAU,CAAA;AAIpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBA4KzB,GAAG;0BACG,GAAG;;AA5KtC,wBA4L0G;AAG1G,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAAE,QAAO;QAClD,MAAM,EAAE,CAAC,CAAC;KACT,CAAA;CAAE,CAAC"}

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+import '../../theme/scrollbar.css';
 export { default as ApiClientModal, useApiClientStore } from './components/ApiClientModal.vue';
 export { default as ApiReference } from './components/ApiReference.vue';
 export { default as Sidebar } from './components/Sidebar.vue';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AAC9F,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,+BAA+B,CAAA;AACvE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAC7D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,kCAAkC,CAAA;AAE/E,cAAc,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,2BAA2B,CAAA;AAClC,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AAC9F,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,+BAA+B,CAAA;AACvE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAC7D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,kCAAkC,CAAA;AAE/E,cAAc,SAAS,CAAA"}

package/dist/index.js

@@ -11,6 +11,7 @@ import typographicBase from "typographic-base";
 import { unified } from "unified";
 let ApiClientModal, _sfc_main, Content, _sfc_main$o, useApiClientStore;
 let __tla = (async () => {
+  const scrollbar = "";
   const DefaultBufferLength = 1024;
   let nextPropID = 0;
   let Range$1 = class Range {
@@ -45230,7 +45231,11 @@ ${closingBraceIndent}]`;
       spec: {},
       overloadShow: {
         type: Boolean
-      }
+      },
+      tabMode: {
+        type: Boolean
+      },
+      activeTab: {}
     },
     setup(__props) {
       const { hideApiClient: hideApiClient2, state: state2 } = useApiClientStore();
@@ -45241,12 +45246,30 @@ ${closingBraceIndent}]`;
           unref(state2).showApiClient || _ctx.overloadShow ? (openBlock(), createElementBlock("div", _hoisted_1$j, [
             createElementVNode("div", _hoisted_2$g, [
               createElementVNode("div", _hoisted_3$c, [
+                renderSlot(_ctx.$slots, "header", {}, void 0, true),
                 createElementVNode("div", _hoisted_4$9, [
-                  withDirectives(createVNode$1(_sfc_main$o, {
+                  _ctx.tabMode ? (openBlock(), createElementBlock(Fragment$1, {
+                    key: 0
+                  }, [
+                    _ctx.activeTab === "sidebar" ? withDirectives((openBlock(), createBlock(_sfc_main$o, {
+                      key: 0,
+                      spec: _ctx.spec
+                    }, null, 8, [
+                      "spec"
+                    ])), [
+                      [
+                        vShow,
+                        !unref(isMobile)
+                      ]
+                    ]) : renderSlot(_ctx.$slots, "active-tab", {
+                      key: 1
+                    }, void 0, true)
+                  ], 64)) : withDirectives((openBlock(), createBlock(_sfc_main$o, {
+                    key: 1,
                     spec: _ctx.spec
                   }, null, 8, [
                     "spec"
-                  ]), [
+                  ])), [
                     [
                       vShow,
                       !unref(isMobile)
@@ -45272,11 +45295,11 @@ ${closingBraceIndent}]`;
       };
     }
   });
-  const ApiClientModal_vue_vue_type_style_index_0_scoped_457b261c_lang = "";
+  const ApiClientModal_vue_vue_type_style_index_0_scoped_de2869cd_lang = "";
   ApiClientModal = _export_sfc(_sfc_main$n, [
     [
       "__scopeId",
-      "data-v-457b261c"
+      "data-v-de2869cd"
     ]
   ]);
   const Card_vue_vue_type_style_index_0_scoped_632b8afa_lang = "";

package/dist/style.css

@@ -1,3 +1,70 @@
+.cm-scroller,
+.custom-scroll {
+  overflow-y: scroll;
+  scrollbar-color: transparent transparent;
+  scrollbar-width: thin;
+  -webkit-overflow-scrolling: touch;
+}
+.custom-scroll-self-contain-overflow {
+  overscroll-behavior: contain;
+}
+.custom-scroll-extra-padding-right {
+  padding-right: 12px !important;
+}
+@supports (-moz-appearance: none) {
+  .cm-scroller,
+  .custom-scroll {
+    padding-right: 12px;
+  }
+  .custom-scroll-extra-padding-right {
+    padding-right: 24px !important;
+  }
+}
+.cm-scroller:hover,
+.custom-scroll:hover {
+  scrollbar-color: var(--theme-scrollbar-color) transparent;
+}
+.cm-scroller:hover::-webkit-scrollbar-thumb,
+.custom-scroll:hover::-webkit-scrollbar-thumb {
+  background: var(--theme-scrollbar-color);
+  background-clip: content-box;
+  border: 3px solid transparent;
+}
+.cm-scroller::-webkit-scrollbar-thumb:active,
+.custom-scroll::-webkit-scrollbar-thumb:active {
+  background: var(--theme-scrollbar-color-active);
+  background-clip: content-box;
+  border: 3px solid transparent;
+}
+.cm-scroller::-webkit-scrollbar-corner,
+.custom-scroll::-webkit-scrollbar-corner {
+  background: transparent;
+}
+.cm-scroller::-webkit-scrollbar,
+.custom-scroll::-webkit-scrollbar {
+  height: 12px;
+  width: 12px;
+}
+.cm-scroller::-webkit-scrollbar-track,
+.custom-scroll::-webkit-scrollbar-track {
+  background: transparent;
+}
+.cm-scroller::-webkit-scrollbar-thumb,
+.custom-scroll::-webkit-scrollbar-thumb {
+  border-radius: 20px;
+  background: transparent;
+  background-clip: content-box;
+  border: 3px solid transparent;
+}
+@media (pointer: coarse) {
+  .cm-scroller,
+  .custom-scroll {
+    padding-right: 12px;
+  }
+  .custom-scroll-extra-padding-right {
+    padding-right: 24px !important;
+  }
+}
 
 .sidebar-search[data-v-5005eb5e] {
   display: flex;
@@ -460,10 +527,10 @@ to {
 }
 }
 
-.scalar-api-client__container .scalar-api-client[data-v-457b261c] {
+.scalar-api-client__container .scalar-api-client[data-v-de2869cd] {
   width: calc(100% - var(--scalar-api-reference-theme-sidebar-width));
 }
-.scalar-api-client__container[data-v-457b261c] {
+.scalar-api-client__container[data-v-de2869cd] {
   position: absolute;
   right: 0;
   left: 0;
@@ -484,11 +551,11 @@ to {
   flex-direction: column;
 }
 @media screen and (max-width: 1265px) {
-.scalar-api-client__container[data-v-457b261c] {
+.scalar-api-client__container[data-v-de2869cd] {
     width: 100vw !important;
 }
 }
-.scalar-api-client__navigation[data-v-457b261c] {
+.scalar-api-client__navigation[data-v-de2869cd] {
   width: 100%;
   display: flex;
   align-items: center;
@@ -500,7 +567,7 @@ to {
   border-bottom: 1px solid var(--theme-border-color);
   top: 0;
 }
-.scalar-api-client__close[data-v-457b261c] {
+.scalar-api-client__close[data-v-de2869cd] {
   appearance: none;
   border: none;
   outline: none;
@@ -511,7 +578,7 @@ to {
   color: var(--theme-color-1);
   font-weight: var(--theme-semibold);
 }
-.scalar-api-client__close[data-v-457b261c]:hover {
+.scalar-api-client__close[data-v-de2869cd]:hover {
   cursor: pointer;
 }
 /*
@@ -534,7 +601,7 @@ TODO: Markup is missing
   height: 12px;
   transform: rotate(180deg);
 } */
-.api-client-drawer[data-v-457b261c] {
+.api-client-drawer[data-v-de2869cd] {
   background: var(--theme-background-1);
   height: calc(100vh - 58px);
   width: calc(100vw - 8px);
@@ -546,9 +613,9 @@ TODO: Markup is missing
   left: 4px;
   z-index: 9999;
   opacity: 0;
-  animation: apiclientfadein-457b261c 0.35s forwards;
+  animation: apiclientfadein-de2869cd 0.35s forwards;
 }
-@keyframes apiclientfadein-457b261c {
+@keyframes apiclientfadein-de2869cd {
 from {
     transform: translate3d(0, 20px, 0) scale(0.985);
     opacity: 0;
@@ -558,7 +625,7 @@ to {
     opacity: 1;
 }
 }
-.api-client-drawer-exit[data-v-457b261c] {
+.api-client-drawer-exit[data-v-de2869cd] {
   position: fixed;
   top: 0;
   left: 0;
@@ -568,9 +635,9 @@ to {
   transition: all 0.3s ease-in-out;
   z-index: 9998;
   cursor: pointer;
-  animation: drawerexitfadein-457b261c 0.35s forwards;
+  animation: drawerexitfadein-de2869cd 0.35s forwards;
 }
-@keyframes drawerexitfadein-457b261c {
+@keyframes drawerexitfadein-de2869cd {
 from {
     opacity: 0;
 }
@@ -578,10 +645,10 @@ to {
     opacity: 1;
 }
 }
-.scalar-api-client-height[data-v-457b261c] {
+.scalar-api-client-height[data-v-de2869cd] {
   height: 100%;
 }
-.scalar-api-client-height .sidebar[data-v-457b261c] {
+.scalar-api-client-height .sidebar[data-v-de2869cd] {
   flex: 1 1 0%;
   flex-grow: 1;
   flex-shrink: 1;
@@ -1366,6 +1433,17 @@ to {
   
     --theme-font-medium: 500;
     --theme-font-bold: 700;
+    
+    /* let's clean these up please :) */
+    --scalar-api-reference-theme-header-height: 0;
+    --scalar-api-reference-theme-sidebar-width: 250px;
+    --scalar-api-reference-theme-toc-width: 250px;
+    --scalar-api-reference-app-header-height: 100px;
+    --scalar-api-reference-col-width-1: 250px;
+    --scalar-api-reference-col-width-2: calc(50% - 150px);
+    --scalar-api-reference-col-width-3: calc(50% - 150px);
+    --scalar-api-reference-document-height: 100vh;
+    --scalar-api-reference-full-height: 100%;
 }
 @media (max-width: 460px) {
 :root {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scalar/api-reference",
-  "version": "0.1.23",
+  "version": "0.1.24",
   "author": "Scalar",
   "license": "UNLICENSED",
   "engines": {
@@ -42,10 +42,10 @@
     "typographic-base": "1.0.4",
     "unified": "10.1.2",
     "xmldom": "0.6.0",
+    "@scalar/api-client": "0.1.17",
     "@scalar/swagger-editor": "0.1.12",
-    "@scalar/use-tooltip": "0.1.4",
     "@scalar/use-clipboard": "0.1.4",
-    "@scalar/api-client": "0.1.17"
+    "@scalar/use-tooltip": "0.1.4"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "4.2.3",