@prioticket/design-system-web 1.0.0

package/dist/theme-with-fonts.css

@@ -0,0 +1,372 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --md-sys-color-primary: #006eff;
+  --md-sys-color-on-primary: #ffffff;
+  --md-sys-color-primary-container: #eff5fc;
+  --md-sys-color-on-primary-container: #006eff;
+  --md-sys-color-surface-tint: #006eff;
+  --md-sys-color-secondary: #ffffff;
+  --md-sys-color-on-secondary: #006eff;
+  --md-sys-color-secondary-container: #eff5fc;
+  --md-sys-color-on-secondary-container: #006eff;
+  --md-sys-color-tertiary: #ffffff;
+  --md-sys-color-on-tertiary: #080808;
+  --md-sys-color-tertiary-container: #e2e2e2;
+  --md-sys-color-on-tertiary-container: #080808;
+  --md-sys-color-error: #e84020;
+  --md-sys-color-on-error: #ffffff;
+  --md-sys-color-error-container: #fbf3f1;
+  --md-sys-color-on-error-container: #e84020;
+  --md-sys-color-background: #ffffff;
+  --md-sys-color-on-background: #080808;
+  --md-sys-color-surface: #fcfcfc;
+  --md-sys-color-on-surface: #080808;
+  --md-sys-color-surface-variant: #ffffff;
+  --md-sys-color-on-surface-variant: #303030;
+  --md-sys-color-outline: #d1d1d1;
+  --md-sys-color-outline-variant: #dbdbdb;
+  --md-sys-color-shadow: #080808;
+  --md-sys-color-scrim: #080808;
+  --md-sys-color-inverse-surface: #080808;
+  --md-sys-color-inverse-on-surface: #eff5fc;
+  --md-sys-color-inverse-primary: #eff5fc;
+  --md-sys-color-surface-dim: #fcfcfc;
+  --md-sys-color-surface-bright: #ffffff;
+  --md-sys-color-surface-container-lowest: #ffffff;
+  --md-sys-color-surface-container-low: #ffffff;
+  --md-sys-color-surface-container: #ffffff;
+  --md-sys-color-surface-container-high: #ffffff;
+  --md-sys-color-surface-container-highest: #ffffff;
+  --md-sys-color-primary-hover: #006eff0d;
+  --md-sys-color-primary-focus: #006eff1a;
+  --md-sys-color-primary-pressed: #006eff26;
+  --md-sys-color-on-primary-hover: #ffffff0d;
+  --md-sys-color-on-primary-focus: #ffffff1a;
+  --md-sys-color-on-primary-pressed: #ffffff26;
+  --md-sys-color-primary-container-hover: #006eff0d;
+  --md-sys-color-primary-container-focus: #006eff1a;
+  --md-sys-color-primary-container-pressed: #006eff26;
+  --md-sys-color-on-primary-container-hover: #006eff0d;
+  --md-sys-color-on-primary-container-focus: #006eff1a;
+  --md-sys-color-on-primary-container-pressed: #006eff26;
+  --md-sys-color-secondary-hover: #ffffff0d;
+  --md-sys-color-secondary-focus: #ffffff1a;
+  --md-sys-color-secondary-pressed: #ffffff26;
+  --md-sys-color-on-secondary-hover: #006eff0d;
+  --md-sys-color-on-secondary-focus: #006eff1a;
+  --md-sys-color-on-secondary-pressed: #006eff26;
+  --md-sys-color-secondary-container-hover: #006eff0d;
+  --md-sys-color-secondary-container-focus: #006eff1a;
+  --md-sys-color-secondary-container-pressed: #006eff26;
+  --md-sys-color-on-secondary-container-hover: #006eff0d;
+  --md-sys-color-on-secondary-container-focus: #006eff1a;
+  --md-sys-color-on-secondary-container-pressed: #006eff26;
+  --md-sys-color-tertiary-hover: #ffffff0d;
+  --md-sys-color-tertiary-focus: #ffffff1a;
+  --md-sys-color-tertiary-pressed: #ffffff26;
+  --md-sys-color-on-tertiary-hover: #0808080d;
+  --md-sys-color-on-tertiary-focus: #0808081a;
+  --md-sys-color-on-tertiary-pressed: #08080826;
+  --md-sys-color-tertiary-container-hover: #0808080d;
+  --md-sys-color-tertiary-container-focus: #0808081a;
+  --md-sys-color-tertiary-container-pressed: #08080826;
+  --md-sys-color-on-tertiary-container-hover: #0808080d;
+  --md-sys-color-on-tertiary-container-focus: #0808081a;
+  --md-sys-color-on-tertiary-container-pressed: #08080826;
+  --md-sys-color-error-hover: #e840200d;
+  --md-sys-color-error-focus: #e840201a;
+  --md-sys-color-error-pressed: #e8402026;
+  --md-sys-color-on-error-hover: #ffffff0d;
+  --md-sys-color-on-error-focus: #ffffff1a;
+  --md-sys-color-on-error-pressed: #ffffff26;
+  --md-sys-color-error-container-hover: #e840200d;
+  --md-sys-color-error-container-focus: #e840201a;
+  --md-sys-color-error-container-pressed: #e8402026;
+  --md-sys-color-on-error-container-hover: #e840200d;
+  --md-sys-color-on-error-container-focus: #e840201a;
+  --md-sys-color-on-error-container-pressed: #e8402026;
+  --md-sys-color-outline-hover: #0808080d;
+  --md-sys-color-outline-focus: #0808081a;
+  --md-sys-color-outline-pressed: #08080826;
+  --md-sys-color-background-hover: #ffffff0d;
+  --md-sys-color-background-focus: #ffffff1a;
+  --md-sys-color-background-pressed: #ffffff26;
+  --md-sys-color-on-background-hover: #0808080d;
+  --md-sys-color-on-background-focus: #0808081a;
+  --md-sys-color-on-background-pressed: #08080826;
+  --md-sys-color-surface-hover: #ffffff0d;
+  --md-sys-color-surface-focus: #ffffff1a;
+  --md-sys-color-surface-pressed: #ffffff26;
+  --md-sys-color-on-surface-hover: #0808080d;
+  --md-sys-color-on-surface-focus: #0808081a;
+  --md-sys-color-on-surface-pressed: #08080826;
+  --md-sys-color-surface-variant-hover: #ffffff0d;
+  --md-sys-color-surface-variant-focus: #ffffff1a;
+  --md-sys-color-surface-variant-pressed: #ffffff26;
+  --md-sys-color-on-surface-variant-hover: #0808080d;
+  --md-sys-color-on-surface-variant-focus: #0808081a;
+  --md-sys-color-on-surface-variant-pressed: #08080826;
+  --md-sys-color-inverse-surface-hover: #0808080d;
+  --md-sys-color-inverse-surface-focus: #0808081a;
+  --md-sys-color-inverse-surface-pressed: #08080826;
+  --md-sys-color-inverse-on-surface-hover: #006eff0d;
+  --md-sys-color-inverse-on-surface-focus: #006eff1a;
+  --md-sys-color-inverse-on-surface-pressed: #006eff26;
+  --md-sys-color-inverse-primary-hover: #006eff0d;
+  --md-sys-color-inverse-primary-focus: #006eff1a;
+  --md-sys-color-inverse-primary-pressed: #006eff26;
+  --md-sys-color-shadow-hover: #0808080d;
+  --md-sys-color-shadow-focus: #0808081a;
+  --md-sys-color-shadow-pressed: #08080826;
+  --md-sys-color-surface-tint-hover: #006eff0d;
+  --md-sys-color-surface-tint-focus: #006eff1a;
+  --md-sys-color-surface-tint-pressed: #006eff26;
+  --md-sys-color-outline-variant-hover: #0808080d;
+  --md-sys-color-outline-variant-focus: #0808081a;
+  --md-sys-color-outline-variant-pressed: #08080826;
+  --md-sys-color-scrim-hover: #0808080d;
+  --md-sys-color-scrim-focus: #0808081a;
+  --md-sys-color-scrim-pressed: #08080826;
+  --md-sys-color-surface-container-highest-hover: #ffffff0d;
+  --md-sys-color-surface-container-highest-focus: #ffffff1a;
+  --md-sys-color-surface-container-highest-pressed: #ffffff26;
+  --md-sys-color-surface-container-high-hover: #ffffff0d;
+  --md-sys-color-surface-container-high-focus: #ffffff1a;
+  --md-sys-color-surface-container-high-pressed: #ffffff26;
+  --md-sys-color-surface-container-hover: #ffffff0d;
+  --md-sys-color-surface-container-focus: #ffffff1a;
+  --md-sys-color-surface-container-pressed: #ffffff26;
+  --md-sys-color-surface-container-low-hover: #ffffff0d;
+  --md-sys-color-surface-container-low-focus: #ffffff1a;
+  --md-sys-color-surface-container-low-pressed: #ffffff26;
+  --md-sys-color-surface-container-lowest-hover: #ffffff0d;
+  --md-sys-color-surface-container-lowest-focus: #ffffff1a;
+  --md-sys-color-surface-container-lowest-pressed: #ffffff26;
+  --md-sys-color-surface-bright-hover: #ffffff0d;
+  --md-sys-color-surface-bright-focus: #ffffff1a;
+  --md-sys-color-surface-bright-pressed: #ffffff26;
+  --md-sys-color-surface-dim-hover: #ffffff0d;
+  --md-sys-color-surface-dim-focus: #ffffff1a;
+  --md-sys-color-surface-dim-pressed: #ffffff26;
+  --md-sys-custom-section-background: #f5f5f5;
+  --md-sys-scale-0: 0;
+  --md-sys-scale-25: 1;
+  --md-sys-scale-50: 2;
+  --md-sys-scale-100: 5;
+  --md-sys-scale-200: 8;
+  --md-sys-scale-300: 12;
+  --md-sys-scale-400: 16;
+  --md-sys-scale-500: 20;
+  --md-sys-scale-600: 24;
+  --md-sys-scale-700: 28;
+  --md-sys-scale-800: 32;
+  --md-sys-scale-900: 36;
+  --md-sys-scale-1000: 40;
+  --md-sys-scale-1100: 48;
+  --md-sys-scale-1200: 56;
+  --md-sys-scale-1300: 64;
+  --md-sys-scale-1400: 72;
+  --md-sys-scale-1500: 96;
+  --md-sys-scale-1600: 128;
+  --md-sys-scale-1700: 256;
+  --md-sys-scale-1800: 512;
+  --md-sys-outline-width: 1px;
+  --md-sys-outline-width-medium: 2px;
+  --md-sys-outline-width-thick: 5px;
+  --md-sys-outline-width-extra-thick: 8px;
+  --md-sys-outline-width-none: 0;
+  --md-sys-shape-corner-extra-small: 2px;
+  --md-sys-shape-corner-small: 5px;
+  --md-sys-shape-corner-medium: 8px;
+  --md-sys-shape-corner-large: 12px;
+  --md-sys-shape-corner-none: 0;
+  --md-sys-shape-corner-full: 1000px;
+  --md-sys-spacing-50: 2px;
+  --md-sys-spacing-100: 5px;
+  --md-sys-spacing-200: 8px;
+  --md-sys-spacing-300: 12px;
+  --md-sys-spacing-400: 16px;
+  --md-sys-spacing-500: 20px;
+  --md-sys-spacing-600: 24px;
+  --md-sys-spacing-700: 28px;
+  --md-sys-spacing-800: 32px;
+  --md-sys-spacing-900: 36px;
+  --md-sys-spacing-1000: 40px;
+  --md-sys-spacing-none: 0;
+  --md-sys-padding-50: 2px;
+  --md-sys-padding-100: 5px;
+  --md-sys-padding-200: 8px;
+  --md-sys-padding-300: 12px;
+  --md-sys-padding-400: 16px;
+  --md-sys-padding-500: 20px;
+  --md-sys-padding-600: 24px;
+  --md-sys-padding-700: 28px;
+  --md-sys-padding-800: 32px;
+  --md-sys-padding-900: 36px;
+  --md-sys-padding-1000: 40px;
+  --md-sys-padding-1100: 48px;
+  --md-sys-padding-1200: 56px;
+  --md-sys-padding-1300: 64px;
+  --md-sys-padding-1400: 72px;
+  --md-sys-padding-none: 0;
+  --md-sys-typescale-title-large-font: Proxima Nova;
+  --md-sys-typescale-title-large-weight: 400;
+  --md-sys-typescale-title-large-weight-prominent: 600;
+  --md-sys-typescale-title-large-size: 1.375rem;
+  --md-sys-typescale-title-large-tracking: 0;
+  --md-sys-typescale-title-large-line-height: 1.75rem;
+  --md-sys-typescale-title-medium-font: Proxima Nova;
+  --md-sys-typescale-title-medium-weight: 600;
+  --md-sys-typescale-title-medium-weight-prominent: 700;
+  --md-sys-typescale-title-medium-size: 1rem;
+  --md-sys-typescale-title-medium-tracking: 0.00937em;
+  --md-sys-typescale-title-medium-line-height: 1.5rem;
+  --md-sys-typescale-title-small-font: Proxima Nova;
+  --md-sys-typescale-title-small-weight: 600;
+  --md-sys-typescale-title-small-weight-prominent: 700;
+  --md-sys-typescale-title-small-size: 0.875rem;
+  --md-sys-typescale-title-small-tracking: 0.00357em;
+  --md-sys-typescale-title-small-line-height: 1.25rem;
+  --md-sys-typescale-label-large-font: Proxima Nova;
+  --md-sys-typescale-label-large-weight: 600;
+  --md-sys-typescale-label-large-weight-prominent: 700;
+  --md-sys-typescale-label-large-size: 0.875rem;
+  --md-sys-typescale-label-large-tracking: 0.00357em;
+  --md-sys-typescale-label-large-line-height: 1.25rem;
+  --md-sys-typescale-label-medium-font: Proxima Nova;
+  --md-sys-typescale-label-medium-weight: 600;
+  --md-sys-typescale-label-medium-weight-prominent: 700;
+  --md-sys-typescale-label-medium-size: 0.75rem;
+  --md-sys-typescale-label-medium-tracking: 0.02083em;
+  --md-sys-typescale-label-medium-line-height: 1rem;
+  --md-sys-typescale-label-small-font: Proxima Nova;
+  --md-sys-typescale-label-small-weight: 600;
+  --md-sys-typescale-label-small-weight-prominent: 700;
+  --md-sys-typescale-label-small-size: 0.6875rem;
+  --md-sys-typescale-label-small-tracking: 0.02273em;
+  --md-sys-typescale-label-small-line-height: 1rem;
+  --md-sys-typescale-headline-small-font: Proxima Nova;
+  --md-sys-typescale-headline-small-weight: 400;
+  --md-sys-typescale-headline-small-weight-prominent: 600;
+  --md-sys-typescale-headline-small-size: 1.5rem;
+  --md-sys-typescale-headline-small-tracking: 0;
+  --md-sys-typescale-headline-small-line-height: 2rem;
+  --md-sys-typescale-headline-medium-font: Proxima Nova;
+  --md-sys-typescale-headline-medium-weight: 400;
+  --md-sys-typescale-headline-medium-weight-prominent: 600;
+  --md-sys-typescale-headline-medium-size: 1.75rem;
+  --md-sys-typescale-headline-medium-tracking: 0;
+  --md-sys-typescale-headline-medium-line-height: 2.25rem;
+  --md-sys-typescale-headline-large-font: Proxima Nova;
+  --md-sys-typescale-headline-large-weight: 400;
+  --md-sys-typescale-headline-large-weight-prominent: 600;
+  --md-sys-typescale-headline-large-size: 2rem;
+  --md-sys-typescale-headline-large-tracking: 0;
+  --md-sys-typescale-headline-large-line-height: 2.5rem;
+  --md-sys-typescale-display-small-font: Proxima Nova;
+  --md-sys-typescale-display-small-weight: 400;
+  --md-sys-typescale-display-small-weight-prominent: 600;
+  --md-sys-typescale-display-small-size: 2.25rem;
+  --md-sys-typescale-display-small-tracking: 0;
+  --md-sys-typescale-display-small-line-height: 2.75rem;
+  --md-sys-typescale-display-medium-font: Proxima Nova;
+  --md-sys-typescale-display-medium-weight: 400;
+  --md-sys-typescale-display-medium-weight-prominent: 600;
+  --md-sys-typescale-display-medium-size: 2.8125rem;
+  --md-sys-typescale-display-medium-line-height: 3.25rem;
+  --md-sys-typescale-display-medium-tracking: 0;
+  --md-sys-typescale-display-large-font: Proxima Nova;
+  --md-sys-typescale-display-large-weight: 400;
+  --md-sys-typescale-display-large-weight-prominent: 600;
+  --md-sys-typescale-display-large-size: 3.5625rem;
+  --md-sys-typescale-display-large-tracking: -0.00439em;
+  --md-sys-typescale-display-large-line-height: 4rem;
+  --md-sys-typescale-body-large-font: Proxima Nova;
+  --md-sys-typescale-body-large-weight: 400;
+  --md-sys-typescale-body-large-weight-prominent: 600;
+  --md-sys-typescale-body-large-size: 1rem;
+  --md-sys-typescale-body-large-tracking: 0.00625em;
+  --md-sys-typescale-body-large-line-height: 1.5rem;
+  --md-sys-typescale-body-medium-font: Proxima Nova;
+  --md-sys-typescale-body-medium-weight: 400;
+  --md-sys-typescale-body-medium-weight-prominent: 600;
+  --md-sys-typescale-body-medium-size: 0.875rem;
+  --md-sys-typescale-body-medium-tracking: 0.00357em;
+  --md-sys-typescale-body-medium-line-height: 1.25rem;
+  --md-sys-typescale-body-small-font: Proxima Nova;
+  --md-sys-typescale-body-small-weight: 400;
+  --md-sys-typescale-body-small-weight-prominent: 600;
+  --md-sys-typescale-body-small-size: 0.75rem;
+  --md-sys-typescale-body-small-tracking: 0.00833em;
+  --md-sys-typescale-body-small-line-height: 1rem;
+  --md-sys-elevation-level0: none;
+  --md-sys-elevation-level1: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 1px 3px 1px rgba(0, 0, 0, 0.15);
+  --md-sys-elevation-level2: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 2px 6px 2px rgba(0, 0, 0, 0.15);
+  --md-sys-elevation-level3: 0px 1px 3px rgba(0, 0, 0, 0.3), 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
+  --md-sys-elevation-level4: 0px 2px 3px rgba(0, 0, 0, 0.3), 0px 6px 10px 4px rgba(0, 0, 0, 0.15);
+  --md-sys-elevation-level5: 0px 4px 4px rgba(0, 0, 0, 0.3), 0px 8px 12px 6px rgba(0, 0, 0, 0.15);
+}
+
+
+/**
+ * Font loading for Proxima Nova font family
+ */
+
+@font-face {
+  font-family: 'Proxima Nova';
+  src: url('./fonts/ProximaNova-Regular.woff2') format('woff2');
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Proxima Nova';
+  src: url('./fonts/ProximaNova-Medium.woff2') format('woff2');
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Proxima Nova';
+  src: url('./fonts/ProximaNova-Semibold.woff2') format('woff2');
+  font-weight: 600;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Proxima Nova';
+  src: url('./fonts/ProximaNova-Bold.woff2') format('woff2');
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Proxima Nova';
+  src: url('./fonts/ProximaNova-Light.woff2') format('woff2');
+  font-weight: 300;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Proxima Nova';
+  src: url('./fonts/ProximaNova-Extrabld.woff2') format('woff2');
+  font-weight: 800;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Proxima Nova Condensed';
+  src: url('./fonts/ProximaNovaCond-Semibold.woff2') format('woff2');
+  font-weight: 600;
+  font-style: normal;
+  font-display: swap;
+}

