@colletdev/react 0.1.3

package/dist/generated/listbox.js

@@ -0,0 +1,93 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
+export const Listbox = forwardRef((props, forwardedRef) => {
+    const ref = useRef(null);
+    useImperativeHandle(forwardedRef, () => ref.current);
+    const onFocusRef = useRef(props.onFocus);
+    onFocusRef.current = props.onFocus;
+    const onBlurRef = useRef(props.onBlur);
+    onBlurRef.current = props.onBlur;
+    const onKeydownRef = useRef(props.onKeydown);
+    onKeydownRef.current = props.onKeydown;
+    const onKeyupRef = useRef(props.onKeyup);
+    onKeyupRef.current = props.onKeyup;
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const handler = (e) => onFocusRef.current?.(e);
+        el.addEventListener('cx-focus', handler);
+        return () => el.removeEventListener('cx-focus', handler);
+    }, []);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const handler = (e) => onBlurRef.current?.(e);
+        el.addEventListener('cx-blur', handler);
+        return () => el.removeEventListener('cx-blur', handler);
+    }, []);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const handler = (e) => onKeydownRef.current?.(e);
+        el.addEventListener('cx-keydown', handler);
+        return () => el.removeEventListener('cx-keydown', handler);
+    }, []);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const handler = (e) => onKeyupRef.current?.(e);
+        el.addEventListener('cx-keyup', handler);
+        return () => el.removeEventListener('cx-keyup', handler);
+    }, []);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.selected != null) {
+            el.setAttribute('selected', typeof props.selected === 'object' ? JSON.stringify(props.selected) : String(props.selected));
+        }
+        else {
+            el.removeAttribute('selected');
+        }
+    }, [props.selected]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.items != null) {
+            el.setAttribute('items', typeof props.items === 'object' ? JSON.stringify(props.items) : String(props.items));
+        }
+        else {
+            el.removeAttribute('items');
+        }
+    }, [props.items]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.groups != null) {
+            el.setAttribute('groups', typeof props.groups === 'object' ? JSON.stringify(props.groups) : String(props.groups));
+        }
+        else {
+            el.removeAttribute('groups');
+        }
+    }, [props.groups]);
+    // Build attribute object
+    const attrs = {};
+    if (props.id != null)
+        attrs['id'] = typeof props.id === 'object' ? JSON.stringify(props.id) : String(props.id);
+    if (props.label != null)
+        attrs['label'] = typeof props.label === 'object' ? JSON.stringify(props.label) : String(props.label);
+    if (props.shape != null)
+        attrs['shape'] = typeof props.shape === 'object' ? JSON.stringify(props.shape) : String(props.shape);
+    if (props.size != null)
+        attrs['size'] = typeof props.size === 'object' ? JSON.stringify(props.size) : String(props.size);
+    if (props.selectionMode != null)
+        attrs['selection-mode'] = typeof props.selectionMode === 'object' ? JSON.stringify(props.selectionMode) : String(props.selectionMode);
+    return (_jsx("cx-listbox", { ref: ref, ...attrs, className: props.className, style: props.style }));
+});
+Listbox.displayName = 'Listbox';

package/dist/generated/menu.d.ts

