@getufy/flint-ui-react 0.2.2 → 0.4.0

package/dist/components/FlintMenubarRadioGroup.d.ts

@@ -1,7 +1,15 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintMenubarRadioGroup as FlintMenubarRadioGroupElement } from '@getufy/flint-ui/menubar/flint-menubar';
-export declare const FlintMenubarRadioGroup: import("@lit/react").ReactWebComponent<FlintMenubarRadioGroupElement, {
-    onFlintMenubarRadioChange: EventName<CustomEvent>;
-}>;
-export type FlintMenubarRadioGroupProps = React.ComponentProps<typeof FlintMenubarRadioGroup>;
+export interface FlintMenubarRadioChangeDetail {
+    value: string;
+}
+/**
+ * Manages single-select radio items.
+ */
+export interface FlintMenubarRadioGroupProps extends React.HTMLAttributes<FlintMenubarRadioGroupElement> {
+    /** The value of the currently selected radio item. */
+    value?: string;
+    /** detail: `{ value: string }` */
+    onFlintMenubarRadioChange?: (event: CustomEvent<FlintMenubarRadioChangeDetail>) => void;
+}
+export declare const FlintMenubarRadioGroup: React.ForwardRefExoticComponent<FlintMenubarRadioGroupProps & React.RefAttributes<FlintMenubarRadioGroupElement>>;

package/dist/components/FlintMenubarRadioGroup.js

@@ -0,0 +1,15 @@
+// src/components/FlintMenubarRadioGroup.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarRadioGroup as FlintMenubarRadioGroupElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarRadioGroup = createComponent({
+  tagName: "flint-menubar-radio-group",
+  elementClass: FlintMenubarRadioGroupElement,
+  react: React,
+  events: {
+    onFlintMenubarRadioChange: "flint-menubar-radio-change"
+  }
+});
+export {
+  FlintMenubarRadioGroup
+};

package/dist/components/FlintMenubarRadioItem.d.ts

@@ -1,7 +1,20 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintMenubarRadioItem as FlintMenubarRadioItemElement } from '@getufy/flint-ui/menubar/flint-menubar';
-export declare const FlintMenubarRadioItem: import("@lit/react").ReactWebComponent<FlintMenubarRadioItemElement, {
-    onFlintMenubarRadioSelect: EventName<CustomEvent>;
-}>;
-export type FlintMenubarRadioItemProps = React.ComponentProps<typeof FlintMenubarRadioItem>;
+export interface FlintMenubarRadioSelectDetail {
+    value: string;
+}
+/**
+ * A radio option inside a `<flint-menubar-radio-group>`.
+ */
+export interface FlintMenubarRadioItemProps extends React.HTMLAttributes<FlintMenubarRadioItemElement> {
+    /** Value identifying this radio option within its group. */
+    value?: string;
+    /** Whether this radio item is currently selected. */
+    checked?: boolean;
+    /** Whether the item is non-interactive. */
+    disabled?: boolean;
+    /** Whether the item is visually highlighted (e.g. via keyboard or hover). */
+    highlighted?: boolean;
+    onFlintMenubarRadioSelect?: (event: CustomEvent<FlintMenubarRadioSelectDetail>) => void;
+}
+export declare const FlintMenubarRadioItem: React.ForwardRefExoticComponent<FlintMenubarRadioItemProps & React.RefAttributes<FlintMenubarRadioItemElement>>;

package/dist/components/FlintMenubarRadioItem.js

@@ -0,0 +1,15 @@
+// src/components/FlintMenubarRadioItem.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarRadioItem as FlintMenubarRadioItemElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarRadioItem = createComponent({
+  tagName: "flint-menubar-radio-item",
+  elementClass: FlintMenubarRadioItemElement,
+  react: React,
+  events: {
+    onFlintMenubarRadioSelect: "flint-menubar-radio-select"
+  }
+});
+export {
+  FlintMenubarRadioItem
+};

