@duyluonganduin/acl-web-components 0.0.14 → 0.0.16

package/dist/jsx.d.ts

@@ -210,6 +210,8 @@ declare module 'react' {
         open?: boolean | string
         /** 'bottom-start' | 'bottom' | 'bottom-end' | 'top-start' | 'top' | 'top-end'  (default: 'bottom-start') */
         placement?: string
+        /** Make trigger span the host's full width (default: false). Panel width is independent — customize via `--popover-min-width`, `--popover-max-width`, `--popover-max-height` */
+        'full-width'?: boolean | string
       }
 
       // ── anduin-menu ───────────────────────────────────────────────────────
@@ -313,8 +315,12 @@ declare module 'react' {
         /** Cover the full viewport; hides overlay and removes border-radius */
         fullscreen?: boolean | string
         /** Fired when the modal should close (X, overlay click, or anduin-modal-close).
-         *  Import MODAL_CLOSE_EVENT for the event name string.
-         *  @example ref.current.addEventListener(MODAL_CLOSE_EVENT, () => setOpen(false)) */
+         *  Respond by setting open=false — exit animation plays automatically.
+         *  @example ref.current.addEventListener('anduin-close', () => setOpen(false))
+         *
+         *  Fired after the exit animation completes: 'anduin-after-close'
+         *  Use this to safely clear data / unmount when using conditional rendering.
+         *  @example ref.current.addEventListener('anduin-after-close', () => setData(null)) */
       }
 
       // ── anduin-modal-close ────────────────────────────────────────────────
@@ -352,6 +358,61 @@ declare module 'react' {
         position?: string
       }
 
