Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
require("../../_virtual/_rolldown/runtime.cjs");
const require_safe_custom_element = require("../../shared/safe-custom-element.cjs");
const require_index = require("../../shared/tailwind-element/index.cjs");
const require_decorate = require("../../_virtual/_@oxc-project_runtime@0.127.0/helpers/decorate.cjs");
require("../lukso-icon/index.cjs");
require("../lukso-sanitize/index.cjs");
const require_index$1 = require("../../shared/directives/custom-class-map/index.cjs");
require("../../shared/directives/index.cjs");
const require_style = require("./style.css?inline.cjs");
let lit = require("lit");
let lit_decorators_js = require("lit/decorators.js");
//#region src/components/lukso-terms/index.ts
var LuksoTerms = class LuksoTerms extends require_index.TailwindStyledElement(require_style.default) {
	constructor(..._args) {
		super(..._args);
		this.text = "";
		this.hasScrollButton = true;
		this.defaultStyles = `h-[56px] w-full sticky bottom-0 -mt-[56px]
    bg-gradient-to-b from-transparent to-neutral-100/80
    flex justify-center transition-opacity opacity-0`;
	}
	onScrollBottom() {
		const event = new CustomEvent("on-bottom-scroll", {
			bubbles: true,
			composed: true
		});
		this.dispatchEvent(event);
	}
	handleScroll() {
		const scrollContainer = this.shadowRoot.getElementById("scroll-container");
		const scrollHeight = scrollContainer.scrollHeight - scrollContainer.offsetHeight;
		if (scrollContainer.scrollTop >= scrollHeight) {
			this.onScrollBottom();
			this.hasScrollButton = false;
		} else this.hasScrollButton = true;
	}
	handleBottomScroll() {
		const scrollEnd = this.shadowRoot.getElementById("scroll-end");
		if (scrollEnd) scrollEnd.scrollIntoView({
			behavior: "smooth",
			block: "nearest",
			inline: "start"
		});
	}
	render() {
		return lit.html`<div
      id="scroll-container"
      class="border border-solid border-neutral-90 rounded-12 overflow-y-scroll relative scrollbar-none"
      @scroll=${this.handleScroll}
    >
      <div class="paragraph-inter-12-regular px-4 pt-3">
        <lukso-sanitize html-content=${this.text} is-pre></lukso-sanitize>
        <br />
        <br />
        <div id="scroll-end"></div>
      </div>
      <div
        class=${require_index$1.customClassMap({
			[this.defaultStyles]: true,
			"!opacity-100": this.hasScrollButton
		})}
      >
        <div
          data-testid="scroll-to-bottom"
          class="w-10 h-10 bg-neutral-100 rounded-full shadow-1xl flex items-center justify-center animate-bounce2 cursor-pointer"
          @click=${this.handleBottomScroll}
        >
          <lukso-icon name="arrow-down-lg"></lukso-icon>
        </div>
      </div>
    </div>`;
	}
};
require_decorate.__decorate([(0, lit_decorators_js.property)({ type: String })], LuksoTerms.prototype, "text", void 0);
require_decorate.__decorate([(0, lit_decorators_js.state)()], LuksoTerms.prototype, "hasScrollButton", void 0);
LuksoTerms = require_decorate.__decorate([require_safe_custom_element.safeCustomElement("lukso-terms")], LuksoTerms);
//#endregion
Object.defineProperty(exports, "LuksoTerms", {
	enumerable: true,
	get: function() {
		return LuksoTerms;
	}
});
