@sky.ui/core 0.0.1

package/dist/sky-card/sky-card.js

@@ -0,0 +1,186 @@
+import{__decorate as t,__metadata as e}from"tslib";import{LitElement as r,css as o,html as s}from"lit";import{property as a,customElement as i}from"lit/decorators.js";import{classMap as n}from"lit/directives/class-map.js";import{resolveRadius as d}from"../helper/utils/size-resolver.js";import{resolveColor as l}from"../helper/utils/color-resolver.js";var h;let p=class extends r{constructor(){super(...arguments),this.bg="primary",this.blurLevel="none",this.radius="md",this.bodyPadding="none",this.elevation="md",this.outlined=!1,this.clickable=!1,this.headerBg="transparent",this.headerBlur="none",this.headerPadding="md",this.headerLayout="inline",this.headerInsetGap="sm",this.headerRadius="md",this.headerSeparatorColor="border-light",this.footerBg="transparent",this.footerBlur="none",this.footerPadding="md",this.footerLayout="inline",this.footerInsetGap="sm",this.footerRadius="md",this.footerSeparatorColor="border-light",this.padRatio=1,this.separators="none",this.overlays="none",this.insets="none",this._effHeaderSeparator=!1,this._effFooterSeparator=!1,this._effHeaderOverlay=!1,this._effFooterOverlay=!1,this._effHeaderInset=!1,this._effFooterInset=!1,this._varsCache={}}static{h=this}static{this.BG_MAP={primary:"var(--sky-glass-primary)",secondary:"var(--sky-glass-secondary)",tertiary:"var(--sky-glass-tertiary)",transparent:"transparent"}}static{this.BLUR_MAP={none:"none",xs:"blur(2px)",sm:"var(--sky-blur-primary)",md:"var(--sky-blur-secondary)",lg:"var(--sky-blur-tertiary)"}}static{this.SIZE_MAP={none:"0",sm:"6px",md:"16px",lg:"24px",xl:"32px"}}static{this.ELEVATION_MAP={none:"none",sm:"var(--sky-box-shadow-primary)",md:"var(--sky-box-shadow-secondary)",lg:"var(--sky-box-shadow-tertiary)"}}static{this.styles=o`
+    :host {
+      display: block;
+    }
+
+    .card {
+      display: flex;
+      flex-direction: column;
+      width: 100%;
+      position: relative;
+      overflow: hidden;
+      box-sizing: border-box;
+      background: var(--_card-bg, var(--sky-glass-primary));
+      border-radius: var(--_card-radius, var(--sky-radius-secondary));
+      backdrop-filter: var(--_card-blur, none);
+      box-shadow: var(--_card-shadow, var(--sky-box-shadow-primary));
+      border: var(--_card-border, 1px solid var(--sky-border-light));
+      transition: box-shadow 0.18s ease, transform 0.12s ease;
+     
+    }
+
+    :host([outlined]) .card {
+      box-shadow: none;
+      border-width: 1px;
+      border-color: var(--sky-border-light);
+    }
+    :host([clickable]) .card {
+      cursor: pointer;
+    }
+    :host([clickable]) .card:hover {
+      box-shadow: var(--_card-shadow-hover, var(--sky-box-shadow-hover));
+    }
+
+    .section {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 5px;
+      box-sizing: border-box;
+      min-width: 0;
+      background: transparent;
+    }
+    .section.stack {
+      flex-direction: column;
+      align-items: stretch;
+      gap: 5px;
+    }
+    .section.row {
+      flex-direction: row;
+    }
+
+    .overlay-top {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      z-index: 1;
+    }
+    .overlay-bottom {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      z-index: 1;
+    }
+
+    .inset {
+      border-radius: var(--_section-radius, var(--sky-radius-secondary));
+      overflow: hidden;
+      border: var(--_inset-border, 0 solid transparent);
+      box-shadow: var(--_inset-shadow, none);
+    }
+    .overlay-top.inset {
+      top: var(--_inset-gap, 8px);
+      left: var(--_inset-gap, 8px);
+      right: var(--_inset-gap, 8px);
+    }
+    .overlay-bottom.inset {
+      bottom: var(--_inset-gap, 8px);
+      left: var(--_inset-gap, 8px);
+      right: var(--_inset-gap, 8px);
+    }
+
+    .section[part="header"]:has(slot:not([empty])),
+    .section[part="header"][has-content] {
+      background: var(--_header-bg);
+      backdrop-filter: var(--_header-blur, none);
+      padding-block: var(--_header-pad-y, 12px);
+      padding-inline: var(--_header-pad-x, 18px);
+     
+    }
+    .section[part="footer"]:has(slot:not([empty])),
+    .section[part="footer"][has-content] {
+      background: var(--_footer-bg);
+      backdrop-filter: var(--_footer-blur, none);
+      padding-block: var(--_footer-pad-y, 12px);
+      padding-inline: var(--_footer-pad-x, 18px);
+     
+    }
+
+    .section[part="header"]:not(.inset):has(slot:not([empty])),
+    .section[part="header"]:not(.inset)[has-content] {
+      border-bottom: var(--_header-separator, 0px) solid
+        var(--_header-separator-color, var(--sky-border-light));
+    }
+    .section[part="footer"]:not(.inset):has(slot:not([empty])),
+    .section[part="footer"]:not(.inset)[has-content] {
+      border-top: var(--_footer-separator, 0px) solid
+        var(--_footer-separator-color, var(--sky-border-light));
+    }
+
+    ::slotted(:not([slot])) {
+      box-sizing: border-box;
+      padding-block: var(--_body-pad-y, 12px);
+      padding-inline: var(--_body-pad-x, 18px);
+    }
+    slot[empty] {
+      display: none;
+    }
+
+    ::slotted([slot="title"]) {
+      font-size: 18px;
+      font-weight: 600;
+      margin: 0;
+      color: var(--sky-text-primary);
+      text-align: start;
+      text-shadow: var(--sky-text-shadow-on-glass, none);
+    }
+    ::slotted([slot="subtitle"]) {
+      font-size: 14px;
+      margin: 0;
+      color: var(--sky-text-secondary);
+      text-align: start;
+      text-shadow: var(--sky-text-shadow-on-glass, none);
+    }
+    ::slotted([slot="actions"]) {
+      display: inline-flex;
+      gap: 5px;
+      align-items: center;
+      margin-left: auto;
+    }
+    ::slotted([slot="footer-title"]) {
+      font-size: 16px;
+      font-weight: 500;
+      margin: 0;
+      color: var(--sky-text-primary);
+      text-align: start;
+    }
+    ::slotted([slot="footer-subtitle"]) {
+      font-size: 12px;
+      margin: 0;
+      color: var(--sky-text-secondary);
+      text-align: start;
+    }
+    ::slotted([slot="footer-actions"]) {
+      display: inline-flex;
+      gap: 5px;
+      align-items: center;
+      margin-left: auto;
+    }
+
+    .main {
+      width: 100%;
+    }
+  `}firstUpdated(){this._wireSlotChangeHandlers(),this._syncHeader(),this._syncFooter()}willUpdate(t){(t.has("separators")||t.has("overlays")||t.has("insets"))&&this._computeEffectiveFlags(),(t.has("bg")||t.has("blurLevel")||t.has("radius")||t.has("elevation"))&&this._applyCardVars(),(t.has("headerPadding")||t.has("bodyPadding")||t.has("footerPadding")||t.has("padRatio"))&&this._applyPaddingVars(),(t.has("headerBg")||t.has("footerBg")||t.has("headerBlur")||t.has("footerBlur")||t.has("headerRadius")||t.has("footerRadius")||t.has("headerInsetGap")||t.has("footerInsetGap")||t.has("headerSeparatorColor")||t.has("footerSeparatorColor")||t.has("separators")||t.has("insets"))&&this._applySectionChrome()}_wireSlotChangeHandlers(){this.renderRoot.querySelector("#slot-title")?.addEventListener("slotchange",()=>this._syncHeader()),this.renderRoot.querySelector("#slot-subtitle")?.addEventListener("slotchange",()=>this._syncHeader()),this.renderRoot.querySelector("#slot-actions")?.addEventListener("slotchange",()=>this._syncHeader()),this.renderRoot.querySelector("#slot-f-title")?.addEventListener("slotchange",()=>this._syncFooter()),this.renderRoot.querySelector("#slot-f-subtitle")?.addEventListener("slotchange",()=>this._syncFooter()),this.renderRoot.querySelector("#slot-f-actions")?.addEventListener("slotchange",()=>this._syncFooter())}_syncHeader(){const t=this.renderRoot.querySelector("#hdr"),e=[this.renderRoot.querySelector("#slot-title"),this.renderRoot.querySelector("#slot-subtitle"),this.renderRoot.querySelector("#slot-actions")].filter(Boolean),r=e.some(t=>t.assignedNodes({flatten:!0}).length>0);t?.toggleAttribute("has-content",r),e.forEach(t=>t.toggleAttribute("empty",0===t.assignedNodes({flatten:!0}).length))}_syncFooter(){const t=this.renderRoot.querySelector("#ftr"),e=[this.renderRoot.querySelector("#slot-f-title"),this.renderRoot.querySelector("#slot-f-subtitle"),this.renderRoot.querySelector("#slot-f-actions")].filter(Boolean),r=e.some(t=>t.assignedNodes({flatten:!0}).length>0);t?.toggleAttribute("has-content",r),e.forEach(t=>t.toggleAttribute("empty",0===t.assignedNodes({flatten:!0}).length))}_expandPair(t){switch(t){case"both":return[!0,!0];case"header":return[!0,!1];case"footer":return[!1,!0];default:return[!1,!1]}}_computeEffectiveFlags(){[this._effHeaderSeparator,this._effFooterSeparator]=this._expandPair(this.separators),[this._effHeaderOverlay,this._effFooterOverlay]=this._expandPair(this.overlays),[this._effHeaderInset,this._effFooterInset]=this._expandPair(this.insets)}_setVar(t,e){this._varsCache[t]!==e&&(this.style.setProperty(t,e),this._varsCache[t]=e)}_applyCardVars(){this._setVar("--_card-bg",h.BG_MAP[this.bg]??this.bg),this._setVar("--_card-blur",h.BLUR_MAP[this.blurLevel]??this.blurLevel),this._setVar("--_card-radius",d(this.radius)),this._setVar("--_card-shadow",h.ELEVATION_MAP[this.elevation]??this.elevation);const t="none"===this.elevation?h.ELEVATION_MAP.sm:"sm"===this.elevation?h.ELEVATION_MAP.md:h.ELEVATION_MAP.lg;this._setVar("--_card-shadow-hover",t)}_applyPaddingVars(){const t=h.SIZE_MAP[this.headerPadding]??this.headerPadding,e=h.SIZE_MAP[this.bodyPadding]??this.bodyPadding,r=h.SIZE_MAP[this.footerPadding]??this.footerPadding,o=Number.isFinite(this.padRatio)?Math.max(0,this.padRatio):1;this._setVar("--_header-pad-y",t),this._setVar("--_header-pad-x",`calc(${t} * ${o})`),this._setVar("--_body-pad-y",e),this._setVar("--_body-pad-x",`calc(${e} * ${o})`),this._setVar("--_footer-pad-y",r),this._setVar("--_footer-pad-x",`calc(${r} * ${o})`)}_applySectionChrome(){const t=this._effHeaderInset?"0px":this._effHeaderSeparator?"1px":"0px",e=this._effFooterInset?"0px":this._effFooterSeparator?"1px":"0px";this._setVar("--_header-separator",t),this._setVar("--_footer-separator",e),this._setVar("--_header-separator-color",l(this.headerSeparatorColor)),this._setVar("--_footer-separator-color",l(this.footerSeparatorColor));const r=this._effHeaderInset&&this._effHeaderSeparator?"1px solid var(--sky-border-light)":"0 solid transparent",o=this._effFooterInset&&this._effFooterSeparator?"1px solid var(--sky-border-light)":"0 solid transparent";this._setVar("--_header-inset-border",r),this._setVar("--_footer-inset-border",o),this._setVar("--_header-bg",h.BG_MAP[this.headerBg]??this.headerBg),this._setVar("--_header-blur",h.BLUR_MAP[this.headerBlur]??this.headerBlur),this._setVar("--_footer-bg",h.BG_MAP[this.footerBg]??this.footerBg),this._setVar("--_footer-blur",h.BLUR_MAP[this.footerBlur]??this.footerBlur),this._setVar("--_header-radius",d(this.headerRadius)),this._setVar("--_footer-radius",d(this.footerRadius)),this._setVar("--_header-inset-gap",h.SIZE_MAP[this.headerInsetGap]??this.headerInsetGap),this._setVar("--_footer-inset-gap",h.SIZE_MAP[this.footerInsetGap]??this.footerInsetGap)}refreshLayout(){this._computeEffectiveFlags(),this._applyCardVars(),this._applyPaddingVars(),this._applySectionChrome(),this._syncHeader(),this._syncFooter()}render(){const t="inline"===this.headerLayout?"row":"stack",e="inline"===this.footerLayout?"row":"stack",r=n({section:!0,[t]:!0,"overlay-top":!!this._effHeaderOverlay,inset:!!this._effHeaderInset}),o=n({section:!0,[e]:!0,"overlay-bottom":!!this._effFooterOverlay,inset:!!this._effFooterInset});return s`
+      <div class="card" part="card">
+        <div class=${r} part="header" id="hdr">
+          <div class="main">
+            <slot name="title" id="slot-title"></slot>
+            <slot name="subtitle" id="slot-subtitle"></slot>
+          </div>
+          <slot name="actions" id="slot-actions"></slot>
+        </div>
+
+        <slot></slot>
+
+        <div class=${o} part="footer" id="ftr">
+          <div class="main">
+            <slot name="footer-title" id="slot-f-title"></slot>
+            <slot name="footer-subtitle" id="slot-f-subtitle"></slot>
+          </div>
+          <slot name="footer-actions" id="slot-f-actions"></slot>
+        </div>
+      </div>
+    `}};t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"bg",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"blurLevel",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"radius",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"bodyPadding",void 0),t([a({type:String,reflect:!0}),e("design:type",String)],p.prototype,"elevation",void 0),t([a({type:Boolean,reflect:!0}),e("design:type",Object)],p.prototype,"outlined",void 0),t([a({type:Boolean,reflect:!0}),e("design:type",Object)],p.prototype,"clickable",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"headerBg",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"headerBlur",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"headerPadding",void 0),t([a({type:String}),e("design:type",String)],p.prototype,"headerLayout",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"headerInsetGap",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"headerRadius",void 0),t([a({type:String}),e("design:type",Object)],p.prototype,"headerSeparatorColor",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"footerBg",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"footerBlur",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"footerPadding",void 0),t([a({type:String}),e("design:type",String)],p.prototype,"footerLayout",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"footerInsetGap",void 0),t([a({type:String,reflect:!0}),e("design:type",Object)],p.prototype,"footerRadius",void 0),t([a({type:String}),e("design:type",Object)],p.prototype,"footerSeparatorColor",void 0),t([a({type:Number}),e("design:type",Object)],p.prototype,"padRatio",void 0),t([a({type:String}),e("design:type",String)],p.prototype,"separators",void 0),t([a({type:String}),e("design:type",String)],p.prototype,"overlays",void 0),t([a({type:String}),e("design:type",String)],p.prototype,"insets",void 0),p=h=t([i("sky-card")],p);export{p as SkyCard};
+//# sourceMappingURL=sky-card.js.map

