@kumori/aurora-wui-components 0.0.299-dev4447.2 → 0.0.299-dev4447.3

package/dist/components/axebow-summary/axebow-summary-card.d.ts

@@ -4,7 +4,17 @@ export declare class AxebowSummaryCard extends LitElement {
     title: string;
     cardWidth: string;
     cardHeight: string;
+    fitContent: boolean;
     isSummaryOpen: boolean;
+    private _fitsViewport;
+    private _card?;
+    private _resizeObserver?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected firstUpdated(): void;
+    private _updateFitsViewport;
+    private get _positionClass();
+    private get _heightClass();
     render(): import('lit-html').TemplateResult<1>;
     private _renderHeader;
     private _toggleMobileSummary;

package/dist/components/axebow-summary/axebow-summary-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"axebow-summary-card.d.ts","sourceRoot":"","sources":["../../../src/components/axebow-summary/axebow-summary-card.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAwB,MAAM,KAAK,CAAC;AAIvD,OAAO,+BAA+B,CAAC;AACvC,OAAO,qCAAqC,CAAC;AAC7C,OAAO,uDAAuD,CAAC;AAE/D,qBACa,iBAAkB,SAAQ,UAAU;IAC/C,MAAM,CAAC,MAAM,4BAoBX;IAE0B,KAAK,SAAa;IAClB,SAAS,SAAe;IACxB,UAAU,SAAM;IAEnC,aAAa,UAAQ;IAE9B,MAAM;IAuBN,OAAO,CAAC,aAAa;IAmBrB,OAAO,CAAC,oBAAoB;IAMrB,cAAc;CAMtB"}
+{"version":3,"file":"axebow-summary-card.d.ts","sourceRoot":"","sources":["../../../src/components/axebow-summary/axebow-summary-card.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAwB,MAAM,KAAK,CAAC;AAIvD,OAAO,+BAA+B,CAAC;AACvC,OAAO,qCAAqC,CAAC;AAC7C,OAAO,uDAAuD,CAAC;AAE/D,qBACa,iBAAkB,SAAQ,UAAU;IAC/C,MAAM,CAAC,MAAM,4BAoBX;IAE0B,KAAK,SAAa;IAClB,SAAS,SAAe;IACxB,UAAU,SAAM;IACf,UAAU,UAAS;IAEvC,aAAa,UAAQ;IACrB,OAAO,CAAC,aAAa,CAAQ;IAER,OAAO,CAAC,KAAK,CAAC,CAAc;IAC1D,OAAO,CAAC,eAAe,CAAC,CAAiB;IAEzC,iBAAiB;IAKjB,oBAAoB;IAMpB,SAAS,CAAC,YAAY;IAOtB,OAAO,CAAC,mBAAmB,CAIzB;IAEF,OAAO,KAAK,cAAc,GAEzB;IAED,OAAO,KAAK,YAAY,GAGvB;IAED,MAAM;IAyBN,OAAO,CAAC,aAAa;IAmBrB,OAAO,CAAC,oBAAoB;IAMrB,cAAc;CAMtB"}

package/dist/index.js

@@ -10978,7 +10978,7 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
 	}
 	render() {
 		return html`
-      <axebow-summary-card title="${this.summaryTitle}">
+      <axebow-summary-card title="${this.summaryTitle}" fitContent>
         ${this.showDownloadButton ? html`
               <axebow-button slot="header-actions" variant="text" size="medium" @click=${this._handleDownloadBundle}>
                 <axebow-icon
@@ -11605,7 +11605,14 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
 		this.title = "Summary";
 		this.cardWidth = "24.125rem";
 		this.cardHeight = "";
+		this.fitContent = false;
 		this.isSummaryOpen = true;
+		this._fitsViewport = true;
+		this._updateFitsViewport = () => {
+			if (!this._card) return;
+			const top = parseFloat(getComputedStyle(this._card).top) || 0;
+			this._fitsViewport = this._card.getBoundingClientRect().height + top <= window.innerHeight;
+		};
 	}
 	static {
 		this.styles = [
@@ -11630,10 +11637,33 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
     `
 		];
 	}
+	connectedCallback() {
+		super.connectedCallback();
+		window.addEventListener("resize", this._updateFitsViewport);
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		window.removeEventListener("resize", this._updateFitsViewport);
+		this._resizeObserver?.disconnect();
+	}
+	firstUpdated() {
+		if (!this._card) return;
+		this._resizeObserver = new ResizeObserver(this._updateFitsViewport);
+		this._resizeObserver.observe(this._card);
+		this._updateFitsViewport();
+	}
+	get _positionClass() {
+		return this.fitContent && !this._fitsViewport ? "static" : "lg:sticky static";
+	}
+	get _heightClass() {
+		if (this.cardHeight) return "lg:min-h-(--card-height)";
+		return this.fitContent ? "" : "lg:min-h-[calc(100vh-7.25rem)]";
+	}
 	render() {
 		return html`
       <div
-        class="w-full lg:w-(--card-width) lg:sticky static top-25 h-auto ${this.cardHeight ? "lg:min-h-(--card-height)" : "lg:min-h-[calc(100vh-7.25rem)]"} rounded-md z-10 transition-all duration-300"
+        data-summary-card
+        class="w-full lg:w-(--card-width) ${this._positionClass} top-25 h-auto ${this._heightClass} rounded-md z-10 transition-all duration-300"
         style="--card-width: ${this.cardWidth}; --card-height: ${this.cardHeight};"
       >
         <sl-card
@@ -11683,7 +11713,10 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
 __decorate([property({ type: String })], AxebowSummaryCard.prototype, "title", void 0);
 __decorate([property({ type: String })], AxebowSummaryCard.prototype, "cardWidth", void 0);
 __decorate([property({ type: String })], AxebowSummaryCard.prototype, "cardHeight", void 0);
+__decorate([property({ type: Boolean })], AxebowSummaryCard.prototype, "fitContent", void 0);
 __decorate([state()], AxebowSummaryCard.prototype, "isSummaryOpen", void 0);
+__decorate([state()], AxebowSummaryCard.prototype, "_fitsViewport", void 0);
+__decorate([query("[data-summary-card]")], AxebowSummaryCard.prototype, "_card", void 0);
 AxebowSummaryCard = __decorate([customElement("axebow-summary-card")], AxebowSummaryCard);
 //#endregion
 //#region src/components/axebow-summary/axebow-summary-limits.ts