@@ -0,0 +1,26 @@
+import type React from 'react';
+import type { KeyboardDetail, MenuActionDetail, MenuChangeDetail, MenuEntry } from './types.js';
+export interface MenuRef extends HTMLElement {
+    /** Opens the menu dropdown. */
+    open(): void;
+    /** Closes the menu dropdown. */
+    close(): void;
+}
+export interface MenuProps {
+    id?: string;
+    triggerLabel: string;
+    entries?: MenuEntry[] | string;
+    variant?: 'filled' | 'outline' | 'ghost';
+    shape?: 'sharp' | 'rounded' | 'pill';
+    width?: 'auto' | 'sm' | 'md' | 'lg';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    icon?: string;
+    disabled?: boolean;
+    onAction?: (event: CustomEvent<MenuActionDetail>) => void;
+    onChange?: (event: CustomEvent<MenuChangeDetail>) => void;
+    onKeydown?: (event: CustomEvent<KeyboardDetail>) => void;
+    onKeyup?: (event: CustomEvent<KeyboardDetail>) => void;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const Menu: React.ForwardRefExoticComponent<MenuProps & React.RefAttributes<MenuRef>>;

package/dist/generated/menu.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
+export const Menu = forwardRef((props, forwardedRef) => {
+    const ref = useRef(null);
+    useImperativeHandle(forwardedRef, () => ref.current);
+    const onActionRef = useRef(props.onAction);
+    onActionRef.current = props.onAction;
+    const onChangeRef = useRef(props.onChange);
+    onChangeRef.current = props.onChange;
+    const onKeydownRef = useRef(props.onKeydown);
+    onKeydownRef.current = props.onKeydown;
+    const onKeyupRef = useRef(props.onKeyup);
+    onKeyupRef.current = props.onKeyup;
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const handler = (e) => onActionRef.current?.(e);
+        el.addEventListener('cx-action', handler);
+        return () => el.removeEventListener('cx-action', handler);
+    }, []);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const handler = (e) => onChangeRef.current?.(e);
+        el.addEventListener('cx-change', handler);
+        return () => el.removeEventListener('cx-change', handler);
+    }, []);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const handler = (e) => onKeydownRef.current?.(e);
+        el.addEventListener('cx-keydown', handler);
+        return () => el.removeEventListener('cx-keydown', handler);
+    }, []);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const handler = (e) => onKeyupRef.current?.(e);
+        el.addEventListener('cx-keyup', handler);
+        return () => el.removeEventListener('cx-keyup', handler);
+    }, []);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.width != null) {
+            el.setAttribute('width', String(props.width));
+        }
+        else {
+            el.removeAttribute('width');
+        }
+    }, [props.width]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.entries != null) {
+            el.setAttribute('entries', typeof props.entries === 'object' ? JSON.stringify(props.entries) : String(props.entries));
+        }
+        else {
+            el.removeAttribute('entries');
+        }
+    }, [props.entries]);
+    // Build attribute object
+    const attrs = {};
+    if (props.id != null)
+        attrs['id'] = typeof props.id === 'object' ? JSON.stringify(props.id) : String(props.id);
+    if (props.triggerLabel != null)
+        attrs['trigger-label'] = typeof props.triggerLabel === 'object' ? JSON.stringify(props.triggerLabel) : String(props.triggerLabel);
+    if (props.variant != null)
+        attrs['variant'] = typeof props.variant === 'object' ? JSON.stringify(props.variant) : String(props.variant);
+    if (props.shape != null)
+        attrs['shape'] = typeof props.shape === 'object' ? JSON.stringify(props.shape) : String(props.shape);
+    if (props.size != null)
+        attrs['size'] = typeof props.size === 'object' ? JSON.stringify(props.size) : String(props.size);
+    if (props.icon != null)
+        attrs['icon'] = typeof props.icon === 'object' ? JSON.stringify(props.icon) : String(props.icon);
+    if (props.disabled)
+        attrs['disabled'] = '';
+    return (_jsx("cx-menu", { ref: ref, ...attrs, className: props.className, style: props.style }));
+});
+Menu.displayName = 'Menu';

package/dist/generated/message-bubble.d.ts