package/dist/components/FlintMenubarSeparator.d.ts

@@ -1,4 +1,8 @@
 import React from 'react';
 import { FlintMenubarSeparator as FlintMenubarSeparatorElement } from '@getufy/flint-ui/menubar/flint-menubar';
-export declare const FlintMenubarSeparator: import("@lit/react").ReactWebComponent<FlintMenubarSeparatorElement, {}>;
-export type FlintMenubarSeparatorProps = React.ComponentProps<typeof FlintMenubarSeparator>;
+/**
+ * A hairline separator between menu groups.
+ */
+export interface FlintMenubarSeparatorProps extends React.HTMLAttributes<FlintMenubarSeparatorElement> {
+}
+export declare const FlintMenubarSeparator: React.ForwardRefExoticComponent<FlintMenubarSeparatorProps & React.RefAttributes<FlintMenubarSeparatorElement>>;

package/dist/components/FlintMenubarSeparator.js

@@ -0,0 +1,12 @@
+// src/components/FlintMenubarSeparator.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarSeparator as FlintMenubarSeparatorElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarSeparator = createComponent({
+  tagName: "flint-menubar-separator",
+  elementClass: FlintMenubarSeparatorElement,
+  react: React
+});
+export {
+  FlintMenubarSeparator
+};

package/dist/components/FlintMenubarShortcut.d.ts

@@ -1,4 +1,10 @@
 import React from 'react';
 import { FlintMenubarShortcut as FlintMenubarShortcutElement } from '@getufy/flint-ui/menubar/flint-menubar';
-export declare const FlintMenubarShortcut: import("@lit/react").ReactWebComponent<FlintMenubarShortcutElement, {}>;
-export type FlintMenubarShortcutProps = React.ComponentProps<typeof FlintMenubarShortcut>;
+/**
+ * Displays a keyboard shortcut hint inside a menu item.
+ *
+ * @slot - Shortcut text, e.g. `⌘T` or `Ctrl+N`.
+ */
+export interface FlintMenubarShortcutProps extends React.HTMLAttributes<FlintMenubarShortcutElement> {
+}
+export declare const FlintMenubarShortcut: React.ForwardRefExoticComponent<FlintMenubarShortcutProps & React.RefAttributes<FlintMenubarShortcutElement>>;

package/dist/components/FlintMenubarShortcut.js

@@ -0,0 +1,12 @@
+// src/components/FlintMenubarShortcut.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarShortcut as FlintMenubarShortcutElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarShortcut = createComponent({
+  tagName: "flint-menubar-shortcut",
+  elementClass: FlintMenubarShortcutElement,
+  react: React
+});
+export {
+  FlintMenubarShortcut
+};

package/dist/components/FlintMenubarSub.d.ts

@@ -1,4 +1,9 @@
 import React from 'react';
 import { FlintMenubarSub as FlintMenubarSubElement } from '@getufy/flint-ui/menubar/flint-menubar';
-export declare const FlintMenubarSub: import("@lit/react").ReactWebComponent<FlintMenubarSubElement, {}>;
-export type FlintMenubarSubProps = React.ComponentProps<typeof FlintMenubarSub>;
+/**
+ * Wraps a sub-trigger and sub-content pair.
+Opens on hover/focus and ArrowRight; closes on ArrowLeft or blur.
+ */
+export interface FlintMenubarSubProps extends React.HTMLAttributes<FlintMenubarSubElement> {
+}
+export declare const FlintMenubarSub: React.ForwardRefExoticComponent<FlintMenubarSubProps & React.RefAttributes<FlintMenubarSubElement>>;

package/dist/components/FlintMenubarSub.js

@@ -0,0 +1,12 @@
+// src/components/FlintMenubarSub.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarSub as FlintMenubarSubElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarSub = createComponent({
+  tagName: "flint-menubar-sub",
+  elementClass: FlintMenubarSubElement,
+  react: React
+});
+export {
+  FlintMenubarSub
+};

