@getufy/flint-ui-react 0.2.2 → 0.4.0

package/dist/components/FlintTypography.d.ts

@@ -1,4 +1,24 @@
 import React from 'react';
 import { FlintTypography as FlintTypographyElement } from '@getufy/flint-ui/typography/flint-typography';
-export declare const FlintTypography: import("@lit/react").ReactWebComponent<FlintTypographyElement, {}>;
-export type FlintTypographyProps = React.ComponentProps<typeof FlintTypography>;
+/**
+ * Typography component for displaying text with consistent theme styles.
+ *
+ * @slot - The text content.
+ */
+export interface FlintTypographyProps extends Omit<React.HTMLAttributes<FlintTypographyElement>, 'color'> {
+    /** Variant of the typography. */
+    variant?: FlintTypographyElement['variant'];
+    /** The color of the text. */
+    color?: FlintTypographyElement['color'];
+    /** Override the rendered HTML tag. */
+    component?: string;
+    /** Text alignment. */
+    align?: 'left' | 'center' | 'right' | 'justify';
+    /** If true, text is truncated with an ellipsis. */
+    noWrap?: boolean;
+    /** If true, adds a bottom margin. */
+    gutterBottom?: boolean;
+    /** If true, adds paragraph margin bottom. */
+    paragraph?: boolean;
+}
+export declare const FlintTypography: React.ForwardRefExoticComponent<FlintTypographyProps & React.RefAttributes<FlintTypographyElement>>;

package/dist/components/FlintTypography.js

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

package/dist/components/FlintVisuallyHidden.d.ts

@@ -1,4 +1,13 @@
 import React from 'react';
 import { FlintVisuallyHidden as FlintVisuallyHiddenElement } from '@getufy/flint-ui/visually-hidden/flint-visually-hidden';
-export declare const FlintVisuallyHidden: import("@lit/react").ReactWebComponent<FlintVisuallyHiddenElement, {}>;
-export type FlintVisuallyHiddenProps = React.ComponentProps<typeof FlintVisuallyHidden>;
+/**
+ * Makes content accessible to assistive devices (screen readers) without
+displaying it visually on screen.
+ *
+ * @slot - The content to be visually hidden.
+ */
+export interface FlintVisuallyHiddenProps extends React.HTMLAttributes<FlintVisuallyHiddenElement> {
+    /** When `true`, the focus-reveal behaviour is disabled. */
+    notFocusable?: boolean;
+}
+export declare const FlintVisuallyHidden: React.ForwardRefExoticComponent<FlintVisuallyHiddenProps & React.RefAttributes<FlintVisuallyHiddenElement>>;

package/dist/components/FlintVisuallyHidden.js

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

package/dist/copy-button.d.ts

@@ -1,2 +1,2 @@
-export { FlintCopyButton, type FlintCopyButtonProps } from './components/FlintCopyButton.js';
+export { FlintCopyButton, type FlintCopyButtonProps, type FlintCopyErrorDetail, type FlintCopyDetail } from './components/FlintCopyButton.js';
 export { FlintCopyButtonEvents } from './events/flint-copy-button.js';

package/dist/date-field.d.ts

@@ -1,2 +1,2 @@
-export { FlintDateField, type FlintDateFieldProps } from './components/FlintDateField.js';
+export { FlintDateField, type FlintDateFieldProps, type FlintDateFieldChangeDetail } from './components/FlintDateField.js';
 export { FlintDateFieldEvents } from './events/flint-date-field.js';

package/dist/date-picker.d.ts

@@ -1,4 +1,4 @@
-export { FlintDatePickerCalendar, type FlintDatePickerCalendarProps } from './components/FlintDatePickerCalendar.js';
-export { FlintDatePicker, type FlintDatePickerProps } from './components/FlintDatePicker.js';
+export { FlintDatePickerCalendar, type FlintDatePickerCalendarProps, type FlintDatePickerSelectDetail } from './components/FlintDatePickerCalendar.js';
+export { FlintDatePicker, type FlintDatePickerProps, type FlintDatePickerChangeDetail } from './components/FlintDatePicker.js';
 export { FlintDatePickerCalendarEvents } from './events/flint-date-picker-calendar.js';
 export { FlintDatePickerEvents } from './events/flint-date-picker.js';