package/dist/theme-with-fonts.es.js

@@ -0,0 +1,2 @@
+import "./theme.es.js";
+import "./fonts.es.js";

package/dist/theme.cjs.js

@@ -0,0 +1 @@
+"use strict";

package/dist/theme.es.js

@@ -0,0 +1 @@
+

package/dist/types/components/pd-button.d.ts

@@ -0,0 +1,30 @@
+import { LitElement } from 'lit';
+import '@material/web/button/filled-button.js';
+import '@material/web/button/outlined-button.js';
+import '@material/web/button/text-button.js';
+import '@material/web/button/elevated-button.js';
+import '@material/web/button/filled-tonal-button.js';
+import '@material/web/icon/icon.js';
+/**
+ * @customElement pd-button
+ * @summary The Prioticket button component using Material Web Components.
+ *
+ * @slot - The default slot for the button's label.
+ *
+ * @cssprop --shape-corner - Overrides the default border radius.
+ */
+export declare class PdButton extends LitElement {
+    /** The style variant of the button. */
+    variant: 'filled' | 'outlined' | 'text' | 'elevated' | 'tonal';
+    /** The size of the button, controlling height, padding, and font size. */
+    size: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+    /** The name of the Material Icon to display. */
+    icon: string;
+    /** If true, the icon will be placed after the label. */
+    iconTrailing: boolean;
+    /** If true, the button is disabled. */
+    disabled: boolean;
+    private getButtonTemplate;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}

