@redvars/peacock 3.3.0 → 3.3.2

package/dist/src/accordion/accordion-item.d.ts

@@ -4,6 +4,7 @@ import { LitElement } from 'lit';
  * @tag wc-accordion-item
  * @rawTag accordion-item
  * @summary An accordion item is single item in an accordion list. It contains a header and a content section that can be expanded or collapsed by the user.
+ * @parentRawTag accordion
  *
  * @example
  * ```html

package/dist/src/breadcrumb/breadcrumb/breadcrumb.d.ts

@@ -1,4 +1,5 @@
 import { LitElement } from 'lit';
+import { BreadcrumbItem } from '../breadcrumb-item/breadcrumb-item.js';
 /**
  * @label Breadcrumb
  * @tag wc-breadcrumb
@@ -21,6 +22,7 @@ import { LitElement } from 'lit';
  */
 export declare class Breadcrumb extends LitElement {
     static styles: import("lit").CSSResultGroup[];
+    static Item: typeof BreadcrumbItem;
     /**
      * Accessible label for the breadcrumb navigation landmark.
      * @default "Breadcrumb"

package/dist/src/breadcrumb/breadcrumb-item/breadcrumb-item.d.ts

@@ -3,6 +3,7 @@ import { LitElement } from 'lit';
  * @label Breadcrumb Item
  * @tag wc-breadcrumb-item
  * @rawTag breadcrumb-item
+ * @parentRawTag breadcrumb
  * @summary A breadcrumb item component that represents a single item in a breadcrumb navigation.
  * @tags navigation
  *

package/dist/src/button/button-group/button-group.d.ts

@@ -1,4 +1,6 @@
 import { LitElement } from 'lit';
+import { Button } from '../button/button.js';
+import { IconButton } from '../icon-button/icon-button.js';
 /**
  * @label Button Group
  * @tag wc-button-group
@@ -18,6 +20,8 @@ import { LitElement } from 'lit';
  */
 export declare class ButtonGroup extends LitElement {
     static styles: import("lit").CSSResultGroup[];
+    static Button: typeof Button;
+    static IconButton: typeof IconButton;
     /**
      * Button size.
      * Possible values are `"sm"`, `"md"`, `"lg"`. Defaults to `"md"`.

package/dist/src/card/card.d.ts

@@ -0,0 +1,27 @@
+import { LitElement } from 'lit';
+type CardVariant = 'elevated' | 'filled' | 'outlined';
+type CardElevation = 0 | 1 | 2 | 3 | 4 | 5;
+/**
+ * @label Card
+ * @tag wc-card
+ * @rawTag card
+ * @summary A Material 3 inspired card surface for grouping related content.
+ * @cssprop --card-padding - Inner padding for the card container. Defaults to 1rem.
+ * @cssprop --card-shape - Corner radius for the card container. Defaults to a large radius.
+ * @cssprop --card-gap - Gap between slotted children.
+ *
+ * @example
+ * ```html
+ * <wc-card variant="outlined">
+ *   <h3>Title</h3>
+ *   <p>Supportive text</p>
+ * </wc-card>
+ * ```
+ */
+export declare class Card extends LitElement {
+    static styles: import("lit").CSSResultGroup[];
+    variant: CardVariant;
+    elevation: CardElevation;
+    render(): import("lit-html").TemplateResult<1>;
+}
+export {};

package/dist/src/card/index.d.ts

@@ -0,0 +1 @@
+export { Card } from './card.js';

package/dist/src/chart-bar/chart-bar.d.ts

@@ -0,0 +1,53 @@
+import { LitElement, PropertyValues } from 'lit';
+export type ChartBarItem = {
+    name: string;
+    value: number;
+    label?: string;
+    color?: string;
+};
+/**
+ * @label Chart Bar
+ * @tag wc-chart-bar
+ * @rawTag chart-bar
+ * @summary A vertical bar chart that follows Material Design 3 color and spacing tokens.
+ * @tags charts
+ *
+ * @example
+ * ```html
+ * <wc-chart-bar width="520" height="320"></wc-chart-bar>
+ * <script>
+ *   document.querySelector('wc-chart-bar').data = [
+ *     { name: 'apples', label: 'Apples', value: 20 },
+ *     { name: 'bananas', label: 'Bananas', value: 35 },
+ *     { name: 'cherries', label: 'Cherries', value: 15 },
+ *   ];
+ * </script>
+ * ```
+ */
+export declare class ChartBar extends LitElement {
+    static styles: import("lit").CSSResultGroup[];
+    private svgElement?;
+    /** Width of the chart in pixels. */
+    width: number;
+    /** Height of the chart in pixels. */
+    height: number;
+    /** Margin around the chart drawing area. */
+    margin: number;
+    /** Chart data array. Each item should have name, value, and optional label and color. */
+    data: ChartBarItem[];
+    /** Whether to render value labels above bars. */
+    showValues: boolean;
+    private _initialized;
+    private _debouncedRenderChart;
+    firstUpdated(): void;
+    updated(changedProperties: PropertyValues): void;
+    private _getPaletteScale;
+    private _resolveColor;
+    private _renderChart;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'wc-chart-bar': ChartBar;
+    }
+}

package/dist/src/chart-bar/chart-stacked-bar.d.ts

@@ -0,0 +1,78 @@
+import { LitElement, PropertyValues } from 'lit';
+export type ChartStackedSegment = {
+    name: string;
+    value: number;
+    label?: string;
+    color?: string;
+};
+export type ChartStackedBarItem = {
+    name: string;
+    label?: string;
+    segments: ChartStackedSegment[];
+};
+/**
+ * @label Chart Stacked Bar
+ * @tag wc-chart-stacked-bar
+ * @rawTag chart-stacked-bar
+ * @summary A stacked bar chart that groups series by category using Material Design 3 tokens.
+ * @tags charts
+ *
+ * @example
+ * ```html
+ * <wc-chart-stacked-bar width="560" height="360"></wc-chart-stacked-bar>
+ * <script>
+ *   document.querySelector('wc-chart-stacked-bar').data = [
+ *     {
+ *       name: 'q1',
+ *       label: 'Q1',
+ *       segments: [
+ *         { name: 'mobile', label: 'Mobile', value: 40 },
+ *         { name: 'web', label: 'Web', value: 25 },
+ *         { name: 'store', label: 'Store', value: 15 },
+ *       ],
+ *     },
+ *     {
+ *       name: 'q2',
+ *       label: 'Q2',
+ *       segments: [
+ *         { name: 'mobile', label: 'Mobile', value: 32 },
+ *         { name: 'web', label: 'Web', value: 30 },
+ *         { name: 'store', label: 'Store', value: 18 },
+ *       ],
+ *     },
+ *   ];
+ * </script>
+ * ```
+ */
+export declare class ChartStackedBar extends LitElement {
+    static styles: import("lit").CSSResultGroup[];
+    private svgElement?;
+    /** Width of the chart in pixels. */
+    width: number;
+    /** Height of the chart in pixels. */
+    height: number;
+    /** Margin around the chart drawing area. */
+    margin: number;
+    /** Chart data array. Each item holds the stacked segments for a category. */
+    data: ChartStackedBarItem[];
+    /** Whether to render total value labels above each stack. */
+    showValues: boolean;
+    /** Whether to render the legend. */
+    showLegend: boolean;
+    private _initialized;
+    private _debouncedRenderChart;
+    firstUpdated(): void;
+    updated(changedProperties: PropertyValues): void;
+    private _getSegmentKeys;
+    private _getColorScale;
+    private _getColorMap;
+    private _getSegmentLabel;
+    private _getTotals;
+    private _renderChart;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'wc-chart-stacked-bar': ChartStackedBar;
+    }
+}

package/dist/src/chart-bar/index.d.ts

@@ -0,0 +1,2 @@
+export { ChartBar } from './chart-bar.js';
+export { ChartStackedBar } from './chart-stacked-bar.js';

package/dist/src/code-editor/code-editor.d.ts

@@ -1,7 +1,7 @@
 import BaseInput from '../input/BaseInput.js';
 /**
  * @label Code Editor
- * @tag code-editor
+ * @tag wc-code-editor
  * @rawTag code-editor
  *
  * @summary A Monaco-based code editing component with syntax highlighting and theming.
@@ -12,12 +12,13 @@ import BaseInput from '../input/BaseInput.js';
  *
  * @example
  * ```html
