@warp-ds/elements 2.2.0-next.29 → 2.2.0-next.30

package/dist/packages/pageindicator/pageindicator.stories.js

@@ -1,71 +0,0 @@
-import { html, LitElement } from 'lit';
-import './index.js';
-export default {
-    component: 'w-pageindicator',
-    title: 'Navigation/PageIndicator',
-    render: ({ pageCount, selectedPage }) => html `
-    <w-pageindicator page-count=${pageCount} selected-page=${selectedPage}></w-pageindicator>
-  `,
-    argTypes: {
-        pageCount: {
-            control: { type: 'number' },
-        },
-        selectedPage: {
-            control: { type: 'number' },
-        },
-    },
-};
-export const Default = {
-    args: {
-        pageCount: 5,
-        selectedPage: 1,
-    },
-};
-export const InsideContainer = () => html `
-  <div style="display: grid; height: 60vh; border: 1px solid lightgrey;">
-    <w-pageindicator page-count="5" selected-page="1" style="padding-bottom: 12px; align-self: end;"> </w-pageindicator>
-  </div>
-`;
-class PageIndicatorChangePage extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.page = 1;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this.startPageChanger();
-    }
-    startPageChanger() {
-        setInterval(() => {
-            if (this.page > 4) {
-                this.page = 1;
-            }
-            else {
-                this.page = this.page + 1;
-            }
-        }, 1000);
-    }
-    render() {
-        return html `
-      <div style="display: grid; height: 60vh; border: 1px solid lightgrey;">
-        <div style="align-self: center; justify-self: center;">Page ${this.page}</div>
-        <w-pageindicator page-count="5" selected-page=${this.page} style="padding-bottom: 12px; align-self: end;"> </w-pageindicator>
-      </div>
-    `;
-    }
-}
-if (!customElements.get('page-indicator-change-page')) {
-    customElements.define('page-indicator-change-page', PageIndicatorChangePage);
-}
-export const InsideContainerChangePage = () => html ` <page-indicator-change-page></page-indicator-change-page> `;
-export const InsideContainer10Pages = () => html `
-  <div style="display: grid; height: 60vh; border: 1px solid lightgrey;">
-    <w-pageindicator page-count="10" selected-page="3" style="padding-bottom: 12px; align-self: end;"> </w-pageindicator>
-  </div>
-`;
-export const OutsideContainer = () => html `
-  <div style="height: 450px; border: 1px solid lightgrey;">
-    <div style="height: 300px; border-bottom: 1px solid #e6e6e6;"></div>
-    <w-pageindicator page-count="5" selected-page="1" style="padding-top: 16px;"> </w-pageindicator>
-  </div>
-`;

package/dist/packages/pageindicator/react.d.ts

@@ -1,2 +0,0 @@
-import { WarpPageIndicator } from '.';
-export declare const PageIndicator: import("@lit/react").ReactWebComponent<WarpPageIndicator, {}>;

package/dist/packages/pageindicator/react.js

@@ -1,11 +0,0 @@
-import { LitElement } from 'lit';
-import { createComponent } from '@lit/react';
-import React from 'react';
-// decouple from CDN by providing a dummy class
-class Component extends LitElement {
-}
-export const PageIndicator = createComponent({
-    tagName: 'w-pageindicator',
-    elementClass: Component,
-    react: React,
-});

package/dist/packages/pageindicator/style.d.ts

@@ -1 +0,0 @@
-export declare const styles: import("lit").CSSResult;

package/dist/packages/pageindicator/style.js

@@ -1,26 +0,0 @@
-import { css } from 'lit';
-export const styles = css `
-  .w-pageindicator {
-    display: grid;
-    justify-content: center;
-    height: max-content;
-    pointer-events: none;
-  }
-
-  .w-pageindicator--container {
-    display: grid;
-    grid-auto-flow: column;
-    gap: 8px;
-  }
-
-  .w-pageindicator--dot {
-    background-color: var(--w-s-color-background-disabled);
-    border-radius: 5px;
-    width: 10px;
-    height: 10px;
-  }
-
-  .w-pageindicator--selecteddot {
-    background-color: var(--w-s-color-icon-selected);
-  }
-`;

package/dist/packages/pagination/index.d.ts

@@ -1,32 +0,0 @@
-import { LitElement } from 'lit';
-import '@warp-ds/icons/elements/chevron-double-left-16';
-import '@warp-ds/icons/elements/chevron-left-16';
-import '@warp-ds/icons/elements/chevron-right-16';
-/**
- * Pagination allows users to navigate through multiple pages of content by providing navigation controls with page numbers and directional arrows.
- *
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/navigation-pagination--docs)
- *
- * @fires {CustomEvent} page-click - Triggered when a link button in the pagination is clicked. Contains the page number in `string` form.
- */
-declare class WarpPagination extends LitElement {
-    #private;
-    baseUrl: string;
-    pages: number;
-    currentPageNumber: number;
-    visiblePages: number;
-    static styles: import("lit").CSSResult[];
-    constructor();
-    /** @internal */
-    get shouldShowShowFirstPageButton(): boolean;
-    /** @internal */
-    get shouldShowPreviousPageButton(): boolean;
-    /** @internal */
-    get shouldShowNextPageButton(): boolean;
-    /** @internal */
-    get currentPageIndex(): number;
-    /** @internal */
-    get visiblePageNumbers(): number[];
-    render(): import("lit").TemplateResult<1>;
-}
-export { WarpPagination };