@getufy/flint-ui-react 0.2.2 → 0.4.0

package/dist/components/FlintStepConnector.d.ts

@@ -1,4 +1,9 @@
 import React from 'react';
 import { FlintStepConnector as FlintStepConnectorElement } from '@getufy/flint-ui/stepper/flint-stepper';
-export declare const FlintStepConnector: import("@lit/react").ReactWebComponent<FlintStepConnectorElement, {}>;
-export type FlintStepConnectorProps = React.ComponentProps<typeof FlintStepConnector>;
+export interface FlintStepConnectorProps extends React.HTMLAttributes<FlintStepConnectorElement> {
+    /** Layout direction of the connector line. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Whether the connector represents a completed step transition. */
+    completed?: boolean;
+}
+export declare const FlintStepConnector: React.ForwardRefExoticComponent<FlintStepConnectorProps & React.RefAttributes<FlintStepConnectorElement>>;

package/dist/components/FlintStepConnector.js

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

package/dist/components/FlintStepContent.d.ts

@@ -1,4 +1,12 @@
 import React from 'react';
 import { FlintStepContent as FlintStepContentElement } from '@getufy/flint-ui/stepper/flint-stepper';
-export declare const FlintStepContent: import("@lit/react").ReactWebComponent<FlintStepContentElement, {}>;
-export type FlintStepContentProps = React.ComponentProps<typeof FlintStepContent>;
+/**
+ * Step Content: the collapsible content area for a step.
+ *
+ * @slot - Step content.
+ */
+export interface FlintStepContentProps extends React.HTMLAttributes<FlintStepContentElement> {
+    /** Whether the content is visible. Defaults true so standalone usage always shows. */
+    open?: boolean;
+}
+export declare const FlintStepContent: React.ForwardRefExoticComponent<FlintStepContentProps & React.RefAttributes<FlintStepContentElement>>;

package/dist/components/FlintStepContent.js

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

package/dist/components/FlintStepLabel.d.ts

@@ -1,4 +1,17 @@
 import React from 'react';
 import { FlintStepLabel as FlintStepLabelElement } from '@getufy/flint-ui/stepper/flint-stepper';
-export declare const FlintStepLabel: import("@lit/react").ReactWebComponent<FlintStepLabelElement, {}>;
-export type FlintStepLabelProps = React.ComponentProps<typeof FlintStepLabel>;
+/**
+ * Step Label: the label for a step.
+ *
+ * @slot - Label text.
+ * @slot optional - Optional step text.
+ */
+export interface FlintStepLabelProps extends React.HTMLAttributes<FlintStepLabelElement> {
+    /** Whether the label's step is currently active. */
+    active?: boolean;
+    /** Whether the label's step is disabled. */
+    disabled?: boolean;
+    /** Whether the label's step is in an error state. */
+    error?: boolean;
+}
+export declare const FlintStepLabel: React.ForwardRefExoticComponent<FlintStepLabelProps & React.RefAttributes<FlintStepLabelElement>>;

package/dist/components/FlintStepLabel.js

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

package/dist/components/FlintStepper.d.ts

@@ -1,7 +1,25 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintStepper as FlintStepperElement } from '@getufy/flint-ui/stepper/flint-stepper';
-export declare const FlintStepper: import("@lit/react").ReactWebComponent<FlintStepperElement, {
-    onFlintStepChange: EventName<CustomEvent>;
-}>;
-export type FlintStepperProps = React.ComponentProps<typeof FlintStepper>;
+export interface FlintStepChangeDetail {
+    step: number;
+}
+/**
+ * Stepper: a multi-step progress indicator.
+ */
+export interface FlintStepperProps extends React.HTMLAttributes<FlintStepperElement> {
+    /** Zero-based index of the currently active step. */
+    activeStep?: number;
+    /** Initial active step for uncontrolled usage. */
+    defaultActiveStep?: number;
+    /** Layout direction of the stepper. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Whether to display step labels below the icons instead of beside them. */
+    alternativeLabel?: boolean;
+    /** Whether steps can be navigated in any order (enables clickable steps). */
+    nonLinear?: boolean;
+    /** Accessible label for the stepper landmark (maps to aria-label on the list element). */
+    label?: string;
+    /** Fired when the active step changes via step click. */
+    onFlintStepChange?: (event: CustomEvent<FlintStepChangeDetail>) => void;
+}
+export declare const FlintStepper: React.ForwardRefExoticComponent<FlintStepperProps & React.RefAttributes<FlintStepperElement>>;

package/dist/components/FlintStepper.js