package/dist/components/FlintMenubarSubContent.d.ts

@@ -1,4 +1,11 @@
 import React from 'react';
 import { FlintMenubarSubContent as FlintMenubarSubContentElement } from '@getufy/flint-ui/menubar/flint-menubar';
-export declare const FlintMenubarSubContent: import("@lit/react").ReactWebComponent<FlintMenubarSubContentElement, {}>;
-export type FlintMenubarSubContentProps = React.ComponentProps<typeof FlintMenubarSubContent>;
+/**
+ * The dropdown panel of a sub-menu. Positioned to the right of the trigger.
+Auto-flips left when the panel would overflow the viewport edge.
+ */
+export interface FlintMenubarSubContentProps extends React.HTMLAttributes<FlintMenubarSubContentElement> {
+    /** Whether the sub-menu dropdown panel is visible. */
+    open?: boolean;
+}
+export declare const FlintMenubarSubContent: React.ForwardRefExoticComponent<FlintMenubarSubContentProps & React.RefAttributes<FlintMenubarSubContentElement>>;

package/dist/components/FlintMenubarSubContent.js

@@ -0,0 +1,12 @@
+// src/components/FlintMenubarSubContent.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarSubContent as FlintMenubarSubContentElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarSubContent = createComponent({
+  tagName: "flint-menubar-sub-content",
+  elementClass: FlintMenubarSubContentElement,
+  react: React
+});
+export {
+  FlintMenubarSubContent
+};

package/dist/components/FlintMenubarSubTrigger.d.ts

@@ -1,4 +1,16 @@
 import React from 'react';
 import { FlintMenubarSubTrigger as FlintMenubarSubTriggerElement } from '@getufy/flint-ui/menubar/flint-menubar';
-export declare const FlintMenubarSubTrigger: import("@lit/react").ReactWebComponent<FlintMenubarSubTriggerElement, {}>;
-export type FlintMenubarSubTriggerProps = React.ComponentProps<typeof FlintMenubarSubTrigger>;
+/**
+ * Trigger for a sub-menu. Shows an arrow indicator.
+ */
+export interface FlintMenubarSubTriggerProps extends React.HTMLAttributes<FlintMenubarSubTriggerElement> {
+    /** Whether the trigger is visually highlighted (e.g. via keyboard or hover). */
+    highlighted?: boolean;
+    /** Whether the trigger is non-interactive. */
+    disabled?: boolean;
+    /** Whether the trigger label is inset to align with checkbox/radio items. */
+    inset?: boolean;
+    /** Set by the parent `flint-menubar-sub` to reflect open state for aria-expanded. */
+    expanded?: boolean;
+}
+export declare const FlintMenubarSubTrigger: React.ForwardRefExoticComponent<FlintMenubarSubTriggerProps & React.RefAttributes<FlintMenubarSubTriggerElement>>;

package/dist/components/FlintMenubarSubTrigger.js

@@ -0,0 +1,12 @@
+// src/components/FlintMenubarSubTrigger.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarSubTrigger as FlintMenubarSubTriggerElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarSubTrigger = createComponent({
+  tagName: "flint-menubar-sub-trigger",
+  elementClass: FlintMenubarSubTriggerElement,
+  react: React
+});
+export {
+  FlintMenubarSubTrigger
+};

package/dist/components/FlintMenubarTrigger.d.ts

@@ -1,4 +1,14 @@
 import React from 'react';
 import { FlintMenubarTrigger as FlintMenubarTriggerElement } from '@getufy/flint-ui/menubar/flint-menubar';