- * <code-editor
+ * <wc-code-editor
  *   language="javascript"
+ *   style="width: 100%; --code-editor-height: 10rem;"
  *   value="function hello() { console.log('Hello'); }"
  *   lineNumbers="on"
  *   minimap="false">
- * </code-editor>
+ * </wc-code-editor>
  * ```
  * @tags input, editor
  */

package/dist/src/code-highlighter/code-highlighter.d.ts

@@ -2,21 +2,18 @@ import { LitElement } from 'lit';
 import { BundledLanguage } from 'shiki';
 /**
  * @label Code Highlighter
- * @tag code-highlighter
+ * @tag wc-code-highlighter
  * @rawTag code-highlighter
  *
- * @summary Highlights code snippets with syntax highlighting and line numbers.
- * @overview
- *  - CodeHighlighter is a component that provides syntax highlighting for code snippets.
- *  - It supports various programming languages and can display line numbers for better readability.
+ * @summary A component that provides syntax highlighting for code snippets.
  *
  * @example
  * ```html
- * <code-highlighter language="javascript" style="height: 9rem"><pre><code>
+ * <wc-code-highlighter language="javascript" style="height: 9rem"><pre><code>
  *   function helloWorld() {
  *     console.log('Hello, world!');
  *   }</code></pre>
