@getufy/flint-ui-react 0.3.0 → 0.4.0

package/dist/components/FlintHoverCardTrigger.js

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

package/dist/components/FlintImageComparer.js

@@ -0,0 +1,15 @@
+// src/components/FlintImageComparer.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintImageComparer as FlintImageComparerElement } from "@getufy/flint-ui/image-comparer/flint-image-comparer";
+var FlintImageComparer = createComponent({
+  tagName: "flint-image-comparer",
+  elementClass: FlintImageComparerElement,
+  react: React,
+  events: {
+    onFlintImageComparerChange: "flint-image-comparer-change"
+  }
+});
+export {
+  FlintImageComparer
+};

package/dist/components/FlintImageList.js

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

package/dist/components/FlintImageListItem.js

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

package/dist/components/FlintImageListItemBar.js

@@ -0,0 +1,12 @@
+// src/components/FlintImageListItemBar.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintImageListItemBar as FlintImageListItemBarElement } from "@getufy/flint-ui/image-list/flint-image-list-item-bar";
+var FlintImageListItemBar = createComponent({
+  tagName: "flint-image-list-item-bar",
+  elementClass: FlintImageListItemBarElement,
+  react: React
+});
+export {
+  FlintImageListItemBar
+};

package/dist/components/FlintInput.js

@@ -0,0 +1,16 @@
+// src/components/FlintInput.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintInput as FlintInputElement } from "@getufy/flint-ui/input/flint-input";
+var FlintInput = createComponent({
+  tagName: "flint-input",
+  elementClass: FlintInputElement,
+  react: React,
+  events: {
+    onFlintInputInput: "flint-input-input",
+    onFlintInputChange: "flint-input-change"
+  }
+});
+export {
+  FlintInput
+};

package/dist/components/FlintInputOtp.js

@@ -0,0 +1,16 @@
+// src/components/FlintInputOtp.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintInputOtp as FlintInputOtpElement } from "@getufy/flint-ui/input-otp/flint-input-otp";
+var FlintInputOtp = createComponent({
+  tagName: "flint-input-otp",
+  elementClass: FlintInputOtpElement,
+  react: React,
+  events: {
+    onFlintOtpChange: "flint-otp-change",
+    onFlintOtpComplete: "flint-otp-complete"
+  }
+});
+export {
+  FlintInputOtp
+};

package/dist/components/FlintInputOtpGroup.js

@@ -0,0 +1,12 @@
+// src/components/FlintInputOtpGroup.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintInputOtpGroup as FlintInputOtpGroupElement } from "@getufy/flint-ui/input-otp/flint-input-otp";
+var FlintInputOtpGroup = createComponent({
+  tagName: "flint-input-otp-group",
+  elementClass: FlintInputOtpGroupElement,
+  react: React
+});
+export {
+  FlintInputOtpGroup
+};

package/dist/components/FlintInputOtpSeparator.js

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

package/dist/components/FlintInputOtpSlot.js

@@ -0,0 +1,12 @@
+// src/components/FlintInputOtpSlot.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintInputOtpSlot as FlintInputOtpSlotElement } from "@getufy/flint-ui/input-otp/flint-input-otp";
+var FlintInputOtpSlot = createComponent({
+  tagName: "flint-input-otp-slot",
+  elementClass: FlintInputOtpSlotElement,
+  react: React
+});
+export {
+  FlintInputOtpSlot
+};

package/dist/components/FlintItem.js

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

package/dist/components/FlintItemActions.js

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

package/dist/components/FlintItemContent.js

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

package/dist/components/FlintItemDescription.js

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

package/dist/components/FlintItemFooter.js

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

package/dist/components/FlintItemGroup.js

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

package/dist/components/FlintItemHeader.js

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

package/dist/components/FlintItemMedia.js

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

package/dist/components/FlintItemSeparator.js

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

package/dist/components/FlintItemTitle.js

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

package/dist/components/FlintKbd.js

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

package/dist/components/FlintKbdGroup.js

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

package/dist/components/FlintLinearProgress.js

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

package/dist/components/FlintLink.d.ts

@@ -5,6 +5,7 @@ import { FlintLink as FlintLinkElement } from '@getufy/flint-ui/link/flint-link'
 with theme colors and typography styles.
  *
  * @slot - Link text or content.