package/dist/types/components/pd-card.d.ts

@@ -0,0 +1,8 @@
+import { LitElement } from 'lit';
+export declare class PdCard extends LitElement {
+    variant: 'elevated' | 'filled' | 'outlined';
+    clickable: boolean;
+    render(): import("lit-html").TemplateResult<1>;
+    private _handleClick;
+    static styles: import("lit").CSSResult;
+}

package/dist/types/components/pd-checkbox.d.ts

@@ -0,0 +1,16 @@
+import { LitElement } from 'lit';
+import '@material/web/checkbox/checkbox.js';
+export declare class PdCheckbox extends LitElement {
+    checked: boolean;
+    indeterminate: boolean;
+    disabled: boolean;
+    required: boolean;
+    value: string;
+    name: string;
+    label: string;
+    touchTarget: boolean;
+    render(): import("lit-html").TemplateResult<1>;
+    private _handleChange;
+    private _handleInput;
+    static styles: import("lit").CSSResult;
+}

package/dist/types/components/pd-chip.d.ts

@@ -0,0 +1,26 @@
+import { LitElement } from 'lit';
+import '@material/web/chips/assist-chip.js';
+import '@material/web/chips/filter-chip.js';
+import '@material/web/chips/input-chip.js';
+import '@material/web/chips/suggestion-chip.js';
+import '@material/web/icon/icon.js';
+export declare class PdChip extends LitElement {
+    variant: 'assist' | 'filter' | 'input' | 'suggestion';
+    label: string;
+    disabled: boolean;
+    alwaysFocusable: boolean;
+    hasIcon: boolean;
+    icon: string;
+    selected: boolean;
+    removable: boolean;
+    elevated: boolean;
+    href: string;
+    target: string;
+    avatar: boolean;
+    removeOnly: boolean;
+    private getChipTemplate;
+    render(): import("lit-html").TemplateResult<1>;
+    private _handleClick;
+    private _handleRemove;
+    static styles: import("lit").CSSResult;
+}