@@ -0,0 +1,15 @@
+// src/components/FlintStepper.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintStepper as FlintStepperElement } from "@getufy/flint-ui/stepper/flint-stepper";
+var FlintStepper = createComponent({
+  tagName: "flint-stepper",
+  elementClass: FlintStepperElement,
+  react: React,
+  events: {
+    onFlintStepChange: "flint-step-change"
+  }
+});
+export {
+  FlintStepper
+};

package/dist/components/FlintSwitch.d.ts

@@ -1,7 +1,35 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintSwitch as FlintSwitchElement } from '@getufy/flint-ui/switch/flint-switch';
-export declare const FlintSwitch: import("@lit/react").ReactWebComponent<FlintSwitchElement, {
-    onFlintSwitchChange: EventName<CustomEvent>;
-}>;
-export type FlintSwitchProps = React.ComponentProps<typeof FlintSwitch>;
+export interface FlintSwitchChangeDetail {
+    checked: boolean;
+}
+/**
+ * A Switch component for toggling settings.
+ *
+ * @slot icon-on - Optional icon to show when the switch is ON.
+ * @slot icon-off - Optional icon to show when the switch is OFF.
+ * @slot - Optional label content (used when the `label` prop is not set).
+ */
+export interface FlintSwitchProps extends Omit<React.HTMLAttributes<FlintSwitchElement>, 'defaultChecked'> {
+    /** Whether the switch is toggled on. */
+    checked?: boolean;
+    /** Disables the switch and prevents interaction. */
+    disabled?: boolean;
+    /** Marks the switch as required for form validation. */
+    required?: boolean;
+    /** Size of the switch control. */
+    size?: 'sm' | 'md' | 'lg';
+    /** Visible label text displayed next to the switch. */
+    label?: string;
+    /** Form field name used when submitting form data. */
+    name?: string;
+    /** Value submitted with form data when checked. */
+    value?: string;
+    /** Initial checked state for uncontrolled usage. */
+    defaultChecked?: boolean;
+    /** Accessible label for screen readers when no visible label is provided. */
+    ariaLabel?: string | null;
+    /** Dispatched when the switch state changes. Detail: `{ checked: boolean }` */
+    onFlintSwitchChange?: (event: CustomEvent<FlintSwitchChangeDetail>) => void;
+}
+export declare const FlintSwitch: React.ForwardRefExoticComponent<FlintSwitchProps & React.RefAttributes<FlintSwitchElement>>;

package/dist/components/FlintSwitch.js

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

package/dist/components/FlintTab.d.ts

@@ -1,7 +1,25 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintTab as FlintTabElement } from '@getufy/flint-ui/tabs/flint-tabs';
-export declare const FlintTab: import("@lit/react").ReactWebComponent<FlintTabElement, {
-    onFlintTabClick: EventName<CustomEvent>;
-}>;
-export type FlintTabProps = React.ComponentProps<typeof FlintTab>;
+export interface FlintTabClickDetail {
+    value: string;
+}
+/**
+ * Tab: an individual tab button within a tab list.
+ */
+export interface FlintTabProps extends React.HTMLAttributes<FlintTabElement> {
+    /** Unique identifier for this tab. */
+    value?: string;
+    /** Whether the tab is disabled. */
+    disabled?: boolean;
+    /** Whether the tab is currently selected. */
+    selected?: boolean;
+    /** Position of the icon slot relative to the label. */
+    iconPosition?: 'top' | 'bottom' | 'start' | 'end';
+    /** URL to navigate to, renders the tab as a link. */
+    href?: string;
+    /** Whether the tab stretches to fill available width. */
+    fullWidth?: boolean;
+    /** Fired when the tab is clicked or activated via keyboard. */
+    onFlintTabClick?: (event: CustomEvent<FlintTabClickDetail>) => void;
+}
+export declare const FlintTab: React.ForwardRefExoticComponent<FlintTabProps & React.RefAttributes<FlintTabElement>>;

package/dist/components/FlintTab.js

@@ -0,0 +1,15 @@
+// src/components/FlintTab.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintTab as FlintTabElement } from "@getufy/flint-ui/tabs/flint-tabs";
+var FlintTab = createComponent({
+  tagName: "flint-tab",
+  elementClass: FlintTabElement,
+  react: React,
+  events: {
+    onFlintTabClick: "flint-tab-click"
+  }
+});
+export {
+  FlintTab
+};

package/dist/components/FlintTabList.d.ts