@@ -0,0 +1,18 @@
+import type React from 'react';
+export interface MessageBubbleProps {
+    id?: string;
+    role?: 'user' | 'assistant';
+    variant?: 'filled' | 'ghost';
+    shape?: 'sharp' | 'rounded';
+    alignment?: 'auto' | 'start' | 'end';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    htmlContent?: string;
+    senderName?: string;
+    timestamp?: string;
+    border?: string;
+    animated?: boolean;
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const MessageBubble: React.ForwardRefExoticComponent<MessageBubbleProps & React.RefAttributes<HTMLElement>>;

package/dist/generated/message-bubble.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
+export const MessageBubble = forwardRef((props, forwardedRef) => {
+    const ref = useRef(null);
+    useImperativeHandle(forwardedRef, () => ref.current);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.role != null) {
+            el.setAttribute('role', String(props.role));
+        }
+        else {
+            el.removeAttribute('role');
+        }
+    }, [props.role]);
+    // Build attribute object
+    const attrs = {};
+    if (props.id != null)
+        attrs['id'] = typeof props.id === 'object' ? JSON.stringify(props.id) : String(props.id);
+    if (props.variant != null)
+        attrs['variant'] = typeof props.variant === 'object' ? JSON.stringify(props.variant) : String(props.variant);
+    if (props.shape != null)
+        attrs['shape'] = typeof props.shape === 'object' ? JSON.stringify(props.shape) : String(props.shape);
+    if (props.alignment != null)
+        attrs['alignment'] = typeof props.alignment === 'object' ? JSON.stringify(props.alignment) : String(props.alignment);
+    if (props.size != null)
+        attrs['size'] = typeof props.size === 'object' ? JSON.stringify(props.size) : String(props.size);
+    if (props.htmlContent != null)
+        attrs['html-content'] = typeof props.htmlContent === 'object' ? JSON.stringify(props.htmlContent) : String(props.htmlContent);
+    if (props.senderName != null)
+        attrs['sender-name'] = typeof props.senderName === 'object' ? JSON.stringify(props.senderName) : String(props.senderName);
+    if (props.timestamp != null)
+        attrs['timestamp'] = typeof props.timestamp === 'object' ? JSON.stringify(props.timestamp) : String(props.timestamp);
+    if (props.border != null)
+        attrs['border'] = typeof props.border === 'object' ? JSON.stringify(props.border) : String(props.border);
+    if (props.animated)
+        attrs['animated'] = '';
+    return (_jsx("cx-message-bubble", { ref: ref, ...attrs, className: props.className, style: props.style, children: props.children }));
+});
+MessageBubble.displayName = 'MessageBubble';

package/dist/generated/message-group.d.ts

@@ -0,0 +1,14 @@
+import type React from 'react';
+import type { MessageGroupPart } from './types.js';
+export interface MessageGroupProps {
+    id?: string;
+    role?: 'user' | 'assistant';
+    alignment?: 'auto' | 'start' | 'end';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    senderName?: string;
+    animated?: boolean;
+    parts?: MessageGroupPart[] | string;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const MessageGroup: React.ForwardRefExoticComponent<MessageGroupProps & React.RefAttributes<HTMLElement>>;

package/dist/generated/message-group.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
+export const MessageGroup = forwardRef((props, forwardedRef) => {
+    const ref = useRef(null);
+    useImperativeHandle(forwardedRef, () => ref.current);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.role != null) {
+            el.setAttribute('role', String(props.role));
+        }
+        else {
+            el.removeAttribute('role');
+        }
+    }, [props.role]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.parts != null) {
+            el.setAttribute('parts', typeof props.parts === 'object' ? JSON.stringify(props.parts) : String(props.parts));
+        }
+        else {
+            el.removeAttribute('parts');
+        }
+    }, [props.parts]);
+    // Build attribute object
+    const attrs = {};
+    if (props.id != null)
+        attrs['id'] = typeof props.id === 'object' ? JSON.stringify(props.id) : String(props.id);
+    if (props.alignment != null)
+        attrs['alignment'] = typeof props.alignment === 'object' ? JSON.stringify(props.alignment) : String(props.alignment);
+    if (props.size != null)
+        attrs['size'] = typeof props.size === 'object' ? JSON.stringify(props.size) : String(props.size);
+    if (props.senderName != null)
+        attrs['sender-name'] = typeof props.senderName === 'object' ? JSON.stringify(props.senderName) : String(props.senderName);
+    if (props.animated)
+        attrs['animated'] = '';
+    return (_jsx("cx-message-group", { ref: ref, ...attrs, className: props.className, style: props.style }));
+});
+MessageGroup.displayName = 'MessageGroup';