-export declare const FlintMenubarTrigger: import("@lit/react").ReactWebComponent<FlintMenubarTriggerElement, {}>;
-export type FlintMenubarTriggerProps = React.ComponentProps<typeof FlintMenubarTrigger>;
+/**
+ * The trigger button for a menubar menu.
+ *
+ * @slot - Trigger label text.
+ */
+export interface FlintMenubarTriggerProps extends React.HTMLAttributes<FlintMenubarTriggerElement> {
+    /** Whether the trigger's associated menu is currently open. */
+    active?: boolean;
+    /** Whether the trigger is non-interactive. */
+    disabled?: boolean;
+}
+export declare const FlintMenubarTrigger: React.ForwardRefExoticComponent<FlintMenubarTriggerProps & React.RefAttributes<FlintMenubarTriggerElement>>;

package/dist/components/FlintMenubarTrigger.js

@@ -0,0 +1,12 @@
+// src/components/FlintMenubarTrigger.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarTrigger as FlintMenubarTriggerElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarTrigger = createComponent({
+  tagName: "flint-menubar-trigger",
+  elementClass: FlintMenubarTriggerElement,
+  react: React
+});
+export {
+  FlintMenubarTrigger
+};

package/dist/components/FlintMobileStepper.d.ts

@@ -1,4 +1,27 @@
 import React from 'react';
 import { FlintMobileStepper as FlintMobileStepperElement } from '@getufy/flint-ui/stepper/flint-stepper';
-export declare const FlintMobileStepper: import("@lit/react").ReactWebComponent<FlintMobileStepperElement, {}>;
-export type FlintMobileStepperProps = React.ComponentProps<typeof FlintMobileStepper>;
+/**
+ * Mobile Stepper: a compact stepper for mobile layouts.
+ *
+ * @slot back-button - Back navigation button.
+ * @slot next-button - Next navigation button.
+ */
+export interface FlintMobileStepperProps extends React.HTMLAttributes<FlintMobileStepperElement> {
+    /** Total number of steps. */
+    steps?: number;
+    /** Zero-based index of the currently active step. */
+    activeStep?: number;
+    /** Progress indicator style: text counter, dot indicators, or a progress bar. */
+    variant?: 'text' | 'dots' | 'progress';
+    /** Positioning of the mobile stepper within its container. */
+    position?: 'top' | 'bottom' | 'static';
+    /** Label text for the Back navigation button (supports i18n). */
+    backLabel?: string;
+    /** Label text for the Next navigation button (supports i18n). */
+    nextLabel?: string;
+    /** Fired when the back button is clicked. */
+    onFlintMobileStepBack?: (event: CustomEvent) => void;
+    /** Fired when the next button is clicked. */
+    onFlintMobileStepNext?: (event: CustomEvent) => void;
+}
+export declare const FlintMobileStepper: React.ForwardRefExoticComponent<FlintMobileStepperProps & React.RefAttributes<FlintMobileStepperElement>>;

package/dist/components/FlintMobileStepper.js

@@ -0,0 +1,16 @@
+// src/components/FlintMobileStepper.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMobileStepper as FlintMobileStepperElement } from "@getufy/flint-ui/stepper/flint-stepper";
+var FlintMobileStepper = createComponent({
+  tagName: "flint-mobile-stepper",
+  elementClass: FlintMobileStepperElement,
+  react: React,
+  events: {
+    onFlintMobileStepBack: "flint-mobile-step-back",
+    onFlintMobileStepNext: "flint-mobile-step-next"
+  }
+});
+export {
+  FlintMobileStepper
+};

package/dist/components/FlintMobileTimePicker.d.ts