package/dist/sky-card/sky-card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sky-card.js","sources":["../../src/sky-card/sky-card.ts"],"sourcesContent":[null],"names":["SkyCard","LitElement","constructor","this","bg","blurLevel","radius","bodyPadding","elevation","outlined","clickable","headerBg","headerBlur","headerPadding","headerLayout","headerInsetGap","headerRadius","headerSeparatorColor","footerBg","footerBlur","footerPadding","footerLayout","footerInsetGap","footerRadius","footerSeparatorColor","padRatio","separators","overlays","insets","_effHeaderSeparator","_effFooterSeparator","_effHeaderOverlay","_effFooterOverlay","_effHeaderInset","_effFooterInset","_varsCache","BG_MAP","primary","secondary","tertiary","transparent","BLUR_MAP","none","xs","sm","md","lg","SIZE_MAP","xl","ELEVATION_MAP","styles","css","firstUpdated","_wireSlotChangeHandlers","_syncHeader","_syncFooter","willUpdate","changed","has","_computeEffectiveFlags","_applyCardVars","_applyPaddingVars","_applySectionChrome","renderRoot","querySelector","addEventListener","hdr","slots","filter","Boolean","some","s","assignedNodes","flatten","length","toggleAttribute","forEach","ftr","_expandPair","sh","_setVar","name","value","style","setProperty","SkyCard_1","resolveRadius","hoverShadow","h","b","f","ratio","Number","isFinite","Math","max","headerSep","footerSep","resolveColor","headerInsetBorder","footerInsetBorder","refreshLayout","render","headerLayoutClass","footerLayoutClass","headerClasses","classMap","section","inset","footerClasses","html","__decorate","property","type","String","reflect","prototype","customElement"],"mappings":"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"}