package/dist/generated/message-part.d.ts

@@ -0,0 +1,20 @@
+import type React from 'react';
+export interface MessagePartProps {
+    /** Enable streaming mode. Pauses WASM rendering. */
+    stream?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    /** Fired when streaming ends (after sanitization pass). */
+    onStreamEnd?: (e: CustomEvent) => void;
+}
+export interface MessagePartRef {
+    /** The underlying DOM element. */
+    element: HTMLElement;
+    /** Initialize the streaming markdown parser. */
+    startStream: () => Promise<void>;
+    /** Feed markdown tokens (rAF-batched). */
+    appendTokens: (text: string) => void;
+    /** End stream, sanitize, remove cursor. */
+    endStream: () => Promise<void>;
+}
+export declare const MessagePart: React.ForwardRefExoticComponent<MessagePartProps & React.RefAttributes<MessagePartRef>>;

package/dist/generated/message-part.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useImperativeHandle, useRef } from 'react';
+export const MessagePart = forwardRef((props, forwardedRef) => {
+    const ref = useRef(null);
+    useImperativeHandle(forwardedRef, () => ({
+        get element() { return ref.current; },
+        async startStream() {
+            const el = ref.current;
+            if (el?.startStream)
+                await el.startStream();
+        },
+        appendTokens(text) {
+            const el = ref.current;
+            if (el?.appendTokens)
+                el.appendTokens(text);
+        },
+        async endStream() {
+            const el = ref.current;
+            if (el?.endStream)
+                await el.endStream();
+        },
+    }));
+    // Build attribute object
+    const attrs = {};
+    if (props.stream)
+        attrs.stream = '';
+    // Event listener setup
+    const handleRef = (el) => {
+        ref.current = el;
+        if (el && props.onStreamEnd) {
+            el.addEventListener('cx-stream-end', props.onStreamEnd);
+        }
+    };
+    return (_jsx("cx-message-part", { ref: handleRef, ...attrs, className: props.className, style: props.style }));
+});
+MessagePart.displayName = 'MessagePart';

package/dist/generated/pagination.d.ts

@@ -0,0 +1,17 @@
+import type React from 'react';
+export interface PaginationProps {
+    id?: string;
+    currentPage: number;
+    pageSize: number;
+    totalItems: number;
+    label?: string;
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    showInfo?: boolean;
+    showPrevNext?: boolean;
+    prevLabel?: string;
+    nextLabel?: string;
+    pageSizeOptions?: string;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const Pagination: React.ForwardRefExoticComponent<PaginationProps & React.RefAttributes<HTMLElement>>;

package/dist/generated/pagination.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
+export const Pagination = forwardRef((props, forwardedRef) => {
+    const ref = useRef(null);
+    useImperativeHandle(forwardedRef, () => ref.current);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.currentPage != null) {
+            el.setAttribute('current-page', String(props.currentPage));
+        }
+        else {
+            el.removeAttribute('current-page');
+        }
+    }, [props.currentPage]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.pageSize != null) {
+            el.setAttribute('page-size', String(props.pageSize));
+        }
+        else {
+            el.removeAttribute('page-size');
+        }
+    }, [props.pageSize]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.totalItems != null) {
+            el.setAttribute('total-items', String(props.totalItems));
+        }
+        else {
+            el.removeAttribute('total-items');
+        }
+    }, [props.totalItems]);
+    // Build attribute object
+    const attrs = {};
+    if (props.id != null)
+        attrs['id'] = typeof props.id === 'object' ? JSON.stringify(props.id) : String(props.id);
+    if (props.label != null)
+        attrs['label'] = typeof props.label === 'object' ? JSON.stringify(props.label) : String(props.label);
+    if (props.size != null)
+        attrs['size'] = typeof props.size === 'object' ? JSON.stringify(props.size) : String(props.size);
+    if (props.showInfo)
+        attrs['show-info'] = '';
+    if (props.showPrevNext)
+        attrs['show-prev-next'] = '';
+    if (props.prevLabel != null)
+        attrs['prev-label'] = typeof props.prevLabel === 'object' ? JSON.stringify(props.prevLabel) : String(props.prevLabel);
+    if (props.nextLabel != null)
+        attrs['next-label'] = typeof props.nextLabel === 'object' ? JSON.stringify(props.nextLabel) : String(props.nextLabel);
+    if (props.pageSizeOptions != null)
+        attrs['page-size-options'] = typeof props.pageSizeOptions === 'object' ? JSON.stringify(props.pageSizeOptions) : String(props.pageSizeOptions);
+    return (_jsx("cx-pagination", { ref: ref, ...attrs, className: props.className, style: props.style }));
+});
+Pagination.displayName = 'Pagination';