@@ -1,7 +1,26 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintMobileTimePicker as FlintMobileTimePickerElement } from '@getufy/flint-ui/time-picker/flint-time-picker';
-export declare const FlintMobileTimePicker: import("@lit/react").ReactWebComponent<FlintMobileTimePickerElement, {
-    onChange: EventName<CustomEvent>;
-}>;
-export type FlintMobileTimePickerProps = React.ComponentProps<typeof FlintMobileTimePicker>;
+/**
+ * Mobile Time Picker: a time field with a modal clock dialog.
+ */
+export interface FlintMobileTimePickerProps extends React.HTMLAttributes<FlintMobileTimePickerElement> {
+    /** Time value in HH:MM:SS format. */
+    value?: string;
+    /** Field label text. */
+    label?: string;
+    /** Whether to use 12-hour (AM/PM) format instead of 24-hour. */
+    ampm?: boolean;
+    /** Whether to show a seconds segment. */
+    seconds?: boolean;
+    /** Disables the picker and prevents interaction. */
+    disabled?: boolean;
+    /** Displays the picker in an error state. */
+    error?: boolean;
+    /** Helper text shown below the field. */
+    helperText?: string;
+    /** Error message displayed below the field when in error state. */
+    errorMessage?: string;
+    /** Fired when the time value changes. detail: `{ value: string }` */
+    onFlintMobileTimePickerChange?: (event: CustomEvent) => void;
+}
+export declare const FlintMobileTimePicker: React.ForwardRefExoticComponent<FlintMobileTimePickerProps & React.RefAttributes<FlintMobileTimePickerElement>>;

package/dist/components/FlintMobileTimePicker.js

@@ -0,0 +1,15 @@
+// src/components/FlintMobileTimePicker.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMobileTimePicker as FlintMobileTimePickerElement } from "@getufy/flint-ui/time-picker/flint-time-picker";
+var FlintMobileTimePicker = createComponent({
+  tagName: "flint-mobile-time-picker",
+  elementClass: FlintMobileTimePickerElement,
+  react: React,
+  events: {
+    onFlintMobileTimePickerChange: "flint-mobile-time-picker-change"
+  }
+});
+export {
+  FlintMobileTimePicker
+};

package/dist/components/FlintMultiSectionDigitalClock.d.ts

@@ -1,7 +1,19 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintMultiSectionDigitalClock as FlintMultiSectionDigitalClockElement } from '@getufy/flint-ui/time-picker/flint-time-picker';
-export declare const FlintMultiSectionDigitalClock: import("@lit/react").ReactWebComponent<FlintMultiSectionDigitalClockElement, {
-    onChange: EventName<CustomEvent>;
-}>;
-export type FlintMultiSectionDigitalClockProps = React.ComponentProps<typeof FlintMultiSectionDigitalClock>;
+export interface FlintMultiSectionDigitalClockChangeDetail {
+    value: string;
+}
+/**
+ * Multi Section Digital Clock: hours, minutes, and optional seconds columns.
+ */
+export interface FlintMultiSectionDigitalClockProps extends React.HTMLAttributes<FlintMultiSectionDigitalClockElement> {
+    /** Time value in HH:MM:SS format. */
+    value?: string;
+    /** Whether to use 12-hour (AM/PM) format instead of 24-hour. */
+    ampm?: boolean;
+    /** Whether to show a seconds column. */
+    seconds?: boolean;
+    /** Fired when the time value changes. detail: `{ value: string }` */
+    onFlintMultiSectionDigitalClockChange?: (event: CustomEvent<FlintMultiSectionDigitalClockChangeDetail>) => void;
+}
+export declare const FlintMultiSectionDigitalClock: React.ForwardRefExoticComponent<FlintMultiSectionDigitalClockProps & React.RefAttributes<FlintMultiSectionDigitalClockElement>>;

package/dist/components/FlintMultiSectionDigitalClock.js

@@ -0,0 +1,15 @@
+// src/components/FlintMultiSectionDigitalClock.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMultiSectionDigitalClock as FlintMultiSectionDigitalClockElement } from "@getufy/flint-ui/time-picker/flint-time-picker";
+var FlintMultiSectionDigitalClock = createComponent({
+  tagName: "flint-multi-section-digital-clock",
+  elementClass: FlintMultiSectionDigitalClockElement,
+  react: React,
+  events: {
+    onFlintMultiSectionDigitalClockChange: "flint-multi-section-digital-clock-change"
+  }
+});
+export {
+  FlintMultiSectionDigitalClock
+};