+      // ── anduin-dropdown ───────────────────────────────────────────────────
+      'anduin-dropdown': Base & {
+        /** Currently selected value */
+        value?: string
+        /** Placeholder shown when no value is selected */
+        placeholder?: string
+        /** Icon name shown in the trigger button */
+        icon?: string
+        /** Show search input in the panel (default: true) */
+        searchable?: boolean
+        /** Disables the dropdown */
+        disabled?: boolean
+        /** Panel placement relative to trigger (default: 'bottom-start') */
+        placement?: 'bottom-start' | 'bottom-end' | 'bottom'
+        /** Visual style — 'filled' | 'outlined' | 'plain'  (default: 'filled') */
+        appearance?: 'filled' | 'outlined' | 'plain'
+        /** Size — 'small' (24px) | 'default' (32px) */
+        size?: 'small' | 'default'
+        /** Color variant — matches button variants  (default: 'gray0') */
+        variant?: 'gray0' | 'gray9' | 'primary' | 'danger' | 'success' | 'warning'
+        /** Stretch trigger to full container width */
+        'full-width'?: boolean
+        /** Fired when selection changes — detail: string (selected value) */
+        onChange?: (e: CustomEvent<string>) => void
+      }
+
+      // ── anduin-switcher ───────────────────────────────────────────────────
+      'anduin-switcher': Base & {
+        /** Whether the switcher is on */
+        checked?: boolean
+        /** Disables interaction */
+        disabled?: boolean
+        /** Fired when toggled — detail: boolean */
+        onChange?: (e: CustomEvent<boolean>) => void
+      }
+
+      // ── anduin-drawer ─────────────────────────────────────────────────────
+      'anduin-drawer': Base & {
+        /** Whether the drawer is open */
+        open?: boolean | string
+        /** Drawer title text */
+        heading?: string
+        /** Initial width preset: '320' | '360' | '400' | '640', or any px value (default: '320') */
+        'default-width'?: '320' | '360' | '400' | '640' | string
+        /** Hide the header (title + close button) */
+        'hide-header'?: boolean | string
+        /** Hide the footer slot container */
+        'hide-footer'?: boolean | string
+        /** When true, clicks outside the drawer pass through to underlying elements instead of dismissing (default: false) */
+        'allow-interact-outside'?: boolean | string
+      }
+
+      // ── anduin-drawer-close ───────────────────────────────────────────────
+      'anduin-drawer-close': Base
+
       // ── anduin-file-icon ──────────────────────────────────────────────────
       'anduin-file-icon': Base & {
         /** 'archive' | 'audio' | 'blueprint' | 'box' | 'csv' | 'excel' | 'folder'

package/dist/react.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),t=require("@lit/react"),e=require("./anduin-toast-DlRl3yIP.cjs"),a=t.createComponent({react:n,tagName:"anduin-spinner",elementClass:e.AnduinSpinner}),o=t.createComponent({react:n,tagName:"anduin-icon",elementClass:e.AnduinIcon}),s=t.createComponent({react:n,tagName:"anduin-badge",elementClass:e.AnduinBadge}),l=t.createComponent({react:n,tagName:"anduin-badge-count",elementClass:e.AnduinBadgeCount}),C=t.createComponent({react:n,tagName:"anduin-button",elementClass:e.AnduinButton}),i=t.createComponent({react:n,tagName:"anduin-callout",elementClass:e.AnduinCallout}),r=t.createComponent({react:n,tagName:"anduin-divider",elementClass:e.AnduinDivider}),c=t.createComponent({react:n,tagName:"anduin-dot",elementClass:e.AnduinDot}),d=t.createComponent({react:n,tagName:"anduin-progress",elementClass:e.AnduinProgress}),m=t.createComponent({react:n,tagName:"anduin-skeleton",elementClass:e.AnduinSkeleton}),u=t.createComponent({react:n,tagName:"anduin-loading-state",elementClass:e.AnduinLoadingState}),A=t.createComponent({react:n,tagName:"anduin-field",elementClass:e.AnduinField}),g=t.createComponent({react:n,tagName:"anduin-field-label",elementClass:e.AnduinFieldLabel}),p=t.createComponent({react:n,tagName:"anduin-field-description",elementClass:e.AnduinFieldDescription}),N=t.createComponent({react:n,tagName:"anduin-field-error",elementClass:e.AnduinFieldError}),T=t.createComponent({react:n,tagName:"anduin-field-group",elementClass:e.AnduinFieldGroup}),E=t.createComponent({react:n,tagName:"anduin-radio",elementClass:e.AnduinRadio,events:{onChange:e.RADIO_CHANGE}}),_=t.createComponent({react:n,tagName:"anduin-radio-group",elementClass:e.AnduinRadioGroup,events:{onChange:e.RADIO_GROUP_CHANGE}}),L=t.createComponent({react:n,tagName:"anduin-checkbox",elementClass:e.AnduinCheckbox,events:{onChange:e.CHECKBOX_CHANGE}}),I=t.createComponent({react:n,tagName:"anduin-input",elementClass:e.AnduinInput,events:{onChange:e.INPUT_CHANGE,onClear:e.INPUT_CLEAR}}),O=t.createComponent({react:n,tagName:"anduin-textarea",elementClass:e.AnduinTextarea,events:{onChange:e.TEXTAREA_CHANGE}}),G=t.createComponent({react:n,tagName:"anduin-popover",elementClass:e.AnduinPopover}),b=t.createComponent({react:n,tagName:"anduin-popover-close",elementClass:e.AnduinPopoverClose}),v=t.createComponent({react:n,tagName:"anduin-menu",elementClass:e.AnduinMenu}),M=t.createComponent({react:n,tagName:"anduin-menu-item",elementClass:e.AnduinMenuItem,events:{onClick:e.MENU_ITEM_CLICK}}),R=t.createComponent({react:n,tagName:"anduin-modal",elementClass:e.AnduinModal,events:{onClose:e.MODAL_CLOSE_EVENT,onAfterClose:e.MODAL_AFTER_CLOSE_EVENT}}),S=t.createComponent({react:n,tagName:"anduin-modal-close",elementClass:e.AnduinModalClose}),D=t.createComponent({react:n,tagName:"anduin-tabs",elementClass:e.AnduinTabs,events:{onChange:e.TAB_CHANGE}}),F=t.createComponent({react:n,tagName:"anduin-tabs-list",elementClass:e.AnduinTabsList}),H=t.createComponent({react:n,tagName:"anduin-tab-trigger",elementClass:e.AnduinTabTrigger}),P=t.createComponent({react:n,tagName:"anduin-tab-content",elementClass:e.AnduinTabContent}),B=t.createComponent({react:n,tagName:"anduin-tag",elementClass:e.AnduinTag}),K=t.createComponent({react:n,tagName:"anduin-tag-close",elementClass:e.AnduinTagClose,events:{onClick:e.TAG_CLOSE_CLICK}}),U=t.createComponent({react:n,tagName:"anduin-tooltip",elementClass:e.AnduinTooltip}),k=t.createComponent({react:n,tagName:"anduin-tooltip-trigger",elementClass:e.AnduinTooltipTrigger}),h=t.createComponent({react:n,tagName:"anduin-tooltip-content",elementClass:e.AnduinTooltipContent}),W=t.createComponent({react:n,tagName:"anduin-well",elementClass:e.AnduinWell}),f=t.createComponent({react:n,tagName:"anduin-well-close",elementClass:e.AnduinWellClose,events:{onClick:e.WELL_CLOSE_CLICK}}),x=t.createComponent({react:n,tagName:"anduin-avatar",elementClass:e.AnduinAvatar}),V=t.createComponent({react:n,tagName:"anduin-file-icon",elementClass:e.AnduinFileIcon}),X=t.createComponent({react:n,tagName:"anduin-toast",elementClass:e.AnduinToast}),q=t.createComponent({react:n,tagName:"anduin-toaster",elementClass:e.AnduinToaster});exports.CHECKBOX_CHANGE=e.CHECKBOX_CHANGE;exports.INPUT_CHANGE=e.INPUT_CHANGE;exports.INPUT_CLEAR=e.INPUT_CLEAR;exports.MENU_ITEM_CLICK=e.MENU_ITEM_CLICK;exports.MODAL_AFTER_CLOSE_EVENT=e.MODAL_AFTER_CLOSE_EVENT;exports.MODAL_CLOSE_EVENT=e.MODAL_CLOSE_EVENT;exports.RADIO_CHANGE=e.RADIO_CHANGE;exports.RADIO_GROUP_CHANGE=e.RADIO_GROUP_CHANGE;exports.TAB_CHANGE=e.TAB_CHANGE;exports.TAG_CLOSE_CLICK=e.TAG_CLOSE_CLICK;exports.TEXTAREA_CHANGE=e.TEXTAREA_CHANGE;exports.WELL_CLOSE_CLICK=e.WELL_CLOSE_CLICK;exports.Avatar=x;exports.Badge=s;exports.BadgeCount=l;exports.Button=C;exports.Callout=i;exports.Checkbox=L;exports.Divider=r;exports.Dot=c;exports.Field=A;exports.FieldDescription=p;exports.FieldError=N;exports.FieldGroup=T;exports.FieldLabel=g;exports.FileIcon=V;exports.Icon=o;exports.Input=I;exports.LoadingState=u;exports.Menu=v;exports.MenuItem=M;exports.Modal=R;exports.ModalClose=S;exports.Popover=G;exports.PopoverClose=b;exports.Progress=d;exports.Radio=E;exports.RadioGroup=_;exports.Skeleton=m;exports.Spinner=a;exports.TabContent=P;exports.TabTrigger=H;exports.Tabs=D;exports.TabsList=F;exports.Tag=B;exports.TagClose=K;exports.Textarea=O;exports.Toast=X;exports.Toaster=q;exports.Tooltip=U;exports.TooltipContent=h;exports.TooltipTrigger=k;exports.Well=W;exports.WellClose=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),t=require("@lit/react"),e=require("./anduin-drawer-Cn01TrhD.cjs"),a=t.createComponent({react:n,tagName:"anduin-spinner",elementClass:e.AnduinSpinner}),o=t.createComponent({react:n,tagName:"anduin-icon",elementClass:e.AnduinIcon}),s=t.createComponent({react:n,tagName:"anduin-badge",elementClass:e.AnduinBadge}),r=t.createComponent({react:n,tagName:"anduin-badge-count",elementClass:e.AnduinBadgeCount}),C=t.createComponent({react:n,tagName:"anduin-button",elementClass:e.AnduinButton}),l=t.createComponent({react:n,tagName:"anduin-callout",elementClass:e.AnduinCallout}),i=t.createComponent({react:n,tagName:"anduin-divider",elementClass:e.AnduinDivider}),c=t.createComponent({react:n,tagName:"anduin-dot",elementClass:e.AnduinDot}),d=t.createComponent({react:n,tagName:"anduin-progress",elementClass:e.AnduinProgress}),m=t.createComponent({react:n,tagName:"anduin-skeleton",elementClass:e.AnduinSkeleton}),u=t.createComponent({react:n,tagName:"anduin-loading-state",elementClass:e.AnduinLoadingState}),A=t.createComponent({react:n,tagName:"anduin-field",elementClass:e.AnduinField}),E=t.createComponent({react:n,tagName:"anduin-field-label",elementClass:e.AnduinFieldLabel}),g=t.createComponent({react:n,tagName:"anduin-field-description",elementClass:e.AnduinFieldDescription}),p=t.createComponent({react:n,tagName:"anduin-field-error",elementClass:e.AnduinFieldError}),N=t.createComponent({react:n,tagName:"anduin-field-group",elementClass:e.AnduinFieldGroup}),T=t.createComponent({react:n,tagName:"anduin-radio",elementClass:e.AnduinRadio,events:{onChange:e.RADIO_CHANGE}}),_=t.createComponent({react:n,tagName:"anduin-radio-group",elementClass:e.AnduinRadioGroup,events:{onChange:e.RADIO_GROUP_CHANGE}}),L=t.createComponent({react:n,tagName:"anduin-checkbox",elementClass:e.AnduinCheckbox,events:{onChange:e.CHECKBOX_CHANGE}}),R=t.createComponent({react:n,tagName:"anduin-input",elementClass:e.AnduinInput,events:{onChange:e.INPUT_CHANGE,onClear:e.INPUT_CLEAR}}),D=t.createComponent({react:n,tagName:"anduin-textarea",elementClass:e.AnduinTextarea,events:{onChange:e.TEXTAREA_CHANGE}}),O=t.createComponent({react:n,tagName:"anduin-popover",elementClass:e.AnduinPopover}),I=t.createComponent({react:n,tagName:"anduin-popover-close",elementClass:e.AnduinPopoverClose}),G=t.createComponent({react:n,tagName:"anduin-menu",elementClass:e.AnduinMenu}),S=t.createComponent({react:n,tagName:"anduin-menu-item",elementClass:e.AnduinMenuItem}),H=t.createComponent({react:n,tagName:"anduin-modal",elementClass:e.AnduinModal,events:{onClose:e.MODAL_CLOSE_EVENT,onAfterClose:e.MODAL_AFTER_CLOSE_EVENT}}),b=t.createComponent({react:n,tagName:"anduin-modal-close",elementClass:e.AnduinModalClose}),v=t.createComponent({react:n,tagName:"anduin-tabs",elementClass:e.AnduinTabs,events:{onChange:e.TAB_CHANGE}}),F=t.createComponent({react:n,tagName:"anduin-tabs-list",elementClass:e.AnduinTabsList}),M=t.createComponent({react:n,tagName:"anduin-tab-trigger",elementClass:e.AnduinTabTrigger}),P=t.createComponent({react:n,tagName:"anduin-tab-content",elementClass:e.AnduinTabContent}),W=t.createComponent({react:n,tagName:"anduin-tag",elementClass:e.AnduinTag}),w=t.createComponent({react:n,tagName:"anduin-tag-close",elementClass:e.AnduinTagClose,events:{onClick:e.TAG_CLOSE_CLICK}}),h=t.createComponent({react:n,tagName:"anduin-tooltip",elementClass:e.AnduinTooltip}),B=t.createComponent({react:n,tagName:"anduin-tooltip-trigger",elementClass:e.AnduinTooltipTrigger}),V=t.createComponent({react:n,tagName:"anduin-tooltip-content",elementClass:e.AnduinTooltipContent}),K=t.createComponent({react:n,tagName:"anduin-well",elementClass:e.AnduinWell}),U=t.createComponent({react:n,tagName:"anduin-well-close",elementClass:e.AnduinWellClose,events:{onClick:e.WELL_CLOSE_CLICK}}),k=t.createComponent({react:n,tagName:"anduin-avatar",elementClass:e.AnduinAvatar}),f=t.createComponent({react:n,tagName:"anduin-file-icon",elementClass:e.AnduinFileIcon}),x=t.createComponent({react:n,tagName:"anduin-toast",elementClass:e.AnduinToast}),X=t.createComponent({react:n,tagName:"anduin-toaster",elementClass:e.AnduinToaster}),q=t.createComponent({react:n,tagName:"anduin-dropdown",elementClass:e.AnduinDropdown,events:{onChange:e.DROPDOWN_CHANGE}}),y=t.createComponent({react:n,tagName:"anduin-drawer",elementClass:e.AnduinDrawer,events:{onClose:e.DRAWER_CLOSE_EVENT,onAfterClose:e.DRAWER_AFTER_CLOSE_EVENT}}),j=t.createComponent({react:n,tagName:"anduin-drawer-close",elementClass:e.AnduinDrawerClose}),z=t.createComponent({react:n,tagName:"anduin-switcher",elementClass:e.AnduinSwitcher,events:{onChange:e.SWITCHER_CHANGE}});exports.CHECKBOX_CHANGE=e.CHECKBOX_CHANGE;exports.DRAWER_AFTER_CLOSE_EVENT=e.DRAWER_AFTER_CLOSE_EVENT;exports.DRAWER_CLOSE_EVENT=e.DRAWER_CLOSE_EVENT;exports.DROPDOWN_CHANGE=e.DROPDOWN_CHANGE;exports.INPUT_CHANGE=e.INPUT_CHANGE;exports.INPUT_CLEAR=e.INPUT_CLEAR;exports.MENU_ITEM_CLICK=e.MENU_ITEM_CLICK;exports.MODAL_AFTER_CLOSE_EVENT=e.MODAL_AFTER_CLOSE_EVENT;exports.MODAL_CLOSE_EVENT=e.MODAL_CLOSE_EVENT;exports.RADIO_CHANGE=e.RADIO_CHANGE;exports.RADIO_GROUP_CHANGE=e.RADIO_GROUP_CHANGE;exports.SWITCHER_CHANGE=e.SWITCHER_CHANGE;exports.TAB_CHANGE=e.TAB_CHANGE;exports.TAG_CLOSE_CLICK=e.TAG_CLOSE_CLICK;exports.TEXTAREA_CHANGE=e.TEXTAREA_CHANGE;exports.WELL_CLOSE_CLICK=e.WELL_CLOSE_CLICK;exports.Avatar=k;exports.Badge=s;exports.BadgeCount=r;exports.Button=C;exports.Callout=l;exports.Checkbox=L;exports.Divider=i;exports.Dot=c;exports.Drawer=y;exports.DrawerClose=j;exports.Dropdown=q;exports.Field=A;exports.FieldDescription=g;exports.FieldError=p;exports.FieldGroup=N;exports.FieldLabel=E;exports.FileIcon=f;exports.Icon=o;exports.Input=R;exports.LoadingState=u;exports.Menu=G;exports.MenuItem=S;exports.Modal=H;exports.ModalClose=b;exports.Popover=O;exports.PopoverClose=I;exports.Progress=d;exports.Radio=T;exports.RadioGroup=_;exports.Skeleton=m;exports.Spinner=a;exports.Switcher=z;exports.TabContent=P;exports.TabTrigger=M;exports.Tabs=v;exports.TabsList=F;exports.Tag=W;exports.TagClose=w;exports.Textarea=D;exports.Toast=x;exports.Toaster=X;exports.Tooltip=h;exports.TooltipContent=V;exports.TooltipTrigger=B;exports.Well=K;exports.WellClose=U;

package/dist/react.d.ts

@@ -92,6 +92,69 @@ declare class AnduinDot extends LitElement {
     render(): TemplateResult<1>;
 }
 
+declare class AnduinDrawer extends LitElement {
+    static styles: CSSResult;
+    open: boolean;
+    heading: string;
+    hideHeader: boolean;
+    hideFooter: boolean;
+    defaultWidth: DrawerWidth | string;
+    /** When true, clicks outside the drawer pass through to underlying elements instead of dismissing */
+    allowInteractOutside: boolean;
+    private _leaving;
+    private _width;
+    private _resizing;
+    private _startX;
+    private _startWidth;
+    willUpdate(changed: Map<PropertyKey, unknown>): void;
+    updated(changed: Map<PropertyKey, unknown>): void;
+    private _dispatch;
+    private _onClose;
+    private _onBackdropClick;
+    private _onResizeStart;
+    private _onResizeMove;
+    private _onResizeEnd;
+    render(): TemplateResult<1>;
+}
+
+declare class AnduinDrawerClose extends HTMLElement {
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _onClick;
+}
+
+declare class AnduinDropdown extends LitElement {
+    static styles: CSSResult;
+    value: string;
+    placeholder: string;
+    options: DropdownOption[];
+    icon: string;
+    searchable: boolean;
+    disabled: boolean;
+    placement: 'bottom-start' | 'bottom-end' | 'bottom';
+    appearance: DropdownAppearance;
+    variant: DropdownVariant;
+    size: 'small' | 'default';
+    fullWidth: boolean;
+    private _open;
+    private _query;
+    private _triggerEl;
+    private _panelEl;
+    private _searchEl;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changed: Map<PropertyKey, unknown>): void;
+    private _onOutsideClick;
+    private _onScrollOrResize;
+    private _onTriggerClick;
+    private _onKeyDown;
+    private _onClear;
+    private _selectOption;
+    private _updatePosition;
+    private get _filteredOptions();
+    render(): TemplateResult<1>;
+}
+
 declare class AnduinField extends LitElement {
     static styles: CSSResult;
     orientation: string;
@@ -219,6 +282,7 @@ declare class AnduinPopover extends LitElement {
     static styles: CSSResult;
     open: boolean;
     placement: 'bottom-start' | 'bottom-end' | 'bottom' | 'top-start' | 'top-end' | 'top';
+    fullWidth: boolean;
     private _visible;
     private _closing;
     private _triggerEl;
@@ -294,6 +358,14 @@ declare class AnduinSpinner extends LitElement {
     render(): TemplateResult<2>;
 }
 
+declare class AnduinSwitcher extends LitElement {
+    static styles: CSSResult;
+    checked: boolean;
+    disabled: boolean;
+    private onChange;
+    render(): TemplateResult<1>;
+}
+
 declare class AnduinTabContent extends LitElement {
     static styles: CSSResult;
     value: string;
@@ -485,6 +557,35 @@ export declare const Divider: ReactWebComponent<AnduinDivider, {}>;
 
 export declare const Dot: ReactWebComponent<AnduinDot, {}>;
 
+export declare const Drawer: ReactWebComponent<AnduinDrawer, {
+onClose: string;
+onAfterClose: string;
+}>;
+
+export declare const DRAWER_AFTER_CLOSE_EVENT = "anduin-after-close";
+
+export declare const DRAWER_CLOSE_EVENT = "anduin-close";
+
+export declare const DrawerClose: ReactWebComponent<AnduinDrawerClose, {}>;
+
+declare type DrawerWidth = '320' | '360' | '400' | '640';
+
+export declare const Dropdown: ReactWebComponent<AnduinDropdown, {
+onChange: string;
+}>;
+
+export declare const DROPDOWN_CHANGE = "anduin-dropdown:change";
+
+declare type DropdownAppearance = 'filled' | 'outlined' | 'plain';
+
+declare interface DropdownOption {
+    value: string;
+    label: string;
+    icon?: string;
+}
+
+declare type DropdownVariant = 'gray0' | 'gray9' | 'primary' | 'danger' | 'success' | 'warning';
+
 export declare const Field: ReactWebComponent<AnduinField, {}>;
 
 export declare const FieldDescription: ReactWebComponent<AnduinFieldDescription, {}>;
@@ -516,9 +617,7 @@ export declare const Menu: ReactWebComponent<AnduinMenu, {}>;
 
 export declare const MENU_ITEM_CLICK = "anduin-menu-item:click";
 
-export declare const MenuItem: ReactWebComponent<AnduinMenuItem, {
-onClick: string;
-}>;
+export declare const MenuItem: ReactWebComponent<AnduinMenuItem, {}>;
 
 export declare const Modal: ReactWebComponent<AnduinModal, {
 onClose: string;
@@ -565,6 +664,12 @@ export declare const Skeleton: ReactWebComponent<AnduinSkeleton, {}>;
 
 export declare const Spinner: ReactWebComponent<AnduinSpinner, {}>;
 
+export declare const Switcher: ReactWebComponent<AnduinSwitcher, {
+onChange: string;
+}>;
+
+export declare const SWITCHER_CHANGE = "anduin-switcher:change";
+
 export declare const TAB_CHANGE = "anduin-tab:change";
 
 export declare const TabContent: ReactWebComponent<AnduinTabContent, {}>;

package/dist/react.js

@@ -1,110 +1,133 @@
 import e from "react";
 import { createComponent as a } from "@lit/react";
-import { B as n, n as t, a as s, b as o, c as l, d as i, f as d, g as c, w as r, z as u, p as m, h as C, l as g, i as A, j as N, k as p, $ as T, x as E, a0 as v, y as b, R as L, e as _, W as I, V as F, o as G, a5 as M, I as R, u as f, v as D, q as O, X as h, r as k, Y as P, Z as S, s as B, t as x, a1 as H, E as W, F as K, D as U, C as w, G as V, a4 as X, H as j, L as q, N as y, M as z, O as J, ac as Y, P as Z, A as $, m as Q, J as ee, K as ae } from "./anduin-toast-CYPV6opl.js";
-const oe = a({ react: e, tagName: "anduin-spinner", elementClass: n }), le = a({ react: e, tagName: "anduin-icon", elementClass: t }), ie = a({ react: e, tagName: "anduin-badge", elementClass: s }), de = a({ react: e, tagName: "anduin-badge-count", elementClass: o }), ce = a({ react: e, tagName: "anduin-button", elementClass: l }), re = a({ react: e, tagName: "anduin-callout", elementClass: i }), ue = a({ react: e, tagName: "anduin-divider", elementClass: d }), me = a({ react: e, tagName: "anduin-dot", elementClass: c }), Ce = a({ react: e, tagName: "anduin-progress", elementClass: r }), ge = a({ react: e, tagName: "anduin-skeleton", elementClass: u }), Ae = a({ react: e, tagName: "anduin-loading-state", elementClass: m }), Ne = a({ react: e, tagName: "anduin-field", elementClass: C }), pe = a({ react: e, tagName: "anduin-field-label", elementClass: g }), Te = a({ react: e, tagName: "anduin-field-description", elementClass: A }), Ee = a({ react: e, tagName: "anduin-field-error", elementClass: N }), ve = a({ react: e, tagName: "anduin-field-group", elementClass: p }), be = a({
+import { E as n, q as t, a as s, b as o, c as l, d as i, f as d, g as r, z as c, D as u, s as m, k as C, o as g, l as A, m as N, n as p, a6 as T, B as E, a7 as _, C as v, V as b, e as D, a1 as L, a0 as R, r as I, ad as S, M as h, x as w, y as F, t as G, u as O, a3 as f, a4 as M, v as H, w as P, a9 as k, I as W, J as x, H as B, G as K, K as V, ac as U, L as X, P as j, R as q, Q as y, S as z, ak as J, T as Q, A as Y, p as Z, N as $, O as ee, Y as ae, j as ne, W as te, X as se, h as oe, i as le, a8 as ie, F as de } from "./anduin-drawer-Bpsl7Cgo.js";
+import { a2 as la } from "./anduin-drawer-Bpsl7Cgo.js";
+const me = a({ react: e, tagName: "anduin-spinner", elementClass: n }), Ce = a({ react: e, tagName: "anduin-icon", elementClass: t }), ge = a({ react: e, tagName: "anduin-badge", elementClass: s }), Ae = a({ react: e, tagName: "anduin-badge-count", elementClass: o }), Ne = a({ react: e, tagName: "anduin-button", elementClass: l }), pe = a({ react: e, tagName: "anduin-callout", elementClass: i }), Te = a({ react: e, tagName: "anduin-divider", elementClass: d }), Ee = a({ react: e, tagName: "anduin-dot", elementClass: r }), _e = a({ react: e, tagName: "anduin-progress", elementClass: c }), ve = a({ react: e, tagName: "anduin-skeleton", elementClass: u }), be = a({ react: e, tagName: "anduin-loading-state", elementClass: m }), De = a({ react: e, tagName: "anduin-field", elementClass: C }), Le = a({ react: e, tagName: "anduin-field-label", elementClass: g }), Re = a({ react: e, tagName: "anduin-field-description", elementClass: A }), Ie = a({ react: e, tagName: "anduin-field-error", elementClass: N }), Se = a({ react: e, tagName: "anduin-field-group", elementClass: p }), he = a({
   react: e,
   tagName: "anduin-radio",
   elementClass: E,
   events: { onChange: T }
-}), Le = a({
+}), we = a({
   react: e,
   tagName: "anduin-radio-group",
-  elementClass: b,
-  events: { onChange: v }
-}), _e = a({
+  elementClass: v,
+  events: { onChange: _ }
+}), Fe = a({
   react: e,
   tagName: "anduin-checkbox",
-  elementClass: _,
-  events: { onChange: L }
-}), Ie = a({
+  elementClass: D,
+  events: { onChange: b }
+}), Ge = a({
   react: e,
   tagName: "anduin-input",
-  elementClass: G,
-  events: { onChange: F, onClear: I }
-}), Fe = a({
+  elementClass: I,
+  events: { onChange: R, onClear: L }
+}), Oe = a({
   react: e,
   tagName: "anduin-textarea",
-  elementClass: R,
-  events: { onChange: M }
-}), Ge = a({ react: e, tagName: "anduin-popover", elementClass: f }), Me = a({ react: e, tagName: "anduin-popover-close", elementClass: D }), Re = a({ react: e, tagName: "anduin-menu", elementClass: O }), fe = a({
+  elementClass: h,
+  events: { onChange: S }
+}), fe = a({ react: e, tagName: "anduin-popover", elementClass: w }), Me = a({ react: e, tagName: "anduin-popover-close", elementClass: F }), He = a({ react: e, tagName: "anduin-menu", elementClass: G }), Pe = a({
   react: e,
   tagName: "anduin-menu-item",
-  elementClass: k,
-  events: { onClick: h }
-}), De = a({
+  elementClass: O
+}), ke = a({
   react: e,
   tagName: "anduin-modal",
-  elementClass: B,
-  events: { onClose: S, onAfterClose: P }
-}), Oe = a({ react: e, tagName: "anduin-modal-close", elementClass: x }), he = a({
+  elementClass: H,
+  events: { onClose: M, onAfterClose: f }
+}), We = a({ react: e, tagName: "anduin-modal-close", elementClass: P }), xe = a({
   react: e,
   tagName: "anduin-tabs",
   elementClass: W,
-  events: { onChange: H }
-}), ke = a({ react: e, tagName: "anduin-tabs-list", elementClass: K }), Pe = a({ react: e, tagName: "anduin-tab-trigger", elementClass: U }), Se = a({ react: e, tagName: "anduin-tab-content", elementClass: w }), Be = a({ react: e, tagName: "anduin-tag", elementClass: V }), xe = a({
+  events: { onChange: k }
+}), Be = a({ react: e, tagName: "anduin-tabs-list", elementClass: x }), Ke = a({ react: e, tagName: "anduin-tab-trigger", elementClass: B }), Ve = a({ react: e, tagName: "anduin-tab-content", elementClass: K }), Ue = a({ react: e, tagName: "anduin-tag", elementClass: V }), Xe = a({
   react: e,
   tagName: "anduin-tag-close",
-  elementClass: j,
-  events: { onClick: X }
-}), He = a({ react: e, tagName: "anduin-tooltip", elementClass: q }), We = a({ react: e, tagName: "anduin-tooltip-trigger", elementClass: y }), Ke = a({ react: e, tagName: "anduin-tooltip-content", elementClass: z }), Ue = a({ react: e, tagName: "anduin-well", elementClass: J }), we = a({
+  elementClass: X,
+  events: { onClick: U }
+}), je = a({ react: e, tagName: "anduin-tooltip", elementClass: j }), qe = a({ react: e, tagName: "anduin-tooltip-trigger", elementClass: q }), ye = a({ react: e, tagName: "anduin-tooltip-content", elementClass: y }), ze = a({ react: e, tagName: "anduin-well", elementClass: z }), Je = a({
   react: e,
   tagName: "anduin-well-close",
-  elementClass: Z,
-  events: { onClick: Y }
-}), Ve = a({ react: e, tagName: "anduin-avatar", elementClass: $ }), Xe = a({ react: e, tagName: "anduin-file-icon", elementClass: Q }), je = a({ react: e, tagName: "anduin-toast", elementClass: ee }), qe = a({ react: e, tagName: "anduin-toaster", elementClass: ae });
+  elementClass: Q,
+  events: { onClick: J }
+}), Qe = a({ react: e, tagName: "anduin-avatar", elementClass: Y }), Ye = a({ react: e, tagName: "anduin-file-icon", elementClass: Z }), Ze = a({ react: e, tagName: "anduin-toast", elementClass: $ }), $e = a({ react: e, tagName: "anduin-toaster", elementClass: ee }), ea = a({
+  react: e,
+  tagName: "anduin-dropdown",
+  elementClass: ne,
+  events: { onChange: ae }
+}), aa = a({
+  react: e,
+  tagName: "anduin-drawer",
+  elementClass: oe,
+  events: { onClose: se, onAfterClose: te }
+}), na = a({ react: e, tagName: "anduin-drawer-close", elementClass: le }), ta = a({
+  react: e,
+  tagName: "anduin-switcher",
+  elementClass: de,
+  events: { onChange: ie }
+});
 export {
-  Ve as Avatar,
-  ie as Badge,
-  de as BadgeCount,
-  ce as Button,
-  L as CHECKBOX_CHANGE,
-  re as Callout,
-  _e as Checkbox,
-  ue as Divider,
-  me as Dot,
-  Ne as Field,
-  Te as FieldDescription,
-  Ee as FieldError,
-  ve as FieldGroup,
-  pe as FieldLabel,
-  Xe as FileIcon,
-  F as INPUT_CHANGE,
-  I as INPUT_CLEAR,
-  le as Icon,
-  Ie as Input,
-  Ae as LoadingState,
-  h as MENU_ITEM_CLICK,
-  P as MODAL_AFTER_CLOSE_EVENT,
-  S as MODAL_CLOSE_EVENT,
-  Re as Menu,
-  fe as MenuItem,
-  De as Modal,
-  Oe as ModalClose,
-  Ge as Popover,
+  Qe as Avatar,
+  ge as Badge,
+  Ae as BadgeCount,
+  Ne as Button,
+  b as CHECKBOX_CHANGE,
+  pe as Callout,
+  Fe as Checkbox,
+  te as DRAWER_AFTER_CLOSE_EVENT,
+  se as DRAWER_CLOSE_EVENT,
+  ae as DROPDOWN_CHANGE,
+  Te as Divider,
+  Ee as Dot,
+  aa as Drawer,
+  na as DrawerClose,
+  ea as Dropdown,
+  De as Field,
+  Re as FieldDescription,
+  Ie as FieldError,
+  Se as FieldGroup,
+  Le as FieldLabel,
+  Ye as FileIcon,
+  R as INPUT_CHANGE,
+  L as INPUT_CLEAR,
+  Ce as Icon,
+  Ge as Input,
+  be as LoadingState,
+  la as MENU_ITEM_CLICK,
+  f as MODAL_AFTER_CLOSE_EVENT,
+  M as MODAL_CLOSE_EVENT,
+  He as Menu,
+  Pe as MenuItem,
+  ke as Modal,
+  We as ModalClose,
+  fe as Popover,
   Me as PopoverClose,
-  Ce as Progress,
+  _e as Progress,
   T as RADIO_CHANGE,
-  v as RADIO_GROUP_CHANGE,
-  be as Radio,
-  Le as RadioGroup,
-  ge as Skeleton,
-  oe as Spinner,
-  H as TAB_CHANGE,
-  X as TAG_CLOSE_CLICK,
-  M as TEXTAREA_CHANGE,
-  Se as TabContent,
-  Pe as TabTrigger,
-  he as Tabs,
-  ke as TabsList,
-  Be as Tag,
-  xe as TagClose,
-  Fe as Textarea,
-  je as Toast,
-  qe as Toaster,
-  He as Tooltip,
-  Ke as TooltipContent,
-  We as TooltipTrigger,
-  Y as WELL_CLOSE_CLICK,
-  Ue as Well,
-  we as WellClose
+  _ as RADIO_GROUP_CHANGE,
+  he as Radio,
+  we as RadioGroup,
+  ie as SWITCHER_CHANGE,
+  ve as Skeleton,
+  me as Spinner,
+  ta as Switcher,
+  k as TAB_CHANGE,
+  U as TAG_CLOSE_CLICK,
+  S as TEXTAREA_CHANGE,
+  Ve as TabContent,
+  Ke as TabTrigger,
+  xe as Tabs,
+  Be as TabsList,
+  Ue as Tag,
+  Xe as TagClose,
+  Oe as Textarea,
+  Ze as Toast,
+  $e as Toaster,
+  je as Tooltip,
+  ye as TooltipContent,
+  qe as TooltipTrigger,
+  J as WELL_CLOSE_CLICK,
+  ze as Well,
+  Je as WellClose
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@duyluonganduin/acl-web-components",
-  "version": "0.0.14",
+  "version": "0.0.16",
   "type": "module",
   "main": "./dist/acl-web-components.cjs",
   "module": "./dist/acl-web-components.js",