package/dist/generated/popover.d.ts

@@ -0,0 +1,27 @@
+import type React from 'react';
+export interface PopoverRef extends HTMLElement {
+    /** Opens the popover panel. */
+    open(): void;
+    /** Closes the popover panel. */
+    close(): void;
+}
+export interface PopoverProps {
+    id?: string;
+    triggerLabel: string;
+    title?: string;
+    description?: string;
+    width?: 'sm' | 'md' | 'lg' | 'xl' | 'auto';
+    placement?: 'top' | 'bottom';
+    align?: 'start' | 'center' | 'end';
+    arrow?: boolean;
+    closeButton?: boolean;
+    variant?: 'outline' | 'filled' | 'ghost';
+    shape?: 'sharp' | 'rounded' | 'pill';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    icon?: string;
+    disabled?: boolean;
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<PopoverRef>>;

package/dist/generated/popover.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
+export const Popover = forwardRef((props, forwardedRef) => {
+    const ref = useRef(null);
+    useImperativeHandle(forwardedRef, () => ref.current);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.title != null) {
+            el.setAttribute('title', String(props.title));
+        }
+        else {
+            el.removeAttribute('title');
+        }
+    }, [props.title]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.width != null) {
+            el.setAttribute('width', String(props.width));
+        }
+        else {
+            el.removeAttribute('width');
+        }
+    }, [props.width]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.align != null) {
+            el.setAttribute('align', String(props.align));
+        }
+        else {
+            el.removeAttribute('align');
+        }
+    }, [props.align]);
+    // Build attribute object
+    const attrs = {};
+    if (props.id != null)
+        attrs['id'] = typeof props.id === 'object' ? JSON.stringify(props.id) : String(props.id);
+    if (props.triggerLabel != null)
+        attrs['trigger-label'] = typeof props.triggerLabel === 'object' ? JSON.stringify(props.triggerLabel) : String(props.triggerLabel);
+    if (props.description != null)
+        attrs['description'] = typeof props.description === 'object' ? JSON.stringify(props.description) : String(props.description);
+    if (props.placement != null)
+        attrs['placement'] = typeof props.placement === 'object' ? JSON.stringify(props.placement) : String(props.placement);
+    if (props.arrow)
+        attrs['arrow'] = '';
+    if (props.closeButton)
+        attrs['close-button'] = '';
+    if (props.variant != null)
+        attrs['variant'] = typeof props.variant === 'object' ? JSON.stringify(props.variant) : String(props.variant);
+    if (props.shape != null)
+        attrs['shape'] = typeof props.shape === 'object' ? JSON.stringify(props.shape) : String(props.shape);
+    if (props.size != null)
+        attrs['size'] = typeof props.size === 'object' ? JSON.stringify(props.size) : String(props.size);
+    if (props.icon != null)
+        attrs['icon'] = typeof props.icon === 'object' ? JSON.stringify(props.icon) : String(props.icon);
+    if (props.disabled)
+        attrs['disabled'] = '';
+    return (_jsx("cx-popover", { ref: ref, ...attrs, className: props.className, style: props.style, children: props.children }));
+});
+Popover.displayName = 'Popover';