@@ -1,7 +1,16 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintTabList as FlintTabListElement } from '@getufy/flint-ui/tabs/flint-tabs';
-export declare const FlintTabList: import("@lit/react").ReactWebComponent<FlintTabListElement, {
-    onFlintTabClick: EventName<CustomEvent>;
-}>;
-export type FlintTabListProps = React.ComponentProps<typeof FlintTabList>;
+export interface FlintTabListProps extends React.HTMLAttributes<FlintTabListElement> {
+    /** Layout direction of the tab list. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Display variant controlling tab sizing and scrollability. */
+    variant?: 'standard' | 'fullWidth' | 'scrollable';
+    /** Whether to center the tabs within the tab list. */
+    centered?: boolean;
+    /** Whether to show scroll buttons in scrollable mode. */
+    scrollButtons?: 'auto' | 'false';
+    /** Accessible label for the tab list. */
+    ariaLabel?: string;
+    onFlintTabClick?: (event: CustomEvent) => void;
+}
+export declare const FlintTabList: React.ForwardRefExoticComponent<FlintTabListProps & React.RefAttributes<FlintTabListElement>>;

package/dist/components/FlintTabList.js

@@ -0,0 +1,15 @@
+// src/components/FlintTabList.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintTabList as FlintTabListElement } from "@getufy/flint-ui/tabs/flint-tabs";
+var FlintTabList = createComponent({
+  tagName: "flint-tab-list",
+  elementClass: FlintTabListElement,
+  react: React,
+  events: {
+    onFlintTabClick: "flint-tab-click"
+  }
+});
+export {
+  FlintTabList
+};

package/dist/components/FlintTabPanel.d.ts

@@ -1,4 +1,7 @@
 import React from 'react';
 import { FlintTabPanel as FlintTabPanelElement } from '@getufy/flint-ui/tabs/flint-tabs';
-export declare const FlintTabPanel: import("@lit/react").ReactWebComponent<FlintTabPanelElement, {}>;
-export type FlintTabPanelProps = React.ComponentProps<typeof FlintTabPanel>;
+export interface FlintTabPanelProps extends React.HTMLAttributes<FlintTabPanelElement> {
+    /** Identifier linking this panel to its corresponding tab. */
+    value?: string;
+}
+export declare const FlintTabPanel: React.ForwardRefExoticComponent<FlintTabPanelProps & React.RefAttributes<FlintTabPanelElement>>;

package/dist/components/FlintTabPanel.js

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

package/dist/components/FlintTable.d.ts

@@ -1,4 +1,10 @@
 import React from 'react';
 import { FlintTable as FlintTableElement } from '@getufy/flint-ui/table/flint-table';
-export declare const FlintTable: import("@lit/react").ReactWebComponent<FlintTableElement, {}>;
-export type FlintTableProps = React.ComponentProps<typeof FlintTable>;
+/**
+ * flint-table
+ */
+export interface FlintTableProps extends React.HTMLAttributes<FlintTableElement> {
+    /** Cell padding density. */
+    size?: 'medium' | 'small';
+}
+export declare const FlintTable: React.ForwardRefExoticComponent<FlintTableProps & React.RefAttributes<FlintTableElement>>;

package/dist/components/FlintTable.js

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

package/dist/components/FlintTableBody.d.ts

@@ -1,4 +1,10 @@
 import React from 'react';
 import { FlintTableBody as FlintTableBodyElement } from '@getufy/flint-ui/table/flint-table';
-export declare const FlintTableBody: import("@lit/react").ReactWebComponent<FlintTableBodyElement, {}>;
-export type FlintTableBodyProps = React.ComponentProps<typeof FlintTableBody>;
+/**
+ * flint-table-body
+ */
+export interface FlintTableBodyProps extends React.HTMLAttributes<FlintTableBodyElement> {
+    /** Enables alternating row shading. */
+    striped?: boolean;
+}
+export declare const FlintTableBody: React.ForwardRefExoticComponent<FlintTableBodyProps & React.RefAttributes<FlintTableBodyElement>>;

package/dist/components/FlintTableBody.js

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

package/dist/components/FlintTableCell.d.ts

@@ -1,4 +1,14 @@
 import React from 'react';
 import { FlintTableCell as FlintTableCellElement } from '@getufy/flint-ui/table/flint-table';
-export declare const FlintTableCell: import("@lit/react").ReactWebComponent<FlintTableCellElement, {}>;
-export type FlintTableCellProps = React.ComponentProps<typeof FlintTableCell>;
+/**
+ * flint-table-cell
+ */
+export interface FlintTableCellProps extends React.HTMLAttributes<FlintTableCellElement> {
+    /** Renders the cell with header styling. */
+    header?: boolean;
+    /** Text alignment within the cell. */
+    align?: 'left' | 'right' | 'center';
+    /** Padding preset for the cell. */
+    padding?: 'normal' | 'checkbox' | 'none';
+}
+export declare const FlintTableCell: React.ForwardRefExoticComponent<FlintTableCellProps & React.RefAttributes<FlintTableCellElement>>;

