@michaelmishin/speclens 0.1.2 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  A modern, lightweight OpenAPI documentation renderer built as a web component. Drop it into any page via CDN — no build step required.
4
4
 
5
- > **Version:** 0.1.2
5
+ > **Version:** 0.2.0
6
6
 
7
7
  ## Features
8
8
 
@@ -44,6 +44,58 @@ SpecLens.init('#docs', {
44
44
  npm install @michaelmishin/speclens
45
45
  ```
46
46
 
47
+ ## Customization
48
+
49
+ ### Layout Modes
50
+
51
+ Use the `layout` attribute to control how SpecLens integrates with the surrounding page.
52
+
53
+ | Value | Behavior |
54
+ |-------|----------|
55
+ | `page` (default) | Renders its own sticky header with title, Authorize, and theme toggle. Best for standalone CDN use. |
56
+ | `embed` | Suppresses the header entirely. The sidebar starts at the top of the container, and an Authorize button appears at the bottom of the sidebar when the API has security schemes. Use this when embedding inside an existing app that already has a navbar. |
57
+
58
+ ```html
59
+ <!-- Standalone page -->
60
+ <spec-lens layout="page" spec-url="/openapi.json"></spec-lens>
61
+
62
+ <!-- Inside an existing app with its own navbar -->
63
+ <spec-lens layout="embed" spec-url="/openapi.json"></spec-lens>
64
+ ```
65
+
66
+ ### Named Slots (page mode)
67
+
68
+ In `layout="page"` mode, the header exposes two named slots for customization:
69
+
70
+ | Slot | Replaces |
71
+ |------|----------|
72
+ | `logo` | The API title + version badge in the header |
73
+ | `header-actions` | Additional items in the header action row, placed before the theme toggle |
74
+
75
+ ```html
76
+ <spec-lens spec-url="/openapi.json">
77
+ <!-- Replace the title/version with your own logo -->
78
+ <img slot="logo" src="/my-logo.svg" alt="My API" height="28" />
79
+
80
+ <!-- Add extra nav items next to the theme toggle -->
81
+ <a slot="header-actions" href="/changelog">Changelog</a>
82
+ </spec-lens>
83
+ ```
84
+
85
+ ### Programmatic Theme Control
86
+
87
+ In `layout="embed"` mode the theme toggle button is not visible. Use the `setTheme()` method or the `theme` attribute to control it from the host app:
88
+
89
+ ```js
90
+ const docs = document.querySelector('spec-lens');
91
+
92
+ // Programmatic method
93
+ docs.setTheme('dark'); // 'light' | 'dark' | 'auto'
94
+
95
+ // Or set the attribute
96
+ docs.setAttribute('theme', 'dark');
97
+ ```
98
+
47
99
  ## Theming
48
100
 
49
101
  SpecLens exposes CSS custom properties for theming from outside the Shadow DOM:
@@ -262,8 +262,10 @@ const _e=e=>(t,r)=>{void 0!==r?r.addInitializer(()=>{customElements.define(e,t)}
262
262
  </button>
263
263
 
264
264
  <div class="title-area">
265
- <span class="title">${this.spec.title}</span>
266
- <span class="version">${this.spec.version}</span>
265
+ <slot name="logo">
266
+ <span class="title">${this.spec.title}</span>
267
+ <span class="version">${this.spec.version}</span>
268
+ </slot>
267
269
  </div>
268
270
 
269
271
  <div class="spacer"></div>
@@ -282,6 +284,8 @@ const _e=e=>(t,r)=>{void 0!==r?r.addInitializer(()=>{customElements.define(e,t)}
282
284
  </button>
283
285
  `:null}
284
286
 
287
+ <slot name="header-actions"></slot>
288
+
285
289
  <button class="action-btn" @click=${()=>this.dispatchEvent(new CustomEvent("toggle-theme"))} title="Toggle theme">
286
290
  <svg width="18" height="18" viewBox="0 0 18 18" fill="none" stroke="currentColor" stroke-width="1.5">
287
291
  <circle cx="9" cy="9" r="4"/>
@@ -408,7 +412,7 @@ const _e=e=>(t,r)=>{void 0!==r?r.addInitializer(()=>{customElements.define(e,t)}
408
412
  border-color: var(--sl-color-primary-hover);
409
413
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.3);
410
414
  }
411
- `],np([je({type:Object})],op.prototype,"spec",2),np([je({type:Boolean})],op.prototype,"authOpen",2),op=np([_e("sl-header")],op);var sp=Object.defineProperty,ip=Object.getOwnPropertyDescriptor,ap=(e,t,r,n)=>{for(var o,s=n>1?void 0:n?ip(t,r):t,i=e.length-1;i>=0;i--)(o=e[i])&&(s=(n?o(t,r,s):o(s))||s);return n&&s&&sp(t,r,s),s};let lp=class extends xe{constructor(){super(...arguments),this.tagGroups=[],this.activeOperationId="",this.open=!1,this.searchEngine=null,this._searchQuery="",this._searchResults=[]}focusSearch(){var e;null==(e=this._searchInput)||e.focus()}_handleSearchInput(e){this._searchQuery=e.target.value,this.searchEngine&&this._searchQuery.trim()?this._searchResults=this.searchEngine.search(this._searchQuery).slice(0,30):this._searchResults=[]}_navigate(e){this._searchQuery="",this._searchResults=[],this.dispatchEvent(new CustomEvent("navigate",{detail:e})),this.dispatchEvent(new CustomEvent("close-sidebar"))}_navigateIntro(){this._searchQuery="",this._searchResults=[],this.dispatchEvent(new CustomEvent("navigate-intro")),this.dispatchEvent(new CustomEvent("close-sidebar"))}_isIntroActive(){return!this.activeOperationId}render(){const e=this._searchQuery.trim().length>0;return ne`
415
+ `],np([je({type:Object})],op.prototype,"spec",2),np([je({type:Boolean})],op.prototype,"authOpen",2),op=np([_e("sl-header")],op);var sp=Object.defineProperty,ip=Object.getOwnPropertyDescriptor,ap=(e,t,r,n)=>{for(var o,s=n>1?void 0:n?ip(t,r):t,i=e.length-1;i>=0;i--)(o=e[i])&&(s=(n?o(t,r,s):o(s))||s);return n&&s&&sp(t,r,s),s};let lp=class extends xe{constructor(){super(...arguments),this.tagGroups=[],this.activeOperationId="",this.open=!1,this.searchEngine=null,this.layout="page",this.securitySchemes=[],this._searchQuery="",this._searchResults=[]}focusSearch(){var e;null==(e=this._searchInput)||e.focus()}_handleSearchInput(e){this._searchQuery=e.target.value,this.searchEngine&&this._searchQuery.trim()?this._searchResults=this.searchEngine.search(this._searchQuery).slice(0,30):this._searchResults=[]}_navigate(e){this._searchQuery="",this._searchResults=[],this.dispatchEvent(new CustomEvent("navigate",{detail:e})),this.dispatchEvent(new CustomEvent("close-sidebar"))}_navigateIntro(){this._searchQuery="",this._searchResults=[],this.dispatchEvent(new CustomEvent("navigate-intro")),this.dispatchEvent(new CustomEvent("close-sidebar"))}_isIntroActive(){return!this.activeOperationId}render(){const e=this._searchQuery.trim().length>0;return ne`
412
416
  <div class="overlay" @click=${()=>this.dispatchEvent(new CustomEvent("close-sidebar"))}></div>
413
417
  <nav class="sidebar">
414
418
  <div class="search-box">
@@ -464,6 +468,19 @@ const _e=e=>(t,r)=>{void 0!==r?r.addInitializer(()=>{customElements.define(e,t)}
464
468
  `)}
465
469
  `}
466
470
  </div>
471
+
472
+ ${"embed"===this.layout&&this.securitySchemes.length>0?ne`
473
+ <button
474
+ class="sidebar-auth-btn"
475
+ @click=${()=>this.dispatchEvent(new CustomEvent("toggle-auth",{bubbles:!0,composed:!0}))}
476
+ >
477
+ <svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
478
+ <rect x="3" y="7" width="10" height="7" rx="1.5"/>
479
+ <path d="M5.5 7V5a2.5 2.5 0 015 0v2"/>
480
+ </svg>
481
+ Authorize
482
+ </button>
483
+ `:null}
467
484
  </nav>
468
485
  `}};
469
486
  /**
@@ -710,7 +727,32 @@ var cp;lp.styles=[Pe,b`
710
727
  color: var(--sl-color-text-muted);
711
728
  text-align: center;
712
729
  }
713
- `],ap([je({type:Array})],lp.prototype,"tagGroups",2),ap([je({type:String})],lp.prototype,"activeOperationId",2),ap([je({type:Boolean,reflect:!0})],lp.prototype,"open",2),ap([je({type:Object})],lp.prototype,"searchEngine",2),ap([Oe()],lp.prototype,"_searchQuery",2),ap([Oe()],lp.prototype,"_searchResults",2),ap([(cp=".search-input",(e,t,r)=>((e,t,r)=>(r.configurable=!0,r.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,r),r))(e,t,{get(){return(null==(e=this.renderRoot)?void 0:e.querySelector(cp))??null;var e}}))],lp.prototype,"_searchInput",2),lp=ap([_e("sl-sidebar")],lp);var dp=Object.defineProperty,pp=Object.getOwnPropertyDescriptor,up=(e,t,r,n)=>{for(var o,s=n>1?void 0:n?pp(t,r):t,i=e.length-1;i>=0;i--)(o=e[i])&&(s=(n?o(t,r,s):o(s))||s);return n&&s&&dp(t,r,s),s};let fp=class extends xe{constructor(){super(...arguments),this.parameters=[]}_getType(e){if(!e)return"any";if("array"===e.type&&e.items){return`${e.items.type??"any"}[]`}return e.type??(e.oneOf?"oneOf":e.anyOf?"anyOf":"any")}_getEnum(e){return e?e.enum??[]:[]}render(){const e=new Map;for(const t of this.parameters)e.has(t.in)||e.set(t.in,[]),e.get(t.in).push(t);return ne`
730
+
731
+ /* ── Embed-mode auth button ───────────── */
732
+ .sidebar-auth-btn {
733
+ display: flex;
734
+ align-items: center;
735
+ gap: 8px;
736
+ margin: var(--sl-spacing-sm) var(--sl-spacing-md) var(--sl-spacing-md);
737
+ padding: 8px 14px;
738
+ border-radius: var(--sl-radius-md);
739
+ border: 1.5px solid var(--sl-color-border);
740
+ color: var(--sl-color-text-secondary);
741
+ background: transparent;
742
+ font-size: var(--sl-font-size-sm);
743
+ font-weight: 600;
744
+ cursor: pointer;
745
+ transition: all var(--sl-transition-fast);
746
+ flex-shrink: 0;
747
+ width: calc(100% - var(--sl-spacing-xl));
748
+ }
749
+
750
+ .sidebar-auth-btn:hover {
751
+ border-color: var(--sl-color-primary);
752
+ color: var(--sl-color-primary);
753
+ background: var(--sl-color-sidebar-active);
754
+ }
755
+ `],ap([je({type:Array})],lp.prototype,"tagGroups",2),ap([je({type:String})],lp.prototype,"activeOperationId",2),ap([je({type:Boolean,reflect:!0})],lp.prototype,"open",2),ap([je({type:Object})],lp.prototype,"searchEngine",2),ap([je()],lp.prototype,"layout",2),ap([je({type:Array})],lp.prototype,"securitySchemes",2),ap([Oe()],lp.prototype,"_searchQuery",2),ap([Oe()],lp.prototype,"_searchResults",2),ap([(cp=".search-input",(e,t,r)=>((e,t,r)=>(r.configurable=!0,r.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,r),r))(e,t,{get(){return(null==(e=this.renderRoot)?void 0:e.querySelector(cp))??null;var e}}))],lp.prototype,"_searchInput",2),lp=ap([_e("sl-sidebar")],lp);var dp=Object.defineProperty,pp=Object.getOwnPropertyDescriptor,up=(e,t,r,n)=>{for(var o,s=n>1?void 0:n?pp(t,r):t,i=e.length-1;i>=0;i--)(o=e[i])&&(s=(n?o(t,r,s):o(s))||s);return n&&s&&dp(t,r,s),s};let fp=class extends xe{constructor(){super(...arguments),this.parameters=[]}_getType(e){if(!e)return"any";if("array"===e.type&&e.items){return`${e.items.type??"any"}[]`}return e.type??(e.oneOf?"oneOf":e.anyOf?"anyOf":"any")}_getEnum(e){return e?e.enum??[]:[]}render(){const e=new Map;for(const t of this.parameters)e.has(t.in)||e.set(t.in,[]),e.get(t.in).push(t);return ne`
714
756
  ${["path","query","header","cookie"].filter(t=>e.has(t)).map(t=>ne`
715
757
  <div class="param-group">
716
758
  <div class="param-group-label">${t} parameters</div>
@@ -2851,16 +2893,21 @@ const pu=2;class uu{constructor(e){}get _$AU(){return this._$AM._$AU}_$AT(e,t,r)
2851
2893
  background: var(--sl-color-primary-hover);
2852
2894
  box-shadow: 0 2px 6px rgba(99, 102, 241, 0.4);
2853
2895
  }
2854
- `],ph([je({type:Array})],uh.prototype,"securitySchemes",2),ph([je({type:Object})],uh.prototype,"authState",2),ph([Oe()],uh.prototype,"_localState",2),ph([Oe()],uh.prototype,"_showTokens",2),uh=ph([_e("sl-auth")],uh);var fh=Object.defineProperty,hh=Object.getOwnPropertyDescriptor,mh=(e,t,r,n)=>{for(var o,s=n>1?void 0:n?hh(t,r):t,i=e.length-1;i>=0;i--)(o=e[i])&&(s=(n?o(t,r,s):o(s))||s);return n&&s&&fh(t,r,s),s};e.SpecLensElement=class extends xe{constructor(){super(...arguments),this.specUrl="",this.proxyUrl="",this.theme="auto",this.hideTryIt=!1,this.hideCodeSamples=!1,this.config={},this._spec=null,this._loading=!1,this._error=null,this._sidebarOpen=!1,this._authOpen=!1,this._activeOperationId="",this._navigateToId="",this._authState={apiKeys:{},bearerTokens:{}},this._tryItOperation=null,this._search=null,this._router=null,this._themeManager=null,this._observer=null,this._handleKeyDown=e=>{if((e.metaKey||e.ctrlKey)&&"k"===e.key){e.preventDefault();const t=this.renderRoot.querySelector("sl-sidebar");null==t||t.focusSearch()}}}connectedCallback(){super.connectedCallback(),this._themeManager=new Hc(this),this._themeManager.init(this.theme),this._router=new Dc(e=>{this._activeOperationId=e,this._navigateToId=e,this._scrollToOperation(e)}),this._router.init(),document.addEventListener("keydown",this._handleKeyDown)}disconnectedCallback(){var e,t,r;super.disconnectedCallback(),null==(e=this._router)||e.destroy(),null==(t=this._themeManager)||t.destroy(),null==(r=this._observer)||r.disconnect(),document.removeEventListener("keydown",this._handleKeyDown)}willUpdate(e){var t;(e.has("specUrl")||e.has("config"))&&this._loadSpec(),e.has("theme")&&(null==(t=this._themeManager)||t.setTheme(this.theme))}async _loadSpec(){var e,t;const r=(null==(e=this.config)?void 0:e.spec)||this.specUrl;if(r){this._loading=!0,this._error=null,this._spec=null;try{const e=await tc(r);this._spec=e,this._search=function(e){const t=new wc({fields:["operationId","summary","description","path","method","tags"],storeFields:["operationId","summary","path","method","tags"],searchOptions:{prefix:!0,fuzzy:.2,boost:{summary:3,operationId:2,tags:2,path:1.5}}}),r=e.map(e=>({id:e.operationId,operationId:e.operationId,summary:e.summary,description:e.description,path:e.path,method:e.method,tags:e.tags.join(" ")}));return t.addAll(r),{search:e=>e.trim()?t.search(e).map(e=>({operationId:e.operationId,path:e.path,method:e.method,summary:e.summary,tags:e.tags.split(" ").filter(Boolean),score:e.score})):[],autoSuggest:e=>e.trim()?t.autoSuggest(e).map(e=>e.suggestion):[]}}(e.allOperations),this._loading=!1,await this.updateComplete,null==(t=this._router)||t.handleCurrentRoute(),this._setupScrollTracking()}catch(n){this._loading=!1,this._error=n instanceof Error?n.message:String(n)}}}_setupScrollTracking(){var e;null==(e=this._observer)||e.disconnect(),this._observer=new IntersectionObserver(e=>{for(const t of e)if(t.isIntersecting){const e=t.target.id;"introduction"===e?this._activeOperationId="":e.startsWith("op-")&&(this._activeOperationId=e.replace("op-",""))}},{root:null,rootMargin:"-20% 0px -70% 0px",threshold:0});const t=this.renderRoot.querySelector("#introduction");t&&this._observer.observe(t);this.renderRoot.querySelectorAll('[id^="op-"]').forEach(e=>this._observer.observe(e))}_scrollToOperation(e){if(!e)return;const t=this.renderRoot.querySelector(`#op-${CSS.escape(e)}`);null==t||t.scrollIntoView({behavior:"smooth",block:"start"})}_scrollToIntro(){this._activeOperationId="";const e=this.renderRoot.querySelector("#introduction");null==e||e.scrollIntoView({behavior:"smooth",block:"start"})}_handleThemeToggle(){var e;const t=(null==(e=this._themeManager)?void 0:e.toggle())??"auto";this.theme=t}_handleAuthUpdate(e){this._authState=e.detail}_handleTryIt(e){this._tryItOperation=e.detail}render(){var e,t;return ne`
2896
+ `],ph([je({type:Array})],uh.prototype,"securitySchemes",2),ph([je({type:Object})],uh.prototype,"authState",2),ph([Oe()],uh.prototype,"_localState",2),ph([Oe()],uh.prototype,"_showTokens",2),uh=ph([_e("sl-auth")],uh);var fh=Object.defineProperty,hh=Object.getOwnPropertyDescriptor,mh=(e,t,r,n)=>{for(var o,s=n>1?void 0:n?hh(t,r):t,i=e.length-1;i>=0;i--)(o=e[i])&&(s=(n?o(t,r,s):o(s))||s);return n&&s&&fh(t,r,s),s};e.SpecLensElement=class extends xe{constructor(){super(...arguments),this.specUrl="",this.proxyUrl="",this.theme="auto",this.hideTryIt=!1,this.hideCodeSamples=!1,this.layout="page",this.config={},this._spec=null,this._loading=!1,this._error=null,this._sidebarOpen=!1,this._authOpen=!1,this._activeOperationId="",this._navigateToId="",this._authState={apiKeys:{},bearerTokens:{}},this._tryItOperation=null,this._search=null,this._router=null,this._themeManager=null,this._observer=null,this._handleKeyDown=e=>{if((e.metaKey||e.ctrlKey)&&"k"===e.key){e.preventDefault();const t=this.renderRoot.querySelector("sl-sidebar");null==t||t.focusSearch()}}}connectedCallback(){super.connectedCallback(),this._themeManager=new Hc(this),this._themeManager.init(this.theme),this._router=new Dc(e=>{this._activeOperationId=e,this._navigateToId=e,this._scrollToOperation(e)}),this._router.init(),document.addEventListener("keydown",this._handleKeyDown)}disconnectedCallback(){var e,t,r;super.disconnectedCallback(),null==(e=this._router)||e.destroy(),null==(t=this._themeManager)||t.destroy(),null==(r=this._observer)||r.disconnect(),document.removeEventListener("keydown",this._handleKeyDown)}willUpdate(e){var t;(e.has("specUrl")||e.has("config"))&&this._loadSpec(),e.has("theme")&&(null==(t=this._themeManager)||t.setTheme(this.theme))}async _loadSpec(){var e,t;const r=(null==(e=this.config)?void 0:e.spec)||this.specUrl;if(r){this._loading=!0,this._error=null,this._spec=null;try{const e=await tc(r);this._spec=e,this._search=function(e){const t=new wc({fields:["operationId","summary","description","path","method","tags"],storeFields:["operationId","summary","path","method","tags"],searchOptions:{prefix:!0,fuzzy:.2,boost:{summary:3,operationId:2,tags:2,path:1.5}}}),r=e.map(e=>({id:e.operationId,operationId:e.operationId,summary:e.summary,description:e.description,path:e.path,method:e.method,tags:e.tags.join(" ")}));return t.addAll(r),{search:e=>e.trim()?t.search(e).map(e=>({operationId:e.operationId,path:e.path,method:e.method,summary:e.summary,tags:e.tags.split(" ").filter(Boolean),score:e.score})):[],autoSuggest:e=>e.trim()?t.autoSuggest(e).map(e=>e.suggestion):[]}}(e.allOperations),this._loading=!1,await this.updateComplete,null==(t=this._router)||t.handleCurrentRoute(),this._setupScrollTracking()}catch(n){this._loading=!1,this._error=n instanceof Error?n.message:String(n)}}}_setupScrollTracking(){var e;null==(e=this._observer)||e.disconnect(),this._observer=new IntersectionObserver(e=>{for(const t of e)if(t.isIntersecting){const e=t.target.id;"introduction"===e?this._activeOperationId="":e.startsWith("op-")&&(this._activeOperationId=e.replace("op-",""))}},{root:null,rootMargin:"-20% 0px -70% 0px",threshold:0});const t=this.renderRoot.querySelector("#introduction");t&&this._observer.observe(t);this.renderRoot.querySelectorAll('[id^="op-"]').forEach(e=>this._observer.observe(e))}_scrollToOperation(e){if(!e)return;const t=this.renderRoot.querySelector(`#op-${CSS.escape(e)}`);null==t||t.scrollIntoView({behavior:"smooth",block:"start"})}_scrollToIntro(){this._activeOperationId="";const e=this.renderRoot.querySelector("#introduction");null==e||e.scrollIntoView({behavior:"smooth",block:"start"})}_handleThemeToggle(){var e;const t=(null==(e=this._themeManager)?void 0:e.toggle())??"auto";this.theme=t}_handleAuthUpdate(e){this._authState=e.detail}_handleTryIt(e){this._tryItOperation=e.detail}setTheme(e){this.theme=e}render(){var e,t;return ne`
2855
2897
  <div class="sl-root" data-theme=${(null==(e=this._themeManager)?void 0:e.resolved)??"light"}>
2856
2898
  ${this._spec?ne`
2857
- <sl-header
2858
- .spec=${this._spec}
2859
- .authOpen=${this._authOpen}
2860
- @toggle-theme=${this._handleThemeToggle}
2861
- @toggle-sidebar=${()=>this._sidebarOpen=!this._sidebarOpen}
2862
- @toggle-auth=${()=>this._authOpen=!this._authOpen}
2863
- ></sl-header>
2899
+ ${"page"===this.layout?ne`
2900
+ <sl-header
2901
+ .spec=${this._spec}
2902
+ .authOpen=${this._authOpen}
2903
+ @toggle-theme=${this._handleThemeToggle}
2904
+ @toggle-sidebar=${()=>this._sidebarOpen=!this._sidebarOpen}
2905
+ @toggle-auth=${()=>this._authOpen=!this._authOpen}
2906
+ >
2907
+ <slot name="logo" slot="logo"></slot>
2908
+ <slot name="header-actions" slot="header-actions"></slot>
2909
+ </sl-header>
2910
+ `:null}
2864
2911
 
2865
2912
  <div class="sl-body">
2866
2913
  <sl-sidebar
@@ -2868,9 +2915,12 @@ const pu=2;class uu{constructor(e){}get _$AU(){return this._$AM._$AU}_$AT(e,t,r)
2868
2915
  .activeOperationId=${this._activeOperationId}
2869
2916
  .open=${this._sidebarOpen}
2870
2917
  .searchEngine=${this._search}
2918
+ .layout=${this.layout}
2919
+ .securitySchemes=${this._spec.securitySchemes}
2871
2920
  @navigate=${e=>{var t;return null==(t=this._router)?void 0:t.navigateTo(e.detail)}}
2872
2921
  @navigate-intro=${()=>this._scrollToIntro()}
2873
2922
  @close-sidebar=${()=>this._sidebarOpen=!1}
2923
+ @toggle-auth=${()=>this._authOpen=!this._authOpen}
2874
2924
  ></sl-sidebar>
2875
2925
 
2876
2926
  <main class="sl-main">
@@ -3498,5 +3548,11 @@ const pu=2;class uu{constructor(e){}get _$AU(){return this._$AM._$AU}_$AT(e,t,r)
3498
3548
  padding: var(--sl-spacing-md);
3499
3549
  }
3500
3550
  }
3501
- `],mh([je({attribute:"spec-url"})],e.SpecLensElement.prototype,"specUrl",2),mh([je({attribute:"proxy-url"})],e.SpecLensElement.prototype,"proxyUrl",2),mh([je({attribute:"theme",reflect:!0})],e.SpecLensElement.prototype,"theme",2),mh([je({type:Boolean,attribute:"hide-try-it"})],e.SpecLensElement.prototype,"hideTryIt",2),mh([je({type:Boolean,attribute:"hide-code-samples"})],e.SpecLensElement.prototype,"hideCodeSamples",2),mh([Oe()],e.SpecLensElement.prototype,"_spec",2),mh([Oe()],e.SpecLensElement.prototype,"_loading",2),mh([Oe()],e.SpecLensElement.prototype,"_error",2),mh([Oe()],e.SpecLensElement.prototype,"_sidebarOpen",2),mh([Oe()],e.SpecLensElement.prototype,"_authOpen",2),mh([Oe()],e.SpecLensElement.prototype,"_activeOperationId",2),mh([Oe()],e.SpecLensElement.prototype,"_navigateToId",2),mh([Oe()],e.SpecLensElement.prototype,"_authState",2),mh([Oe()],e.SpecLensElement.prototype,"_tryItOperation",2),e.SpecLensElement=mh([_e("spec-lens")],e.SpecLensElement),void 0===globalThis.Buffer&&(globalThis.Buffer=f.Buffer),customElements.get("spec-lens")||customElements.define("spec-lens",e.SpecLensElement);const gh={init(e,t){const r=document.querySelector(e);if(!r)throw new Error(`[SpecLens] Container not found: ${e}`);const n=document.createElement("spec-lens");return t.specUrl&&n.setAttribute("spec-url",t.specUrl),t.theme&&"auto"!==t.theme&&n.setAttribute("theme",t.theme),t.proxyUrl&&n.setAttribute("proxy-url",t.proxyUrl),t.hideTryIt&&n.setAttribute("hide-try-it",""),t.hideCodeSamples&&n.setAttribute("hide-code-samples",""),n.config=t,r.appendChild(n),n}};return e.SpecLens=gh,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),e}({});
3551
+
3552
+ /* ── Embed mode ──────────────────────── */
3553
+ :host([layout="embed"]) {
3554
+ --sl-header-height: 0px;
3555
+ min-height: unset;
3556
+ }
3557
+ `],mh([je({attribute:"spec-url"})],e.SpecLensElement.prototype,"specUrl",2),mh([je({attribute:"proxy-url"})],e.SpecLensElement.prototype,"proxyUrl",2),mh([je({attribute:"theme",reflect:!0})],e.SpecLensElement.prototype,"theme",2),mh([je({type:Boolean,attribute:"hide-try-it"})],e.SpecLensElement.prototype,"hideTryIt",2),mh([je({type:Boolean,attribute:"hide-code-samples"})],e.SpecLensElement.prototype,"hideCodeSamples",2),mh([je({reflect:!0,attribute:"layout"})],e.SpecLensElement.prototype,"layout",2),mh([Oe()],e.SpecLensElement.prototype,"_spec",2),mh([Oe()],e.SpecLensElement.prototype,"_loading",2),mh([Oe()],e.SpecLensElement.prototype,"_error",2),mh([Oe()],e.SpecLensElement.prototype,"_sidebarOpen",2),mh([Oe()],e.SpecLensElement.prototype,"_authOpen",2),mh([Oe()],e.SpecLensElement.prototype,"_activeOperationId",2),mh([Oe()],e.SpecLensElement.prototype,"_navigateToId",2),mh([Oe()],e.SpecLensElement.prototype,"_authState",2),mh([Oe()],e.SpecLensElement.prototype,"_tryItOperation",2),e.SpecLensElement=mh([_e("spec-lens")],e.SpecLensElement),void 0===globalThis.Buffer&&(globalThis.Buffer=f.Buffer),customElements.get("spec-lens")||customElements.define("spec-lens",e.SpecLensElement);const gh={init(e,t){const r=document.querySelector(e);if(!r)throw new Error(`[SpecLens] Container not found: ${e}`);const n=document.createElement("spec-lens");return t.specUrl&&n.setAttribute("spec-url",t.specUrl),t.theme&&"auto"!==t.theme&&n.setAttribute("theme",t.theme),t.proxyUrl&&n.setAttribute("proxy-url",t.proxyUrl),t.hideTryIt&&n.setAttribute("hide-try-it",""),t.hideCodeSamples&&n.setAttribute("hide-code-samples",""),n.config=t,r.appendChild(n),n}};return e.SpecLens=gh,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),e}({});
3502
3558
  //# sourceMappingURL=speclens.iife.js.map