package/dist/types/components/pd-dialog.d.ts

@@ -0,0 +1,49 @@
+import { LitElement } from 'lit';
+import '@material/web/dialog/dialog.js';
+import '@material/web/button/text-button.js';
+import '@material/web/button/filled-button.js';
+import '@material/web/icon/icon.js';
+/**
+ * @customElement pd-dialog
+ * @summary The Prioticket dialog component using Material Web Components.
+ *
+ * @slot - The main content of the dialog.
+ * @slot headline - The dialog title/headline.
+ * @slot actions - Action buttons (typically in the bottom area).
+ *
+ * @fires open - Fired when the dialog is opened.
+ * @fires closed - Fired when the dialog is closed.
+ *
+ * @cssprop --shape-corner - Overrides the default border radius.
+ */
+export declare class PdDialog extends LitElement {
+    /** Whether the dialog is currently open. */
+    open: boolean;
+    /** The size/width variant of the dialog. */
+    size: 'small' | 'medium' | 'large' | 'fullscreen';
+    /** The type of dialog - affects styling and behavior. */
+    variant: 'alert' | 'confirm' | 'form' | 'custom';
+    /** The dialog headline/title text. */
+    headline: string;
+    /** Primary action button text. */
+    primaryAction: string;
+    /** Secondary action button text (usually "Cancel"). */
+    secondaryAction: string;
+    /** Whether the dialog is closable by clicking outside or pressing ESC. */
+    closableByBackdrop: boolean;
+    /** Whether to show a close button in the header. */
+    showCloseButton: boolean;
+    private dialogElement;
+    /** Opens the dialog. */
+    openDialog(): void;
+    /** Closes the dialog. */
+    closeDialog(): void;
+    /** Toggles the dialog open state. */
+    toggle(): void;
+    private handleDialogOpen;
+    private handleDialogClose;
+    private handlePrimaryAction;
+    private handleSecondaryAction;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}