- * </code-highlighter>
+ * </wc-code-highlighter>
  * ```
  * @tags display
  */

package/dist/src/index.d.ts

@@ -21,16 +21,25 @@ export { DatePicker } from './date-picker/index.js';
 export { TimePicker } from './time-picker/index.js';
 export { Textarea } from './textarea/index.js';
 export { Switch } from './switch/index.js';
+export { Checkbox } from './checkbox/index.js';
 export { Spinner } from './spinner/index.js';
 export { Container } from './container/index.js';
 export { NumberCounter } from './number-counter/index.js';
 export { EmptyState } from './empty-state/index.js';
 export { Tooltip } from './popover/index.js';
 export { Breadcrumb, BreadcrumbItem } from './breadcrumb/index.js';
+export { Menu, MenuItem, SubMenu } from './menu/index.js';
 export { CodeHighlighter } from './code-highlighter/index.js';
 export { CodeEditor } from './code-editor/index.js';
 export { Image } from './image/index.js';
 export { Tab, TabGroup, TabPanel, Tabs } from './tabs/index.js';
 export { Slider } from './slider/index.js';
+export { ChartDonut } from './chart-donut/index.js';
 export { ChartDoughnut } from './chart-doughnut/index.js';
 export { ChartPie } from './chart-pie/index.js';
+export { ChartBar, ChartStackedBar } from './chart-bar/index.js';
+export { Table } from './table/index.js';
+export { Pagination } from './pagination/index.js';
+export { TreeView, TreeNode } from './tree-view/index.js';
+export { Card } from './card/index.js';
+export { Snackbar } from './snackbar/index.js';

package/dist/src/menu/index.d.ts

@@ -0,0 +1,3 @@
+export { Menu } from './menu/menu.js';
+export { MenuItem } from './menu-item/menu-item.js';
+export { SubMenu } from './sub-menu/sub-menu.js';

package/dist/src/menu/menu/MenuSurfaceController.d.ts

@@ -0,0 +1,18 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+import { type Placement, type Strategy } from '@floating-ui/dom';
+type PositionOptions = {
+    reference: HTMLElement;
+    floating: HTMLElement;
+    placement: Placement;
+    offset: number;
+    strategy?: Strategy;
+};
+export declare class MenuSurfaceController implements ReactiveController {
+    private host;
+    private cleanup?;
+    constructor(host: ReactiveControllerHost);
+    start(options: PositionOptions): void;
+    stop(): void;
+    hostDisconnected(): void;
+}
+export {};

package/dist/src/menu/menu/menu.d.ts

@@ -1,31 +1,73 @@
 import { LitElement } from 'lit';
+import type { Placement } from '@floating-ui/dom';
+import { MenuItem } from '../menu-item/menu-item.js';
+type CloseReason = {
+    kind: 'click-selection';
+} | {
+    kind: 'keydown';
+    key: string;
+} | {
+    kind: 'outside-click';
+} | {
+    kind: 'focusout';
+} | {
+    kind: 'programmatic';
+};
 /**
  * @label Menu
  * @tag wc-menu
  * @rawTag menu
- * @summary A dropdown menu component.
+ * @summary A list of menu items.
  * @tags navigation
  *
  * @example
  * ```html
  * <wc-menu>