package/dist/components/FlintNavigationMenu.d.ts

@@ -1,4 +1,10 @@
 import React from 'react';
 import { FlintNavigationMenu as FlintNavigationMenuElement } from '@getufy/flint-ui/navigation-menu/flint-navigation-menu';
-export declare const FlintNavigationMenu: import("@lit/react").ReactWebComponent<FlintNavigationMenuElement, {}>;
-export type FlintNavigationMenuProps = React.ComponentProps<typeof FlintNavigationMenu>;
+/**
+ * @slot default - The menu content (NavigationMenuList)
+ */
+export interface FlintNavigationMenuProps extends Omit<React.HTMLAttributes<FlintNavigationMenuElement>, 'dir'> {
+    /** The direction of the menu (ltr or rtl) */
+    dir?: 'ltr' | 'rtl';
+}
+export declare const FlintNavigationMenu: React.ForwardRefExoticComponent<FlintNavigationMenuProps & React.RefAttributes<FlintNavigationMenuElement>>;

package/dist/components/FlintNavigationMenu.js

@@ -0,0 +1,12 @@
+// src/components/FlintNavigationMenu.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintNavigationMenu as FlintNavigationMenuElement } from "@getufy/flint-ui/navigation-menu/flint-navigation-menu";
+var FlintNavigationMenu = createComponent({
+  tagName: "flint-navigation-menu",
+  elementClass: FlintNavigationMenuElement,
+  react: React
+});
+export {
+  FlintNavigationMenu
+};

package/dist/components/FlintNavigationMenuContent.d.ts

@@ -1,7 +1,22 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintNavigationMenuContent as FlintNavigationMenuContentElement } from '@getufy/flint-ui/navigation-menu/flint-navigation-menu-content';
-export declare const FlintNavigationMenuContent: import("@lit/react").ReactWebComponent<FlintNavigationMenuContentElement, {
-    onFlintNavigationMenuContentToggle: EventName<CustomEvent>;
-}>;
-export type FlintNavigationMenuContentProps = React.ComponentProps<typeof FlintNavigationMenuContent>;
+export interface FlintNavigationMenuContentToggleDetail {
+    contentId: string;
+    open: boolean;
+}
+/**
+ * @slot default - Menu content items
+ */
+export interface FlintNavigationMenuContentProps extends Omit<React.HTMLAttributes<FlintNavigationMenuContentElement>, 'id' | 'dir'> {
+    /** Unique identifier for this content panel */
+    id?: string;
+    /** Whether the content is open/visible */
+    open?: boolean;
+    /** The direction (ltr or rtl) */
+    dir?: 'ltr' | 'rtl';
+    /** Gap between items in the content */
+    gap?: number;
+    /** Fired when the content panel opens or closes. */
+    onFlintNavigationMenuContentToggle?: (event: CustomEvent<FlintNavigationMenuContentToggleDetail>) => void;
+}
+export declare const FlintNavigationMenuContent: React.ForwardRefExoticComponent<FlintNavigationMenuContentProps & React.RefAttributes<FlintNavigationMenuContentElement>>;

package/dist/components/FlintNavigationMenuContent.js

@@ -0,0 +1,15 @@
+// src/components/FlintNavigationMenuContent.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintNavigationMenuContent as FlintNavigationMenuContentElement } from "@getufy/flint-ui/navigation-menu/flint-navigation-menu-content";
+var FlintNavigationMenuContent = createComponent({
+  tagName: "flint-navigation-menu-content",
+  elementClass: FlintNavigationMenuContentElement,
+  react: React,
+  events: {
+    onFlintNavigationMenuContentToggle: "flint-navigation-menu-content-toggle"
+  }
+});
+export {
+  FlintNavigationMenuContent
+};

package/dist/components/FlintNavigationMenuItem.d.ts