package/dist/types/components/pd-expandable-card.d.ts

@@ -0,0 +1,39 @@
+import { LitElement } from 'lit';
+import '@material/web/icon/icon.js';
+import '@material/web/iconbutton/icon-button.js';
+/**
+ * @customElement pd-expandable-card
+ * @summary An expandable card component that can show/hide content with animation.
+ *
+ * @slot header - The main header content (always visible)
+ * @slot - The expandable content (shown when expanded)
+ *
+ * @fires expand - Fired when the card is expanded
+ * @fires collapse - Fired when the card is collapsed
+ */
+export declare class PdExpandableCard extends LitElement {
+    /** The style variant of the card. */
+    variant: 'elevated' | 'filled' | 'outlined';
+    /** Whether the card is expanded by default. */
+    expanded: boolean;
+    /** The icon to show when collapsed (pointing down). */
+    expandIcon: string;
+    /** The icon to show when expanded (pointing up). */
+    collapseIcon: string;
+    /** If true, the entire header area becomes clickable. */
+    headerClickable: boolean;
+    /** Internal state to track expansion */
+    private _expanded;
+    connectedCallback(): void;
+    /** Toggles the expanded state */
+    toggle(): void;
+    /** Expands the card */
+    expand(): void;
+    /** Collapses the card */
+    collapse(): void;
+    private _dispatchExpandEvent;
+    private _handleToggle;
+    private _handleHeaderClick;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}