package/dist/components/FlintTableCell.js

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

package/dist/components/FlintTableContainer.d.ts

@@ -1,4 +1,12 @@
 import React from 'react';
 import { FlintTableContainer as FlintTableContainerElement } from '@getufy/flint-ui/table/flint-table';
-export declare const FlintTableContainer: import("@lit/react").ReactWebComponent<FlintTableContainerElement, {}>;
-export type FlintTableContainerProps = React.ComponentProps<typeof FlintTableContainer>;
+/**
+ * flint-table-container
+ */
+export interface FlintTableContainerProps extends React.HTMLAttributes<FlintTableContainerElement> {
+    /** Applies a stronger box-shadow elevation. */
+    shadow?: boolean;
+    /** Sticks the table header to the top on scroll. */
+    stickyHeader?: boolean;
+}
+export declare const FlintTableContainer: React.ForwardRefExoticComponent<FlintTableContainerProps & React.RefAttributes<FlintTableContainerElement>>;

package/dist/components/FlintTableContainer.js

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

package/dist/components/FlintTableFooter.d.ts

@@ -1,4 +1,8 @@
 import React from 'react';
 import { FlintTableFooter as FlintTableFooterElement } from '@getufy/flint-ui/table/flint-table';
-export declare const FlintTableFooter: import("@lit/react").ReactWebComponent<FlintTableFooterElement, {}>;
-export type FlintTableFooterProps = React.ComponentProps<typeof FlintTableFooter>;
+/**
+ * flint-table-footer
+ */
+export interface FlintTableFooterProps extends React.HTMLAttributes<FlintTableFooterElement> {
+}
+export declare const FlintTableFooter: React.ForwardRefExoticComponent<FlintTableFooterProps & React.RefAttributes<FlintTableFooterElement>>;

package/dist/components/FlintTableFooter.js

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

package/dist/components/FlintTableHead.d.ts

@@ -1,4 +1,8 @@
 import React from 'react';
 import { FlintTableHead as FlintTableHeadElement } from '@getufy/flint-ui/table/flint-table';
-export declare const FlintTableHead: import("@lit/react").ReactWebComponent<FlintTableHeadElement, {}>;
-export type FlintTableHeadProps = React.ComponentProps<typeof FlintTableHead>;
+/**
+ * flint-table-head
+ */
+export interface FlintTableHeadProps extends React.HTMLAttributes<FlintTableHeadElement> {
+}
+export declare const FlintTableHead: React.ForwardRefExoticComponent<FlintTableHeadProps & React.RefAttributes<FlintTableHeadElement>>;

package/dist/components/FlintTableHead.js

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

package/dist/components/FlintTablePagination.d.ts

@@ -1,8 +1,34 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintTablePagination as FlintTablePaginationElement } from '@getufy/flint-ui/table/flint-table-pagination';
-export declare const FlintTablePagination: import("@lit/react").ReactWebComponent<FlintTablePaginationElement, {
-    onFlintPaginationPageChange: EventName<CustomEvent>;
-    onFlintPaginationRowsPerPageChange: EventName<CustomEvent>;
-}>;
-export type FlintTablePaginationProps = React.ComponentProps<typeof FlintTablePagination>;
+export interface FlintPaginationPageChangeDetail {
+    page: number;
+}
+export interface FlintPaginationRowsPerPageChangeDetail {
+    rowsPerPage: number;
+}
+/**
+ * Table Pagination: pagination controls for tabular data.
+ */
+export interface FlintTablePaginationProps extends React.HTMLAttributes<FlintTablePaginationElement> {
+    /** Total number of rows. */
+    count?: number;
+    /** Controlled current page (0-indexed). */
+    page?: number;
+    /** Controlled rows per page. */
+    rowsPerPage?: number;
+    /** Available rows-per-page options. */
+    rowsPerPageOptions?: number[];
+    /** Uncontrolled default page (applied on first render). */
+    defaultPage?: number;
+    /** Uncontrolled default rows per page. */
+    defaultRowsPerPage?: number;
+    /** Show First/Last page buttons. */
+    showFirstLast?: boolean;
+    /** Label for the rows-per-page selector. */
+    labelRowsPerPage?: string;
+    /** Fired when the current page changes. */
+    onFlintPaginationPageChange?: (event: CustomEvent<FlintPaginationPageChangeDetail>) => void;
+    /** Fired when rows per page changes. */
+    onFlintPaginationRowsPerPageChange?: (event: CustomEvent<FlintPaginationRowsPerPageChangeDetail>) => void;
+}
+export declare const FlintTablePagination: React.ForwardRefExoticComponent<FlintTablePaginationProps & React.RefAttributes<FlintTablePaginationElement>>;