@@ -1,8 +1,20 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintNavigationMenuItem as FlintNavigationMenuItemElement } from '@getufy/flint-ui/navigation-menu/flint-navigation-menu-item';
-export declare const FlintNavigationMenuItem: import("@lit/react").ReactWebComponent<FlintNavigationMenuItemElement, {
-    onFlintNavigationMenuTriggerClick: EventName<CustomEvent>;
-    onFlintNavigationMenuContentToggle: EventName<CustomEvent>;
-}>;
-export type FlintNavigationMenuItemProps = React.ComponentProps<typeof FlintNavigationMenuItem>;
+/**
+ * @slot default - Item content (NavigationMenuTrigger and NavigationMenuContent)
+ */
+export interface FlintNavigationMenuItemProps extends React.HTMLAttributes<FlintNavigationMenuItemElement> {
+    /** Unique identifier for this menu item */
+    itemId?: string;
+    /** Whether this item is disabled */
+    disabled?: boolean;
+    /** Delay in ms before opening on hover */
+    openDelay?: number;
+    /** Delay in ms before closing after mouse leaves */
+    closeDelay?: number;
+    /** Fired when the item's trigger is clicked. */
+    onFlintNavigationMenuTriggerClick?: (event: CustomEvent) => void;
+    /** Fired when content visibility changes. */
+    onFlintNavigationMenuContentToggle?: (event: CustomEvent) => void;
+}
+export declare const FlintNavigationMenuItem: React.ForwardRefExoticComponent<FlintNavigationMenuItemProps & React.RefAttributes<FlintNavigationMenuItemElement>>;

package/dist/components/FlintNavigationMenuItem.js

@@ -0,0 +1,16 @@
+// src/components/FlintNavigationMenuItem.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintNavigationMenuItem as FlintNavigationMenuItemElement } from "@getufy/flint-ui/navigation-menu/flint-navigation-menu-item";
+var FlintNavigationMenuItem = createComponent({
+  tagName: "flint-navigation-menu-item",
+  elementClass: FlintNavigationMenuItemElement,
+  react: React,
+  events: {
+    onFlintNavigationMenuTriggerClick: "flint-navigation-menu-trigger-click",
+    onFlintNavigationMenuContentToggle: "flint-navigation-menu-content-toggle"
+  }
+});
+export {
+  FlintNavigationMenuItem
+};

package/dist/components/FlintNavigationMenuLink.d.ts

@@ -1,4 +1,18 @@
 import React from 'react';
 import { FlintNavigationMenuLink as FlintNavigationMenuLinkElement } from '@getufy/flint-ui/navigation-menu/flint-navigation-menu-link';
-export declare const FlintNavigationMenuLink: import("@lit/react").ReactWebComponent<FlintNavigationMenuLinkElement, {}>;
-export type FlintNavigationMenuLinkProps = React.ComponentProps<typeof FlintNavigationMenuLink>;
+/**
+ * @slot default - Link text/content
+ */
+export interface FlintNavigationMenuLinkProps extends Omit<React.HTMLAttributes<FlintNavigationMenuLinkElement>, 'title'> {
+    /** The link URL */
+    href?: string;
+    /** The link target (e.g., '_blank') */
+    target?: string;
+    /** Link title/tooltip */
+    title?: string;
+    /** Whether the link is disabled */
+    disabled?: boolean;
+    /** Whether this link represents the current page. */
+    active?: boolean;
+}
+export declare const FlintNavigationMenuLink: React.ForwardRefExoticComponent<FlintNavigationMenuLinkProps & React.RefAttributes<FlintNavigationMenuLinkElement>>;

package/dist/components/FlintNavigationMenuLink.js