package/dist/generated/profile-menu.d.ts

@@ -0,0 +1,23 @@
+import type React from 'react';
+import type { MenuActionDetail, MenuEntry } from './types.js';
+export interface ProfileMenuRef extends HTMLElement {
+    /** Opens the profile menu dropdown. */
+    open(): void;
+    /** Closes the profile menu dropdown. */
+    close(): void;
+}
+export interface ProfileMenuProps {
+    id?: string;
+    label: string;
+    image?: string;
+    initials?: string;
+    shape?: 'circle' | 'rounded';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    width?: 'auto' | 'sm' | 'md' | 'lg';
+    entries?: MenuEntry[] | string;
+    disabled?: boolean;
+    onAction?: (event: CustomEvent<MenuActionDetail>) => void;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const ProfileMenu: React.ForwardRefExoticComponent<ProfileMenuProps & React.RefAttributes<ProfileMenuRef>>;

package/dist/generated/profile-menu.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
+export const ProfileMenu = forwardRef((props, forwardedRef) => {
+    const ref = useRef(null);
+    useImperativeHandle(forwardedRef, () => ref.current);
+    const onActionRef = useRef(props.onAction);
+    onActionRef.current = props.onAction;
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const handler = (e) => onActionRef.current?.(e);
+        el.addEventListener('cx-action', handler);
+        return () => el.removeEventListener('cx-action', handler);
+    }, []);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.width != null) {
+            el.setAttribute('width', String(props.width));
+        }
+        else {
+            el.removeAttribute('width');
+        }
+    }, [props.width]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        if (props.entries != null) {
+            el.setAttribute('entries', typeof props.entries === 'object' ? JSON.stringify(props.entries) : String(props.entries));
+        }
+        else {
+            el.removeAttribute('entries');
+        }
+    }, [props.entries]);
+    // Build attribute object
+    const attrs = {};
+    if (props.id != null)
+        attrs['id'] = typeof props.id === 'object' ? JSON.stringify(props.id) : String(props.id);
+    if (props.label != null)
+        attrs['label'] = typeof props.label === 'object' ? JSON.stringify(props.label) : String(props.label);
+    if (props.image != null)
+        attrs['image'] = typeof props.image === 'object' ? JSON.stringify(props.image) : String(props.image);
+    if (props.initials != null)
+        attrs['initials'] = typeof props.initials === 'object' ? JSON.stringify(props.initials) : String(props.initials);
+    if (props.shape != null)
+        attrs['shape'] = typeof props.shape === 'object' ? JSON.stringify(props.shape) : String(props.shape);
+    if (props.size != null)
+        attrs['size'] = typeof props.size === 'object' ? JSON.stringify(props.size) : String(props.size);
+    if (props.disabled)
+        attrs['disabled'] = '';
+    return (_jsx("cx-profile-menu", { ref: ref, ...attrs, className: props.className, style: props.style }));
+});
+ProfileMenu.displayName = 'ProfileMenu';

package/dist/generated/progress.d.ts

@@ -0,0 +1,14 @@
+import type React from 'react';
+export interface ProgressProps {
+    id?: string;
+    label?: string;
+    /** Percentage 0–100. No `max` prop — the component assumes max=100. */
+    value?: number;
+    valueText?: string;
+    intent?: 'neutral' | 'primary' | 'info' | 'success' | 'warning' | 'danger';
+    shape?: 'rounded' | 'sharp' | 'pill';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLElement>>;