package/dist/sky-carousel/index.d.ts

@@ -0,0 +1 @@
+export * from "./sky-carousel";

package/dist/sky-carousel/index.js

@@ -0,0 +1 @@
+export * from './sky-carousel.js';

package/dist/sky-carousel/sky-carousel.d.ts

@@ -0,0 +1,265 @@
+import { LitElement } from "lit";
+export type SkyCarouselAxis = "horizontal" | "vertical";
+/**
+ * @element sky-carousel
+ *
+ * @summary Carousel component with auto-slide, swipe gestures, navigation controls, and loading state.
+ *
+ * @status stable
+ * @since 1.0.0
+ *
+ * @documentation https://library.sky-ui.com/components/carousel
+ * @dependency sky-icon
+ *
+ * @uiVModel currentIndex slide-changed detail=index
+ *
+ * @slot - Default slot for carousel slides.
+ *
+ * @csspart slider-container - The container element that holds the slides.
+ * @csspart nav-button - The navigation buttons (previous/next).
+ * @csspart index-display - The index display (e.g., "1 / 5").
+ * @csspart bullet-navigation - The container for the bullet navigation.
+ * @csspart loading-overlay - The overlay shown while the carousel is loading.
+ * @csspart loading-spinner - The spinner displayed in the loading overlay.
+ *
+ * @property {number} currentIndex - Current active slide index. Default: `0`.
+ * @property {number} slideCount - Total number of slides (auto-calculated). Default: `0`.
+ * @property {string} maxWidth - Max width of the carousel container. Default: `"600px"`.
+ * @property {boolean} showBullets - Whether to show bullet navigation. Default: `true`.
+ * @property {boolean} auto - Whether to enable auto-sliding. Default: `true`.
+ * @property {boolean} showIndex - Whether to show index display (e.g., "1 / 5"). Default: `false`.
+ * @property {boolean} showButton - Whether to show next/previous navigation buttons. Default: `false`.
+ * @property {number} autoSlideInterval - Interval in ms for auto-sliding. Default: `3000`.
+ * @property {boolean} isLoading - Show loading overlay/spinner. Default: `false`.
+ * @property {number} slidesVisible - Number of slides visible at once. Default: `1`.
+ * @property {number} slidesToScroll - Number of slides to scroll per navigation. Default: `1`.
+ * @property {boolean} partialVisible - Whether non-active slides are partially visible. Default: `false`.
+ * @property {string} slideGap - Gap size between slides. Default: `"0"`.
+ * @method updateSlideCount Recomputes the number of assigned slide elements.
+ * @method startAutoSlide Starts automatic slide progression when eligible.
+ * @method stopAutoSlide Stops automatic slide progression.
+ * @method nextSlide Moves to the next slide window.
+ * @method prevSlide Moves to the previous slide window.
+ * @method setSlide Sets the active slide index and restarts auto-slide timer.
+ *
+ * @fires {CustomEvent<{ index: number }>} slide-changed - Fired when the active slide index changes.
+ *
+ * @Behavior
+ * - Supports pointer drag/swipe to change slides.
+ * - Restarts auto-slide timer when index is explicitly changed via `setSlide`.
+ * - Hides controls when slide count does not exceed `slidesVisible`.
+ *
+ * @example
+ * ```html
+ * <sky-carousel showbutton showbullets autoslideinterval="4000">
+ *   <div>Overview</div>
+ *   <div>Performance</div>
+ *   <div>Forecast</div>
+ * </sky-carousel>
+ * ```
+ * ```vue
+ * <template>
+ *   <sky-carousel showbutton showbullets autoslideinterval="4000">
+ *     <div>Overview</div>
+ *     <div>Performance</div>
+ *     <div>Forecast</div>
+ *   </sky-carousel>
+ * </template>
+ * ```
+ * ```jsx
+ * export default function Demo() {
+ *   return (
+ *     <sky-carousel showbutton showbullets autoslideinterval="4000">
+ *       <div>Overview</div>
+ *       <div>Performance</div>
+ *       <div>Forecast</div>
+ *     </sky-carousel>
+ *   );
+ * }
+ * ```
+ */
+export declare class SkyCarousel extends LitElement {
+    static dependencies: Record<string, CustomElementConstructor>;
+    /** Current active slide index. @default 0 */
+    currentIndex: number;
+    /** Total number of slides (auto-calculated). @default 0 */
+    slideCount: number;
+    /** Max width of the carousel container. @default "600px" */
+    maxWidth: string;
+    /** Whether to show bullet navigation. @default true */
+    showBullets: boolean;
+    /** Whether to enable auto-sliding. @default true */
+    auto: boolean;
+    /** Whether to show index display (e.g., "1 / 5"). @default false */
+    showIndex: boolean;
+    /** Whether to show next/previous navigation buttons. @default false */
+    showButton: boolean;
+    /** Interval in ms for auto-sliding. @default 3000 */
+    autoSlideInterval: number;
+    /** Show loading overlay/spinner. @default false */
+    isLoading: boolean;
+    /** Number of slides visible at once. @default 1 */
+    slidesVisible: number;
+    /** Number of slides to scroll per navigation. @default 1 */
+    slidesToScroll: number;
+    /** Whether non-active slides are partially visible. @default false */
+    partialVisible: boolean;
+    /** Gap size between slides. @default "0" */
+    slideGap: string;
+    private isDragging;
+    private startX;
+    private currentX;
+    private autoSlideTimer;
+    static styles: import("lit").CSSResult;
+    /**
+     * Lifecycle callback that is invoked when the custom element is added to the DOM.
+     *
+     * This method performs the following actions:
+     * - Calls the parent class's `connectedCallback` method.
+     * - Updates the slide count for the carousel.
+     * - Sets the maximum width of the carousel if `maxWidth` is defined.
+     * - Starts the automatic slide transition.
+     * - Registers pointer event listeners for drag/swipe interactions.
+     */
+    connectedCallback(): void;
+    /**
+     * Called when the custom element is disconnected from the document's DOM.
+     *
+     * This method performs cleanup by stopping the auto-slide functionality and
+     * removing all pointer event listeners that were previously attached.
+     * It also calls the superclass's `disconnectedCallback` to ensure proper teardown.
+     *
+     * @override
+     */
+    disconnectedCallback(): void;
+    /**
+     * Lifecycle method called before the component updates.
+     *
+     * @param changedProps - A map containing the properties that have changed and their previous values.
+     * @override
+     *
+     * Calls the superclass's `willUpdate` method, then checks if the `autoSlideInterval` property has changed.
+     * If so, it starts the auto-slide functionality by calling `startAutoSlide()`.
+     */
+    willUpdate(changedProps: Map<string | number | symbol, unknown>): void;
+    /**
+     * Handles the pointer down event to initiate dragging.
+     *
+     * Sets the `isDragging` flag to `true` and records the starting X position
+     * of the pointer. Also initializes the current X position for tracking movement.
+     *
+     * @param e - The pointer event containing the X coordinate of the pointer.
+     */
+    private onPointerDown;
+    /**
+     * Handles the pointer move event during a drag operation.
+     *
+     * Updates the `currentX` property with the current horizontal position of the pointer
+     * if a drag is in progress (`isDragging` is true). If not dragging, the function returns early.
+     *
+     * @param e - The pointer event containing the current pointer position.
+     */
+    private onPointerMove;
+    /**
+     * Handles the pointer up event for the carousel.
+     *
+     * Determines if a swipe gesture has occurred based on the horizontal movement
+     * between the pointer down and pointer up events. If the swipe distance exceeds
+     * a defined threshold, it triggers navigation to the previous or next slide.
+     * Resets dragging state and pointer positions after handling the event.
+     *
+     * @remarks
+     * - Swiping right (delta > threshold) navigates to the previous slide.
+     * - Swiping left (delta < -threshold) navigates to the next slide.
+     * - No action is taken if the swipe distance does not exceed the threshold.
+     */
+    private onPointerUp;
+    /**
+     * Updates the `slideCount` property based on the number of elements assigned to the default slot.
+     *
+     * This method queries the shadow DOM for a <slot> element, retrieves its assigned elements,
+     * and sets the `slideCount` to the number of these elements. If the slot is not found,
+     * `slideCount` remains unchanged.
+     */
+    /**
+     * Recomputes slide count from assigned default-slot elements.
+     *
+     * @returns {void}
+     */
+    updateSlideCount(): void;
+    /**
+     * Starts the automatic slide transition for the carousel.
+     *
+     * This method first stops any existing auto-slide timer, then checks if
+     * auto-sliding is enabled (`this.auto`), the interval is greater than zero,
+     * and there are more slides than are currently visible. If all conditions
+     * are met, it sets up a timer to automatically advance to the next slide
+     * at the specified interval (`this.autoSlideInterval`).
+     *
+     * @remarks
+     * - If auto-sliding is already running, it will be restarted.
+     * - The auto-slide will only start if there are enough slides to scroll.
+     */
+    /**
+     * Starts automatic slide progression when eligible.
+     *
+     * @returns {void}
+     */
+    startAutoSlide(): void;
+    /**
+     * Stops the automatic slide transition by clearing the interval timer.
+     * If the auto-slide timer is active, this method will clear it and reset the timer variable to null.
+     */
+    /**
+     * Stops automatic slide progression.
+     *
+     * @returns {void}
+     */
+    stopAutoSlide(): void;
+    /**
+     * Advances the carousel to the next set of slides.
+     *
+     * Calculates the next index based on the current index and the number of slides to scroll.
+     * If the next index exceeds the maximum possible starting index for visible slides,
+     * the carousel wraps around to the beginning (index 0).
+     * Otherwise, it moves to the next calculated index, ensuring it does not exceed the bounds.
+     *
+     * @returns {void}
+     */
+    /**
+     * Moves to the next slide window.
+     *
+     * @returns {void}
+     */
+    nextSlide: () => void;
+    /**
+     * Moves the carousel to the previous set of slides.
+     *
+     * Decrements the `currentIndex` by the number of slides to scroll.
+     * If the new index is less than zero, wraps around to the last visible set of slides.
+     * Otherwise, ensures the index does not go below zero.
+     *
+     * @returns void
+     */
+    /**
+     * Moves to the previous slide window.
+     *
+     * @returns {void}
+     */
+    prevSlide: () => void;
+    /**
+     * Sets the current slide index, ensuring it does not exceed the maximum allowed index
+     * based on the total slide count and the number of visible slides.
+     * Also restarts the auto-slide timer by stopping and starting it.
+     *
+     * @param index - The target slide index to display.
+     */
+    /**
+     * Sets the active slide index and restarts auto-slide timing.
+     *
+     * @param index Target slide index.
+     * @returns {void}
+     */
+    setSlide(index: number): void;
+    render(): import("lit-html").TemplateResult<1>;
+}