- *   <wc-menu-list>
- *     <wc-menu-item>Item 1</wc-menu-item>
- *   </wc-menu-list>
+ *   <wc-menu-item>Item 1</wc-menu-item>
+ *   <wc-menu-item>Item 2</wc-menu-item>
  * </wc-menu>
  * ```
  */
 export declare class Menu extends LitElement {
+    static styles: import("lit").CSSResultGroup[];
+    static Item: typeof MenuItem;
     open: boolean;
-    align: string;
-    menuWrapper: HTMLElement;
-    private _boundClickOutside;
-    constructor();
+    variant: 'standard' | 'vibrant';
+    anchor: string;
+    stayOpenOnOutsideClick: boolean;
+    stayOpenOnFocusout: boolean;
+    isSubmenu: boolean;
+    placement: Placement;
+    offset: number;
+    private activeIndex;
+    private readonly menuListElement;
+    anchorElement: HTMLElement | null;
+    private readonly _surfaceController;
+    private _lastFocusedElement;
+    private _closeReason;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    private _handleClickOutside;
-    private _handleItemClick;
-    private _toggleMenu;
-    static styles: import("lit").CSSResult;
+    get items(): MenuItem[];
+    show(): void;
+    close(reason?: CloseReason): void;
+    focus(): void;
+    private _resolveAnchorElement;
+    private _syncAnchorAria;
+    private _enabledItems;
+    private _syncRovingTabIndex;
+    private _setActiveByOffset;
+    private _setBoundaryActive;
+    private _getActiveItem;
+    private _getFirstEnabledItem;
+    private _onItemActivate;
+    private _onItemRequestClose;
+    private _onKeyDown;
+    private _onWindowClick;
+    private _isWithinMenuTree;
+    private _onFocusOut;
+    private _onSlotChange;
+    private _applyPositioning;
+    protected updated(changedProperties: Map<string, unknown>): void;
     render(): import("lit-html").TemplateResult<1>;
 }
+export {};

package/dist/src/menu/menu-item/menu-item.d.ts

@@ -3,6 +3,7 @@ import { LitElement } from 'lit';
  * @label Menu Item
  * @tag wc-menu-item
  * @rawTag menu-item
+ * @parentRawTag menu
  * @summary An item in a menu list.
  * @tags navigation
  *
@@ -15,19 +16,25 @@ export declare class MenuItem extends LitElement {
     disabled: boolean;
     value: string;
     selected: boolean;
+    keepOpen: boolean;
+    hasSubmenu: boolean;
+    submenuOpen: boolean;
     href?: string;
     /**
-    * Sets or retrieves the window or frame at which to target content.
-    */
+     * Sets or retrieves the window or frame at which to target content.
+     */
     target: string;
     variant: 'standard' | 'vibrant';
     static styles: import("lit").CSSResultGroup[];
     connectedCallback(): void;
+    disconnectedCallback(): void;
+    private emitActivate;
+    private requestClose;
+    private requestSubmenuKey;
     private _handleKeyDown;
+    private _handleClick;
     __isLink(): boolean;
-    private readonly menuItemElement;
-    focus(): void;
-    blur(): void;
+    get focusTarget(): this;
     render(): import("lit-html").TemplateResult<1>;
     renderContent(): import("lit-html").TemplateResult<1>;
 }

package/dist/src/menu/sub-menu/sub-menu.d.ts

@@ -0,0 +1,36 @@
+import { LitElement } from 'lit';
+import { MenuItem } from '../menu-item/menu-item.js';
+import { Menu } from '../menu/menu.js';
+/**
+ * @label Sub Menu
+ * @tag wc-sub-menu
+ * @rawTag sub-menu
+ * @summary Connects a menu item to a nested menu.
+ */
+export declare class SubMenu extends LitElement {
+    static styles: import("lit").CSSResultGroup[];
+    hoverOpenDelay: number;
+    hoverCloseDelay: number;
+    anchorCorner: string;
+    menuCorner: string;
+    private readonly _items;
+    private readonly _menus;
+    private _openTimeout?;
+    private _closeTimeout?;
+    private readonly _onChildMenuOpened;
+    private readonly _onChildMenuClosed;
+    get item(): MenuItem | null;
+    get menu(): Menu | null;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    show(): Promise<void>;
+    close(): Promise<void>;
+    render(): import("lit-html").TemplateResult<1>;
+    private _onSlotChange;
+    private _onItemClick;
+    private _onItemKeyDown;
+    private _onMenuKeyDown;
+    private _onCloseMenu;
+    private _onMouseEnter;
+    private _onMouseLeave;
+}

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

@@ -0,0 +1 @@
+export { Pagination } from './pagination.js';

package/dist/src/pagination/pagination.d.ts

@@ -0,0 +1,38 @@
+import { LitElement } from 'lit';
+/**
+ * @label Pagination
+ * @tag wc-pagination
+ * @rawTag pagination
+ * @summary A pagination control with page size selector, item count display, and previous/next navigation.
+ * @overview
+ * <p>The pagination component provides controls for navigating through paged data sets.</p>
+ *
+ * @fires {CustomEvent} page - Dispatched when the page or page size changes. Detail: `{ page, pageSize }`.
+ *
+ * @example
+ * ```html
+ * <wc-pagination page="1" page-size="10" total-items="100"></wc-pagination>
+ * ```
+ * @tags navigation, data
+ */
+export declare class Pagination extends LitElement {
+    static styles: import("lit").CSSResultGroup[];
+    /**
+     * The current page number (1-based). Defaults to `1`.
+     */
+    page: number;
+    /**
+     * The number of rows per page. Defaults to `10`.
+     */
+    pageSize: number;
+    /**
+     * Total number of items.
+     */
+    totalItems: number;
+    /**
+     * Supported page size options.
+     */
+    pageSizes: number[];
+    private dispatchPageEvent;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/popover/PopoverController.d.ts

@@ -8,6 +8,9 @@ export declare class PopoverController implements ReactiveController {
         placement: Placement;
         offset: number;
     });
-    updatePosition(reference: HTMLElement | null, floating: HTMLElement): Promise<void>;
+    updatePosition(reference: HTMLElement | null, floating: HTMLElement, options?: {
+        placement?: Placement;
+        offset?: number;
+    }): Promise<void>;
     hostDisconnected(): void;
 }

package/dist/src/snackbar/index.d.ts

@@ -0,0 +1 @@
+export { Snackbar } from './snackbar.js';

package/dist/src/snackbar/snackbar.d.ts

@@ -0,0 +1,40 @@
+import { LitElement } from 'lit';
+/**
+ * @label Snackbar
+ * @tag wc-snackbar
+ * @rawTag snackbar
+ * @summary Snackbars provide brief messages about app processes at the bottom of the screen.
+ *
+ * @cssprop --snackbar-container-color - Container color for the snackbar.
+ * @cssprop --snackbar-label-text-color - Label text color for the snackbar.
+ * @cssprop --snackbar-action-text-color - Action text color.
+ * @cssprop --snackbar-close-icon-color - Close icon color.
+ * @cssprop --snackbar-border-radius - Border radius of the snackbar surface.
+ *
+ * @example
+ * ```html
+ * <wc-snackbar open message="Message archived" action-label="Undo"></wc-snackbar>
+ * ```
+ * @tags display, feedback
+ */
+export declare class Snackbar extends LitElement {
+    static styles: import("lit").CSSResultGroup[];
+    open: boolean;
+    message: string;
+    actionLabel: string;
+    showCloseIcon: boolean;
+    duration: number;
+    multiline: boolean;
+    private hideTimer;
+    show(): void;
+    hide(): void;
+    private close;
+    private dispatchActionEvent;
+    private handleActionClick;
+    private handleCloseClick;
+    private clearTimer;
+    private scheduleAutoHide;
+    protected updated(changedProperties: Map<string, unknown>): void;
+    disconnectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/table/index.d.ts

@@ -0,0 +1 @@
+export { Table } from './table.js';