+Native click events propagate from the shadow DOM anchor element.
  */
 export interface FlintLinkProps extends Omit<React.HTMLAttributes<FlintLinkElement>, 'color'> {
     /** The URL of the link. */

package/dist/components/FlintLink.js

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

package/dist/components/FlintList.js

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

package/dist/components/FlintListItem.js

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

package/dist/components/FlintListItemAvatar.js

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

package/dist/components/FlintListItemButton.js

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

package/dist/components/FlintListItemIcon.js

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

package/dist/components/FlintListItemText.js

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

package/dist/components/FlintListSubheader.js

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

package/dist/components/FlintMenu.d.ts

@@ -13,7 +13,7 @@ export interface FlintMenuProps extends React.HTMLAttributes<FlintMenuElement> {
     /** Whether the menu is open/visible. */
     open?: boolean;
     /** Menu placement relative to its anchor container. */
-    placement?: string;
+    placement?: 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end' | 'right-start' | 'left-start';
     /** When true, selecting an item automatically fires flint-menu-close. */
     closeOnSelect?: boolean;
     /** When true, constrains height to --flint-menu-max-height (default 300px) and enables scrolling. */

package/dist/components/FlintMenu.js

@@ -0,0 +1,15 @@
+// src/components/FlintMenu.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenu as FlintMenuElement } from "@getufy/flint-ui/menu/flint-menu";
+var FlintMenu = createComponent({
+  tagName: "flint-menu",
+  elementClass: FlintMenuElement,
+  react: React,
+  events: {
+    onFlintMenuClose: "flint-menu-close"
+  }
+});
+export {
+  FlintMenu
+};

package/dist/components/FlintMenuDivider.js

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

package/dist/components/FlintMenuGroup.js

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

package/dist/components/FlintMenuItem.js

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

package/dist/components/FlintMenubar.d.ts

@@ -9,5 +9,11 @@ Hosts one or more `<flint-menubar-menu>` children.
 export interface FlintMenubarProps extends React.HTMLAttributes<FlintMenubarElement> {
     /** Accessible label for the menubar region. Defaults to "Menu bar". */
     label?: string;
+    /** Bubbles from items. */
+    onFlintMenubarItemSelect?: (event: CustomEvent) => void;
+    /** Bubbles from checkbox items. */
+    onFlintMenubarCheckboxChange?: (event: CustomEvent) => void;
+    /** Bubbles from radio groups. */
+    onFlintMenubarRadioChange?: (event: CustomEvent) => void;
 }
 export declare const FlintMenubar: React.ForwardRefExoticComponent<FlintMenubarProps & React.RefAttributes<FlintMenubarElement>>;

package/dist/components/FlintMenubar.js

@@ -0,0 +1,17 @@
+// src/components/FlintMenubar.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubar as FlintMenubarElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubar = createComponent({
+  tagName: "flint-menubar",
+  elementClass: FlintMenubarElement,
+  react: React,
+  events: {
+    onFlintMenubarItemSelect: "flint-menubar-item-select",
+    onFlintMenubarCheckboxChange: "flint-menubar-checkbox-change",
+    onFlintMenubarRadioChange: "flint-menubar-radio-change"
+  }
+});
+export {
+  FlintMenubar
+};

package/dist/components/FlintMenubarCheckboxItem.js

@@ -0,0 +1,15 @@
+// src/components/FlintMenubarCheckboxItem.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarCheckboxItem as FlintMenubarCheckboxItemElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarCheckboxItem = createComponent({
+  tagName: "flint-menubar-checkbox-item",
+  elementClass: FlintMenubarCheckboxItemElement,
+  react: React,
+  events: {
+    onFlintMenubarCheckboxChange: "flint-menubar-checkbox-change"
+  }
+});
+export {
+  FlintMenubarCheckboxItem
+};

package/dist/components/FlintMenubarContent.js

@@ -0,0 +1,15 @@
+// src/components/FlintMenubarContent.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintMenubarContent as FlintMenubarContentElement } from "@getufy/flint-ui/menubar/flint-menubar";
+var FlintMenubarContent = createComponent({
+  tagName: "flint-menubar-content",
+  elementClass: FlintMenubarContentElement,
+  react: React,
+  events: {
+    onFlintMenubarRequestClose: "flint-menubar-request-close"
+  }
+});
+export {
+  FlintMenubarContent
+};

package/dist/components/FlintMenubarGroup.js

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

package/dist/components/FlintMenubarItem.js

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

package/dist/components/FlintMenubarMenu.js

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

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
+};