package/dist/types/components/pd-fab.d.ts

@@ -0,0 +1,17 @@
+import { LitElement } from 'lit';
+import '@material/web/fab/fab.js';
+import '@material/web/fab/branded-fab.js';
+import '@material/web/icon/icon.js';
+export declare class PdFab extends LitElement {
+    variant: 'surface' | 'primary' | 'secondary' | 'tertiary' | 'branded';
+    size: 'small' | 'medium' | 'large';
+    icon: string;
+    label: string;
+    lowered: boolean;
+    disabled: boolean;
+    ariaLabel: string;
+    private getFabTemplate;
+    render(): import("lit-html").TemplateResult<1>;
+    private _handleClick;
+    static styles: import("lit").CSSResult;
+}

package/dist/types/components/pd-icon-button.d.ts

@@ -0,0 +1,24 @@
+import { LitElement } from 'lit';
+import '@material/web/iconbutton/icon-button.js';
+import '@material/web/iconbutton/filled-icon-button.js';
+import '@material/web/iconbutton/filled-tonal-icon-button.js';
+import '@material/web/iconbutton/outlined-icon-button.js';
+import '@material/web/icon/icon.js';
+export declare class PdIconButton extends LitElement {
+    variant: 'standard' | 'filled' | 'tonal' | 'outlined';
+    icon: string;
+    selectedIcon: string;
+    disabled: boolean;
+    toggle: boolean;
+    selected: boolean;
+    href: string;
+    target: string;
+    ariaLabel: string;
+    ariaLabelSelected: string;
+    private getIconButtonTemplate;
+    render(): import("lit-html").TemplateResult<1>;
+    private _handleClick;
+    private _handleInput;
+    private _handleChange;
+    static styles: import("lit").CSSResult;
+}