@@ -0,0 +1,12 @@
+// src/components/FlintNavigationMenuLink.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintNavigationMenuLink as FlintNavigationMenuLinkElement } from "@getufy/flint-ui/navigation-menu/flint-navigation-menu-link";
+var FlintNavigationMenuLink = createComponent({
+  tagName: "flint-navigation-menu-link",
+  elementClass: FlintNavigationMenuLinkElement,
+  react: React
+});
+export {
+  FlintNavigationMenuLink
+};

package/dist/components/FlintNavigationMenuList.d.ts

@@ -1,4 +1,14 @@
 import React from 'react';
 import { FlintNavigationMenuList as FlintNavigationMenuListElement } from '@getufy/flint-ui/navigation-menu/flint-navigation-menu-list';
-export declare const FlintNavigationMenuList: import("@lit/react").ReactWebComponent<FlintNavigationMenuListElement, {}>;
-export type FlintNavigationMenuListProps = React.ComponentProps<typeof FlintNavigationMenuList>;
+/**
+ * @slot default - Menu items (NavigationMenuItem elements)
+ */
+export interface FlintNavigationMenuListProps extends React.HTMLAttributes<FlintNavigationMenuListElement> {
+    /** Gap between menu items */
+    gap?: number;
+    /** Flex direction for the list */
+    direction?: 'row' | 'column';
+    /** Accessible label for the navigation landmark. */
+    ariaLabel?: string;
+}
+export declare const FlintNavigationMenuList: React.ForwardRefExoticComponent<FlintNavigationMenuListProps & React.RefAttributes<FlintNavigationMenuListElement>>;

package/dist/components/FlintNavigationMenuList.js

@@ -0,0 +1,12 @@
+// src/components/FlintNavigationMenuList.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintNavigationMenuList as FlintNavigationMenuListElement } from "@getufy/flint-ui/navigation-menu/flint-navigation-menu-list";
+var FlintNavigationMenuList = createComponent({
+  tagName: "flint-navigation-menu-list",
+  elementClass: FlintNavigationMenuListElement,
+  react: React
+});
+export {
+  FlintNavigationMenuList
+};

package/dist/components/FlintNavigationMenuTrigger.d.ts

@@ -1,7 +1,14 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintNavigationMenuTrigger as FlintNavigationMenuTriggerElement } from '@getufy/flint-ui/navigation-menu/flint-navigation-menu-trigger';
-export declare const FlintNavigationMenuTrigger: import("@lit/react").ReactWebComponent<FlintNavigationMenuTriggerElement, {
-    onFlintNavigationMenuTriggerClick: EventName<CustomEvent>;
-}>;
-export type FlintNavigationMenuTriggerProps = React.ComponentProps<typeof FlintNavigationMenuTrigger>;
+/**
+ * @slot default - Trigger label/content
+ */
+export interface FlintNavigationMenuTriggerProps extends React.HTMLAttributes<FlintNavigationMenuTriggerElement> {
+    /** The ID of the associated content element */
+    contentId?: string;
+    /** Whether the trigger is disabled */
+    disabled?: boolean;
+    /** Fired when trigger is clicked */
+    onFlintNavigationMenuTriggerClick?: (event: CustomEvent) => void;
+}
+export declare const FlintNavigationMenuTrigger: React.ForwardRefExoticComponent<FlintNavigationMenuTriggerProps & React.RefAttributes<FlintNavigationMenuTriggerElement>>;

package/dist/components/FlintNavigationMenuTrigger.js

@@ -0,0 +1,15 @@
+// src/components/FlintNavigationMenuTrigger.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintNavigationMenuTrigger as FlintNavigationMenuTriggerElement } from "@getufy/flint-ui/navigation-menu/flint-navigation-menu-trigger";
+var FlintNavigationMenuTrigger = createComponent({
+  tagName: "flint-navigation-menu-trigger",
+  elementClass: FlintNavigationMenuTriggerElement,
+  react: React,
+  events: {
+    onFlintNavigationMenuTriggerClick: "flint-navigation-menu-trigger-click"
+  }
+});
+export {
+  FlintNavigationMenuTrigger
+};