package/dist/components/FlintTablePagination.js

@@ -0,0 +1,16 @@
+// src/components/FlintTablePagination.tsx
+import React from "react";
+import { createComponent } from "@lit/react";
+import { FlintTablePagination as FlintTablePaginationElement } from "@getufy/flint-ui/table/flint-table-pagination";
+var FlintTablePagination = createComponent({
+  tagName: "flint-table-pagination",
+  elementClass: FlintTablePaginationElement,
+  react: React,
+  events: {
+    onFlintPaginationPageChange: "flint-pagination-page-change",
+    onFlintPaginationRowsPerPageChange: "flint-pagination-rows-per-page-change"
+  }
+});
+export {
+  FlintTablePagination
+};

package/dist/components/FlintTableRow.d.ts

@@ -1,4 +1,12 @@
 import React from 'react';
 import { FlintTableRow as FlintTableRowElement } from '@getufy/flint-ui/table/flint-table';
-export declare const FlintTableRow: import("@lit/react").ReactWebComponent<FlintTableRowElement, {}>;
-export type FlintTableRowProps = React.ComponentProps<typeof FlintTableRow>;
+/**
+ * flint-table-row
+ */
+export interface FlintTableRowProps extends React.HTMLAttributes<FlintTableRowElement> {
+    /** Highlights the row as selected. */
+    selected?: boolean;
+    /** Forces hover highlight on the row. */
+    hover?: boolean;
+}
+export declare const FlintTableRow: React.ForwardRefExoticComponent<FlintTableRowProps & React.RefAttributes<FlintTableRowElement>>;

package/dist/components/FlintTableRow.js

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

package/dist/components/FlintTableSortLabel.d.ts

@@ -1,4 +1,9 @@
 import React from 'react';
 import { FlintTableSortLabel as FlintTableSortLabelElement } from '@getufy/flint-ui/table/flint-table-sort-label';
-export declare const FlintTableSortLabel: import("@lit/react").ReactWebComponent<FlintTableSortLabelElement, {}>;
-export type FlintTableSortLabelProps = React.ComponentProps<typeof FlintTableSortLabel>;
+export interface FlintTableSortLabelProps extends React.HTMLAttributes<FlintTableSortLabelElement> {
+    /** Whether this column is currently sorted. */
+    active?: boolean;
+    /** Sort direction when active. */
+    direction?: 'asc' | 'desc';
+}
+export declare const FlintTableSortLabel: React.ForwardRefExoticComponent<FlintTableSortLabelProps & React.RefAttributes<FlintTableSortLabelElement>>;

package/dist/components/FlintTableSortLabel.js

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

package/dist/components/FlintTabs.d.ts

@@ -1,7 +1,29 @@
 import React from 'react';
-import { type EventName } from '@lit/react';
 import { FlintTabs as FlintTabsElement } from '@getufy/flint-ui/tabs/flint-tabs';
-export declare const FlintTabs: import("@lit/react").ReactWebComponent<FlintTabsElement, {
-    onFlintTabChange: EventName<CustomEvent>;
-}>;
-export type FlintTabsProps = React.ComponentProps<typeof FlintTabs>;
+export interface FlintTabChangeDetail {
+    value: string;
+}
+/**
+ * Tabs: container that coordinates tab selection and panel visibility.
+ */
+export interface FlintTabsProps extends Omit<React.HTMLAttributes<FlintTabsElement>, 'defaultValue'> {
+    /** The currently active tab value. */
+    value?: string;
+    /** Layout direction of the tabs. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Display variant controlling tab sizing and scrollability. */
+    variant?: 'standard' | 'fullWidth' | 'scrollable';
+    /** Whether to center the tabs. */
+    centered?: boolean;
+    /** Whether to show scroll buttons in scrollable mode. */
+    scrollButtons?: 'auto' | 'false';
+    /** 'primary' | 'secondary' | 'inherit' | any CSS color */
+    textColor?: string;
+    /** 'primary' | 'secondary' | any CSS color */
+    indicatorColor?: string;
+    /** Uncontrolled mode: initial value if `value` not set */
+    defaultValue?: string;
+    /** Fired when the active tab changes. */
+    onFlintTabChange?: (event: CustomEvent<FlintTabChangeDetail>) => void;
+}
+export declare const FlintTabs: React.ForwardRefExoticComponent<FlintTabsProps & React.RefAttributes<FlintTabsElement>>;