package/dist/types/components/pd-icon.d.ts

@@ -0,0 +1,9 @@
+import { LitElement } from 'lit';
+import '@material/web/icon/icon.js';
+export declare class PdIcon extends LitElement {
+    name: string;
+    size: 'small' | 'medium' | 'large';
+    variant: 'filled' | 'outlined' | 'round' | 'sharp' | 'two-tone';
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}

package/dist/types/components/pd-list.d.ts

@@ -0,0 +1,36 @@
+import { LitElement } from 'lit';
+import '@material/web/list/list.js';
+import '@material/web/list/list-item.js';
+import '@material/web/divider/divider.js';
+import '@material/web/icon/icon.js';
+export declare class PdList extends LitElement {
+    role: string;
+    tabindex: number;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}
+export declare class PdListItem extends LitElement {
+    type: 'text' | 'link' | 'button';
+    headline: string;
+    supportingText: string;
+    trailingSupportingText: string;
+    href: string;
+    target: string;
+    disabled: boolean;
+    icon: string;
+    trailingIcon: string;
+    avatar: string;
+    image: string;
+    tabindex?: number;
+    private getListItemTemplate;
+    render(): import("lit-html").TemplateResult<1>;
+    private _handleClick;
+    private _handleKeydown;
+    static styles: import("lit").CSSResult;
+}
+export declare class PdListDivider extends LitElement {
+    inset: boolean;
+    role: string;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}