@warp-ds/elements 2.2.0-next.1 → 2.2.0-next.11

package/dist/packages/pagination/react.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { createComponent } from '@lit/react';
+import { WarpPagination } from './index.js';
+export const Pagination = createComponent({
+    tagName: 'w-pagination',
+    elementClass: WarpPagination,
+    react: React,
+});

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

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

package/dist/packages/pagination/styles.js

@@ -0,0 +1,2 @@
+import { css } from 'lit';
+export const styles = css `*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.hover\\:bg-clip-padding:hover{-webkit-background-clip:padding-box;background-clip:padding-box}.hover\\:bg-\\[--w-color-button-pill-background-hover\\]:hover{background-color:var(--w-color-button-pill-background-hover)}.active\\:bg-\\[--w-color-button-pill-background-active\\]:active{background-color:var(--w-color-button-pill-background-active)}.border-0{border-width:0}.rounded-full{border-radius:9999px}.flex{display:flex}.inline-flex{display:inline-flex}.hover\\:no-underline:hover,.focus\\:no-underline:focus{text-decoration:none}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.items-center{align-items:center}.justify-center{justify-content:center}.static{position:static}.s-bg-primary{background-color:var(--w-s-color-background-primary)}.s-text-inverted{color:var(--w-s-color-text-inverted)}.s-text-link{color:var(--w-s-color-text-link)}.s-icon{color:var(--w-s-color-icon)}.min-h-\\[44px\\]{min-height:44px}.min-w-\\[44px\\]{min-width:44px}.p-4{padding:.4rem}.p-8{padding:.8rem}.visible{visibility:visible}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (min-width:768px){.md\\:block{display:block}}`;

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

@@ -1,34 +1,55 @@
-declare const WarpPill_base: {
-    new (): {
-        [x: string]: any;
-    };
-    [x: string]: any;
-    createProperty(name: any, options: any): void;
+import { LitElement } from 'lit';
+import '@warp-ds/icons/elements/close-16';
+export declare const pillStyles: {
+    wrapper: string;
+    button: string;
+    suggestion: string;
+    filter: string;
+    label: string;
+    labelWithoutClose: string;
+    labelWithClose: string;
+    close: string;
+    closeIcon: string;
+    a11y: string;
 };
-export class WarpPill extends WarpPill_base {
-    static styles: any[];
-    static properties: {
-        canClose: {
-            type: BooleanConstructor;
-        };
-        suggestion: {
-            type: BooleanConstructor;
-        };
-        openSrLabel: {
-            type: StringConstructor;
-        };
-        closeSrLabel: {
-            type: StringConstructor;
-        };
-    };
+/**
+ * Pill is a type of button that is often used as a filter, but can also be used as a rounded button for overlays, etc.
+ *
+ * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-pill--docs)
+ */
+declare class WarpPill extends LitElement {
     canClose: boolean;
     suggestion: boolean;
+    /**
+     * @deprecated Used "open-arial-label" instead.
+     */
+    openSrLabel: string;
+    openAriaLabel: string;
+    /**
+     * @deprecated Used "close-arial-label" instead.
+     */
+    closeSrLabel: string;
+    closeAriaLabel: string;
+    /** @internal */
     openFilterSrText: string;
+    /** @internal */
     removeFilterSrText: string;
+    static styles: import("lit").CSSResult[];
+    constructor();
+    /** @internal */
     get _labelClasses(): string;
+    /** @internal */
     get _closeClasses(): string;
+    /** @internal */
     _onClick(): void;
+    /** @internal */
     _onClose(): void;
+    connectedCallback(): void;
     render(): import("lit").TemplateResult<1>;
 }
-export {};
+export { WarpPill };
+declare global {
+    interface HTMLElementTagNameMap {
+        'w-pill': WarpPill;
+    }
+}