package/dist/date-picker.js

@@ -20,7 +20,7 @@ var FlintDatePicker = createComponent2({
   elementClass: FlintDatePickerElement,
   react: React2,
   events: {
-    onChange: "change"
+    onFlintDatePickerChange: "flint-date-picker-change"
   }
 });
 
@@ -31,7 +31,7 @@ var FlintDatePickerCalendarEvents = {
 
 // src/events/flint-date-picker.ts
 var FlintDatePickerEvents = {
-  CHANGE: "change"
+  CHANGE: "flint-date-picker-change"
 };
 export {
   FlintDatePicker,

package/dist/dialog.d.ts

@@ -1,4 +1,4 @@
-export { FlintDialog, type FlintDialogProps } from './components/FlintDialog.js';
+export { FlintDialog, type FlintDialogProps, type FlintDialogCloseDetail } from './components/FlintDialog.js';
 export { FlintDialogTitle, type FlintDialogTitleProps } from './components/FlintDialogTitle.js';
 export { FlintDialogContent, type FlintDialogContentProps } from './components/FlintDialogContent.js';
 export { FlintDialogContentText, type FlintDialogContentTextProps } from './components/FlintDialogContentText.js';

package/dist/dialog.js

@@ -7,7 +7,7 @@ var FlintDialog = createComponent({
   elementClass: FlintDialogElement,
   react: React,
   events: {
-    onClose: "close"
+    onFlintDialogClose: "flint-dialog-close"
   }
 });
 
@@ -53,7 +53,7 @@ var FlintDialogActions = createComponent5({
 
 // src/events/flint-dialog.ts
 var FlintDialogEvents = {
-  CLOSE: "close"
+  CLOSE: "flint-dialog-close"
 };
 export {
   FlintDialog,

package/dist/drawer.d.ts

@@ -1,2 +1,2 @@
-export { FlintDrawer, type FlintDrawerProps } from './components/FlintDrawer.js';
+export { FlintDrawer, type FlintDrawerProps, type FlintDrawerCloseDetail } from './components/FlintDrawer.js';
 export { FlintDrawerEvents } from './events/flint-drawer.js';

package/dist/events/flint-accordion-summary.js

@@ -0,0 +1,7 @@
+// src/events/flint-accordion-summary.ts
+var FlintAccordionSummaryEvents = {
+  ACCORDION_TOGGLE: "flint-accordion-toggle"
+};
+export {
+  FlintAccordionSummaryEvents
+};

package/dist/events/flint-accordion.js

@@ -0,0 +1,7 @@
+// src/events/flint-accordion.ts
+var FlintAccordionEvents = {
+  CHANGE: "flint-accordion-change"
+};
+export {
+  FlintAccordionEvents
+};

package/dist/events/flint-alert.js

@@ -0,0 +1,7 @@
+// src/events/flint-alert.ts
+var FlintAlertEvents = {
+  CLOSE: "flint-alert-close"
+};
+export {
+  FlintAlertEvents
+};

package/dist/events/flint-autocomplete.js

@@ -0,0 +1,7 @@
+// src/events/flint-autocomplete.ts
+var FlintAutocompleteEvents = {
+  CHANGE: "flint-autocomplete-change"
+};
+export {
+  FlintAutocompleteEvents
+};

package/dist/events/flint-backdrop.js

@@ -0,0 +1,7 @@
+// src/events/flint-backdrop.ts
+var FlintBackdropEvents = {
+  CLOSE: "flint-backdrop-close"
+};
+export {
+  FlintBackdropEvents
+};

package/dist/events/flint-bottom-navigation.js

@@ -0,0 +1,7 @@
+// src/events/flint-bottom-navigation.ts
+var FlintBottomNavigationEvents = {
+  CHANGE: "flint-bottom-navigation-change"
+};
+export {
+  FlintBottomNavigationEvents
+};

package/dist/events/flint-box.js

@@ -0,0 +1,7 @@
+// src/events/flint-box.ts
+var FlintBoxEvents = {
+  WARNING: "flint-box-warning"
+};
+export {
+  FlintBoxEvents
+};

package/dist/events/flint-carousel.js

@@ -0,0 +1,7 @@
+// src/events/flint-carousel.ts
+var FlintCarouselEvents = {
+  CHANGE: "flint-carousel-change"
+};
+export {
+  FlintCarouselEvents
+};

package/dist/events/flint-checkbox.js

@@ -0,0 +1,7 @@
+// src/events/flint-checkbox.ts
+var FlintCheckboxEvents = {
+  CHANGE: "flint-checkbox-change"
+};
+export {
+  FlintCheckboxEvents
+};

package/dist/events/flint-chip.d.ts

@@ -1,4 +1,4 @@
 export declare const FlintChipEvents: {
-    readonly CLICK: "click";
+    readonly CLICK: "flint-chip-click";
     readonly DELETE: "flint-chip-delete";
 };

package/dist/events/flint-chip.js

@@ -0,0 +1,8 @@
+// src/events/flint-chip.ts
+var FlintChipEvents = {
+  CLICK: "flint-chip-click",
+  DELETE: "flint-chip-delete"
+};
+export {
+  FlintChipEvents
+};

package/dist/events/flint-collapsible.js

@@ -0,0 +1,7 @@
+// src/events/flint-collapsible.ts
+var FlintCollapsibleEvents = {
+  CHANGE: "flint-collapsible-change"
+};
+export {
+  FlintCollapsibleEvents
+};

package/dist/events/flint-command-dialog.js

@@ -0,0 +1,7 @@
+// src/events/flint-command-dialog.ts
+var FlintCommandDialogEvents = {
+  CLOSE: "flint-command-dialog-close"
+};
+export {
+  FlintCommandDialogEvents
+};

package/dist/events/flint-command-item.js

@@ -0,0 +1,7 @@
+// src/events/flint-command-item.ts
+var FlintCommandItemEvents = {
+  SELECT: "flint-command-item-select"
+};
+export {
+  FlintCommandItemEvents
+};

package/dist/events/flint-command.js

@@ -0,0 +1,7 @@
+// src/events/flint-command.ts
+var FlintCommandEvents = {
+  ITEM_SELECT: "flint-command-item-select"
+};
+export {
+  FlintCommandEvents
+};

package/dist/events/flint-copy-button.js

@@ -0,0 +1,8 @@
+// src/events/flint-copy-button.ts
+var FlintCopyButtonEvents = {
+  COPY_ERROR: "flint-copy-error",
+  COPY: "flint-copy"
+};
+export {
+  FlintCopyButtonEvents
+};

package/dist/events/flint-date-field.js

@@ -0,0 +1,8 @@
+// src/events/flint-date-field.ts
+var FlintDateFieldEvents = {
+  CLEAR: "flint-date-field-clear",
+  CHANGE: "flint-date-field-change"
+};
+export {
+  FlintDateFieldEvents
+};

package/dist/events/flint-date-picker-calendar.js

@@ -0,0 +1,7 @@
+// src/events/flint-date-picker-calendar.ts
+var FlintDatePickerCalendarEvents = {
+  DATE_PICKER_SELECT: "flint-date-picker-select"
+};
+export {
+  FlintDatePickerCalendarEvents
+};

package/dist/events/flint-date-picker.d.ts

@@ -1,3 +1,3 @@
 export declare const FlintDatePickerEvents: {
-    readonly CHANGE: "change";
+    readonly CHANGE: "flint-date-picker-change";
 };

package/dist/events/flint-date-picker.js

@@ -0,0 +1,7 @@
+// src/events/flint-date-picker.ts
+var FlintDatePickerEvents = {
+  CHANGE: "flint-date-picker-change"
+};
+export {
+  FlintDatePickerEvents
+};

package/dist/events/flint-date-range-calendar.js

@@ -0,0 +1,7 @@
+// src/events/flint-date-range-calendar.ts
+var FlintDateRangeCalendarEvents = {
+  DATE_RANGE_PICKER_SELECT: "flint-date-range-picker-select"
+};
+export {
+  FlintDateRangeCalendarEvents
+};

package/dist/events/flint-date-range-picker.js

@@ -0,0 +1,7 @@
+// src/events/flint-date-range-picker.ts
+var FlintDateRangePickerEvents = {
+  CHANGE: "flint-date-range-picker-change"
+};
+export {
+  FlintDateRangePickerEvents
+};

package/dist/events/flint-desktop-time-picker.d.ts

@@ -1,3 +1,3 @@
 export declare const FlintDesktopTimePickerEvents: {
-    readonly CHANGE: "change";
+    readonly CHANGE: "flint-desktop-time-picker-change";
 };

package/dist/events/flint-desktop-time-picker.js

@@ -0,0 +1,7 @@
+// src/events/flint-desktop-time-picker.ts
+var FlintDesktopTimePickerEvents = {
+  CHANGE: "flint-desktop-time-picker-change"
+};
+export {
+  FlintDesktopTimePickerEvents
+};

package/dist/events/flint-dialog.d.ts

@@ -1,3 +1,3 @@
 export declare const FlintDialogEvents: {
-    readonly CLOSE: "close";
+    readonly CLOSE: "flint-dialog-close";
 };

package/dist/events/flint-dialog.js

@@ -0,0 +1,7 @@
+// src/events/flint-dialog.ts
+var FlintDialogEvents = {
+  CLOSE: "flint-dialog-close"
+};
+export {
+  FlintDialogEvents
+};

package/dist/events/flint-digital-clock.d.ts

@@ -1,3 +1,3 @@
 export declare const FlintDigitalClockEvents: {
-    readonly CHANGE: "change";
+    readonly CHANGE: "flint-digital-clock-change";
 };

package/dist/events/flint-digital-clock.js

@@ -0,0 +1,7 @@
+// src/events/flint-digital-clock.ts
+var FlintDigitalClockEvents = {
+  CHANGE: "flint-digital-clock-change"
+};
+export {
+  FlintDigitalClockEvents
+};

package/dist/events/flint-drawer.js

@@ -0,0 +1,7 @@
+// src/events/flint-drawer.ts
+var FlintDrawerEvents = {
+  CLOSE: "flint-drawer-close"
+};
+export {
+  FlintDrawerEvents
+};

package/dist/events/flint-hover-card.d.ts

@@ -0,0 +1,4 @@
+export declare const FlintHoverCardEvents: {
+    readonly OPEN: "flint-hover-card-open";
+    readonly CLOSE: "flint-hover-card-close";
+};

package/dist/events/flint-hover-card.js

@@ -0,0 +1,8 @@
+// src/events/flint-hover-card.ts
+var FlintHoverCardEvents = {
+  OPEN: "flint-hover-card-open",
+  CLOSE: "flint-hover-card-close"
+};
+export {
+  FlintHoverCardEvents
+};

package/dist/events/flint-image-comparer.js

@@ -0,0 +1,7 @@
+// src/events/flint-image-comparer.ts
+var FlintImageComparerEvents = {
+  CHANGE: "flint-image-comparer-change"
+};
+export {
+  FlintImageComparerEvents
+};

package/dist/events/flint-input-otp.js

@@ -0,0 +1,8 @@
+// src/events/flint-input-otp.ts
+var FlintInputOtpEvents = {
+  OTP_CHANGE: "flint-otp-change",
+  OTP_COMPLETE: "flint-otp-complete"
+};
+export {
+  FlintInputOtpEvents
+};

package/dist/events/flint-input.js

@@ -0,0 +1,8 @@
+// src/events/flint-input.ts
+var FlintInputEvents = {
+  INPUT: "flint-input-input",
+  CHANGE: "flint-input-change"
+};
+export {
+  FlintInputEvents
+};

package/dist/events/flint-menu-item.js

@@ -0,0 +1,7 @@
+// src/events/flint-menu-item.ts
+var FlintMenuItemEvents = {
+  SELECT: "flint-menu-item-select"
+};
+export {
+  FlintMenuItemEvents
+};

package/dist/events/flint-menu.js

@@ -0,0 +1,7 @@
+// src/events/flint-menu.ts
+var FlintMenuEvents = {
+  CLOSE: "flint-menu-close"
+};
+export {
+  FlintMenuEvents
+};

package/dist/events/flint-menubar-checkbox-item.js

@@ -0,0 +1,7 @@
+// src/events/flint-menubar-checkbox-item.ts
+var FlintMenubarCheckboxItemEvents = {
+  MENUBAR_CHECKBOX_CHANGE: "flint-menubar-checkbox-change"
+};
+export {
+  FlintMenubarCheckboxItemEvents
+};

package/dist/events/flint-menubar-content.js

@@ -0,0 +1,7 @@
+// src/events/flint-menubar-content.ts
+var FlintMenubarContentEvents = {
+  MENUBAR_REQUEST_CLOSE: "flint-menubar-request-close"
+};
+export {
+  FlintMenubarContentEvents
+};

package/dist/events/flint-menubar-item.js

@@ -0,0 +1,7 @@
+// src/events/flint-menubar-item.ts
+var FlintMenubarItemEvents = {
+  SELECT: "flint-menubar-item-select"
+};
+export {
+  FlintMenubarItemEvents
+};

package/dist/events/flint-menubar-radio-group.js

@@ -0,0 +1,7 @@
+// src/events/flint-menubar-radio-group.ts
+var FlintMenubarRadioGroupEvents = {
+  MENUBAR_RADIO_CHANGE: "flint-menubar-radio-change"
+};
+export {
+  FlintMenubarRadioGroupEvents
+};

package/dist/events/flint-menubar-radio-item.js

@@ -0,0 +1,7 @@
+// src/events/flint-menubar-radio-item.ts
+var FlintMenubarRadioItemEvents = {
+  MENUBAR_RADIO_SELECT: "flint-menubar-radio-select"
+};
+export {
+  FlintMenubarRadioItemEvents
+};

package/dist/events/flint-menubar.d.ts

@@ -0,0 +1,5 @@
+export declare const FlintMenubarEvents: {
+    readonly ITEM_SELECT: "flint-menubar-item-select";
+    readonly CHECKBOX_CHANGE: "flint-menubar-checkbox-change";
+    readonly RADIO_CHANGE: "flint-menubar-radio-change";
+};

package/dist/events/flint-menubar.js

@@ -0,0 +1,9 @@
+// src/events/flint-menubar.ts
+var FlintMenubarEvents = {
+  ITEM_SELECT: "flint-menubar-item-select",
+  CHECKBOX_CHANGE: "flint-menubar-checkbox-change",
+  RADIO_CHANGE: "flint-menubar-radio-change"
+};
+export {
+  FlintMenubarEvents
+};

package/dist/events/flint-mobile-stepper.d.ts

@@ -0,0 +1,4 @@
+export declare const FlintMobileStepperEvents: {
+    readonly MOBILE_STEP_BACK: "flint-mobile-step-back";
+    readonly MOBILE_STEP_NEXT: "flint-mobile-step-next";
+};

package/dist/events/flint-mobile-stepper.js

@@ -0,0 +1,8 @@
+// src/events/flint-mobile-stepper.ts
+var FlintMobileStepperEvents = {
+  MOBILE_STEP_BACK: "flint-mobile-step-back",
+  MOBILE_STEP_NEXT: "flint-mobile-step-next"
+};
+export {
+  FlintMobileStepperEvents
+};

package/dist/events/flint-mobile-time-picker.d.ts

@@ -1,3 +1,3 @@
 export declare const FlintMobileTimePickerEvents: {
-    readonly CHANGE: "change";
+    readonly CHANGE: "flint-mobile-time-picker-change";
 };

package/dist/events/flint-mobile-time-picker.js

@@ -0,0 +1,7 @@
+// src/events/flint-mobile-time-picker.ts
+var FlintMobileTimePickerEvents = {
+  CHANGE: "flint-mobile-time-picker-change"
+};
+export {
+  FlintMobileTimePickerEvents
+};

package/dist/events/flint-multi-section-digital-clock.d.ts

@@ -1,3 +1,3 @@
 export declare const FlintMultiSectionDigitalClockEvents: {
-    readonly CHANGE: "change";
+    readonly CHANGE: "flint-multi-section-digital-clock-change";
 };

package/dist/events/flint-multi-section-digital-clock.js

@@ -0,0 +1,7 @@
+// src/events/flint-multi-section-digital-clock.ts
+var FlintMultiSectionDigitalClockEvents = {
+  CHANGE: "flint-multi-section-digital-clock-change"
+};
+export {
+  FlintMultiSectionDigitalClockEvents
+};

package/dist/events/flint-navigation-menu-content.js

@@ -0,0 +1,7 @@
+// src/events/flint-navigation-menu-content.ts
+var FlintNavigationMenuContentEvents = {
+  TOGGLE: "flint-navigation-menu-content-toggle"
+};
+export {
+  FlintNavigationMenuContentEvents
+};

package/dist/events/flint-navigation-menu-item.js

@@ -0,0 +1,8 @@
+// src/events/flint-navigation-menu-item.ts
+var FlintNavigationMenuItemEvents = {
+  NAVIGATION_MENU_TRIGGER_CLICK: "flint-navigation-menu-trigger-click",
+  NAVIGATION_MENU_CONTENT_TOGGLE: "flint-navigation-menu-content-toggle"
+};
+export {
+  FlintNavigationMenuItemEvents
+};

package/dist/events/flint-navigation-menu-trigger.js

@@ -0,0 +1,7 @@
+// src/events/flint-navigation-menu-trigger.ts
+var FlintNavigationMenuTriggerEvents = {
+  CLICK: "flint-navigation-menu-trigger-click"
+};
+export {
+  FlintNavigationMenuTriggerEvents
+};

package/dist/events/flint-pagination.js

@@ -0,0 +1,7 @@
+// src/events/flint-pagination.ts
+var FlintPaginationEvents = {
+  CHANGE: "flint-pagination-change"
+};
+export {
+  FlintPaginationEvents
+};

package/dist/events/flint-radio-group.js

@@ -0,0 +1,7 @@
+// src/events/flint-radio-group.ts
+var FlintRadioGroupEvents = {
+  CHANGE: "flint-radio-group-change"
+};
+export {
+  FlintRadioGroupEvents
+};

package/dist/events/flint-radio.js

@@ -0,0 +1,7 @@
+// src/events/flint-radio.ts
+var FlintRadioEvents = {
+  SELECT: "flint-radio-select"
+};
+export {
+  FlintRadioEvents
+};

package/dist/events/flint-range-slider.js

@@ -0,0 +1,7 @@
+// src/events/flint-range-slider.ts
+var FlintRangeSliderEvents = {
+  CHANGE: "flint-range-slider-change"
+};
+export {
+  FlintRangeSliderEvents
+};

package/dist/events/flint-rating.js

@@ -0,0 +1,7 @@
+// src/events/flint-rating.ts
+var FlintRatingEvents = {
+  CHANGE: "flint-rating-change"
+};
+export {
+  FlintRatingEvents
+};