@tylertech/forge-ai-react 0.4.1 → 0.6.0

package/dist/ForgeAiSpinner.d.ts

@@ -0,0 +1,55 @@
+import React from "react";
+import { ForgeAiSpinner as ForgeAiSpinnerElement } from "@tylertech/forge-ai/ai-spinner";
+
+export type { ForgeAiSpinnerElement };
+
+export interface ForgeAiSpinnerProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
+  /** undefined */
+  size?: ForgeAiSpinnerElement["size"];
+
+  /** A space-separated list of the classes of the element. Classes allows CSS and JavaScript to select and access specific elements via the class selectors or functions like the method `Document.getElementsByClassName()`. */
+  className?: string;
+
+  /** Contains a space-separated list of the part names of the element that should be exposed on the host element. */
+  exportparts?: string;
+
+  /** Used for labels to link them with their inputs (using input id). */
+  htmlFor?: string;
+
+  /** Used to help React identify which items have changed, are added, or are removed within a list. */
+  key?: number | string;
+
+  /** Contains a space-separated list of the part names of the element. Part names allows CSS to select and style specific elements in a shadow tree via the ::part pseudo-element. */
+  part?: string;
+
+  /** A mutable ref object whose `.current` property is initialized to the passed argument (`initialValue`). The returned object will persist for the full lifetime of the component. */
+  ref?: any;
+
+  /** Allows developers to make HTML elements focusable, allow or prevent them from being sequentially focusable (usually with the `Tab` key, hence the name) and determine their relative ordering for sequential focus navigation. */
+  tabIndex?: number;
+}
+
+/**
+ * Indeterminate circular progress indicator.
+ * ---
+ *
+ *
+ * ### **CSS Properties:**
+ *  - **--forge-ai-spinner-color** - Color of the spinner indicator _(default: undefined)_
+ * - **--forge-ai-spinner-track-color** - Color of the spinner track _(default: undefined)_
+ */
+export const ForgeAiSpinner: React.ForwardRefExoticComponent<ForgeAiSpinnerProps>;

package/dist/ForgeAiSpinner.js

@@ -0,0 +1,21 @@
+import React, { forwardRef } from "react";
+import "@tylertech/forge-ai/ai-spinner";
+
+export const ForgeAiSpinner = forwardRef((props, forwardedRef) => {
+  const { size, ...filteredProps } = props;
+
+  return React.createElement(
+    "forge-ai-spinner",
+    {
+      ...filteredProps,
+      size: props.size,
+      class: props.className,
+      exportparts: props.exportparts,
+      for: props.htmlFor,
+      part: props.part,
+      tabindex: props.tabIndex,
+      style: { ...props.style },
+    },
+    props.children,
+  );
+});

package/dist/ForgeAiSuggestions.d.ts

@@ -3,22 +3,21 @@ import { ForgeAiSuggestions as ForgeAiSuggestionsElement } from "@tylertech/forg
 
 export type { ForgeAiSuggestionsElement };
 
-export interface ForgeAiSuggestionsProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiSuggestionsProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** Display variant for suggestions layout */
   variant?: ForgeAiSuggestionsElement["variant"];
 
@@ -59,5 +58,8 @@ export interface ForgeAiSuggestionsProps
  *
  * ### **Events:**
  *  - **forge-ai-suggestions-select** - Fired when a suggestion is selected.
+ *
+ * ### **CSS Properties:**
+ *  - **--forge-ai-suggestion-max-width** - The maximum width of the suggestion buttons in inline layout. _(default: undefined)_
  */
 export const ForgeAiSuggestions: React.ForwardRefExoticComponent<ForgeAiSuggestionsProps>;

package/dist/ForgeAiThinkingIndicator.d.ts

@@ -3,22 +3,30 @@ import { ForgeAiThinkingIndicator as ForgeAiThinkingIndicatorElement } from "@ty
 
 export type { ForgeAiThinkingIndicatorElement };
 
-export interface ForgeAiThinkingIndicatorProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiThinkingIndicatorProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
+  /** undefined */
+  showText?: boolean;
+
+  /** undefined */
+  initialDelay?: ForgeAiThinkingIndicatorElement["initialDelay"];
+
+  /** undefined */
+  cycleInterval?: ForgeAiThinkingIndicatorElement["cycleInterval"];
+
   /** A space-separated list of the classes of the element. Classes allows CSS and JavaScript to select and access specific elements via the class selectors or functions like the method `Document.getElementsByClassName()`. */
   className?: string;
 

package/dist/ForgeAiThinkingIndicator.js

@@ -2,15 +2,20 @@ import React, { forwardRef } from "react";
 import "@tylertech/forge-ai/ai-thinking-indicator";
 
 export const ForgeAiThinkingIndicator = forwardRef((props, forwardedRef) => {
+  const { showText, initialDelay, cycleInterval, ...filteredProps } = props;
+
   return React.createElement(
     "forge-ai-thinking-indicator",
     {
-      ...props,
+      ...filteredProps,
+      "initial-delay": props.initialDelay || props["initial-delay"],
+      "cycle-interval": props.cycleInterval || props["cycle-interval"],
       class: props.className,
       exportparts: props.exportparts,
       for: props.htmlFor,
       part: props.part,
       tabindex: props.tabIndex,
+      "show-text": props.showText ? true : undefined,
       style: { ...props.style },
     },
     props.children,

package/dist/ForgeAiThoughtBase.d.ts

@@ -3,22 +3,21 @@ import { ForgeAiThoughtBase as ForgeAiThoughtBaseElement } from "@tylertech/forg
 
 export type { ForgeAiThoughtBaseElement };
 
-export interface ForgeAiThoughtBaseProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiThoughtBaseProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** The step number for this thought */
   step?: ForgeAiThoughtBaseElement["step"];
 

package/dist/ForgeAiThoughtDetail.d.ts

@@ -3,22 +3,21 @@ import { ForgeAiThoughtDetail as ForgeAiThoughtDetailElement } from "@tylertech/
 
 export type { ForgeAiThoughtDetailElement };
 
-export interface ForgeAiThoughtDetailProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiThoughtDetailProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** A space-separated list of the classes of the element. Classes allows CSS and JavaScript to select and access specific elements via the class selectors or functions like the method `Document.getElementsByClassName()`. */
   className?: string;
 

package/dist/ForgeAiThoughtImage.d.ts

@@ -3,22 +3,21 @@ import { ForgeAiThoughtImage as ForgeAiThoughtImageElement } from "@tylertech/fo
 
 export type { ForgeAiThoughtImageElement };
 
-export interface ForgeAiThoughtImageProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiThoughtImageProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** The step number for this thought image */
   step?: ForgeAiThoughtImageElement["step"];
 

package/dist/ForgeAiThoughtSearchResult.d.ts

@@ -3,22 +3,21 @@ import { ForgeAiThoughtSearchResult as ForgeAiThoughtSearchResultElement } from
 
 export type { ForgeAiThoughtSearchResultElement };
 
-export interface ForgeAiThoughtSearchResultProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiThoughtSearchResultProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** The step number for this thought search result */
   step?: ForgeAiThoughtSearchResultElement["step"];
 

package/dist/ForgeAiThreads.d.ts

@@ -6,22 +6,21 @@ import {
 
 export type { ForgeAiThreadsElement, CustomEvent };
 
-export interface ForgeAiThreadsProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiThreadsProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** Array of threads to display in the navigation list */
   threads?: ForgeAiThreadsElement["threads"];
 
@@ -67,5 +66,8 @@ export interface ForgeAiThreadsProps
  *  - **forge-ai-threads-select** - Fired when a thread is selected.
  * - **forge-ai-threads-new-chat** - Fired when the new chat button is clicked.
  * - **forge-ai-threads-clear-history** - Fired when the clear history button is clicked.
+ *
+ * ### **Slots:**
+ *  - _default_ - Default slot for chatbot component
  */
 export const ForgeAiThreads: React.ForwardRefExoticComponent<ForgeAiThreadsProps>;

package/dist/ForgeAiToolDataTable.d.ts

@@ -0,0 +1,51 @@
+import React from "react";
+import { ForgeAiToolDataTable as ForgeAiToolDataTableElement } from "@tylertech/forge-ai/tools/ai-data-table";
+
+export type { ForgeAiToolDataTableElement };
+
+export interface ForgeAiToolDataTableProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
+  /** A space-separated list of the classes of the element. Classes allows CSS and JavaScript to select and access specific elements via the class selectors or functions like the method `Document.getElementsByClassName()`. */
+  className?: string;
+
+  /** Contains a space-separated list of the part names of the element that should be exposed on the host element. */
+  exportparts?: string;
+
+  /** Used for labels to link them with their inputs (using input id). */
+  htmlFor?: string;
+
+  /** Used to help React identify which items have changed, are added, or are removed within a list. */
+  key?: number | string;
+
+  /** Contains a space-separated list of the part names of the element. Part names allows CSS to select and style specific elements in a shadow tree via the ::part pseudo-element. */
+  part?: string;
+
+  /** A mutable ref object whose `.current` property is initialized to the passed argument (`initialValue`). The returned object will persist for the full lifetime of the component. */
+  ref?: any;
+
+  /** Allows developers to make HTML elements focusable, allow or prevent them from being sequentially focusable (usually with the `Tab` key, hence the name) and determine their relative ordering for sequential focus navigation. */
+  tabIndex?: number;
+
+  /** Tool call data containing table configuration and data */
+  toolCall?: ForgeAiToolDataTableElement["toolCall"];
+}
+
+/**
+ * Data table component tool renderer for displaying tabular data with pagination and filtering.
+ * ---
+ *
+ */
+export const ForgeAiToolDataTable: React.ForwardRefExoticComponent<ForgeAiToolDataTableProps>;

package/dist/ForgeAiToolDataTable.js

@@ -0,0 +1,33 @@
+import React, { forwardRef, useRef, useEffect } from "react";
+import "@tylertech/forge-ai/tools/ai-data-table";
+import { useProperties } from "./react-utils.js";
+
+export const ForgeAiToolDataTable = forwardRef((props, forwardedRef) => {
+  const ref = useRef(null);
+  const { toolCall, ...filteredProps } = props;
+
+  /** Properties - run whenever a property has changed */
+  useProperties(ref, "toolCall", props.toolCall);
+
+  return React.createElement(
+    "forge-ai-tool-data-table",
+    {
+      ref: (node) => {
+        ref.current = node;
+        if (typeof forwardedRef === "function") {
+          forwardedRef(node);
+        } else if (forwardedRef) {
+          forwardedRef.current = node;
+        }
+      },
+      ...filteredProps,
+      class: props.className,
+      exportparts: props.exportparts,
+      for: props.htmlFor,
+      part: props.part,
+      tabindex: props.tabIndex,
+      style: { ...props.style },
+    },
+    props.children,
+  );
+});

package/dist/ForgeAiTooltip.d.ts

@@ -3,22 +3,21 @@ import { ForgeAiTooltip as ForgeAiTooltipElement } from "@tylertech/forge-ai/cor
 
 export type { ForgeAiTooltipElement };
 
-export interface ForgeAiTooltipProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiTooltipProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** Whether the tooltip is open. */
   open?: boolean;
 
@@ -73,7 +72,7 @@ export interface ForgeAiTooltipProps
  *  - _default_ - The default slot for tooltip content.
  *
  * ### **CSS Properties:**
- *  - **--ai-tooltip-max-width** - The maximum width of the tooltip. _(default: undefined)_
- * - **--ai-tooltip-z-index** - The z-index of the tooltip overlay. _(default: undefined)_
+ *  - **--forge-ai-tooltip-max-width** - The maximum width of the tooltip. _(default: undefined)_
+ * - **--forge-ai-tooltip-z-index** - The z-index of the tooltip overlay. _(default: undefined)_
  */
 export const ForgeAiTooltip: React.ForwardRefExoticComponent<ForgeAiTooltipProps>;

package/dist/ForgeAiUserMessage.d.ts

@@ -3,22 +3,21 @@ import { ForgeAiUserMessage as ForgeAiUserMessageElement } from "@tylertech/forg
 
 export type { ForgeAiUserMessageElement };
 
-export interface ForgeAiUserMessageProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiUserMessageProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** A space-separated list of the classes of the element. Classes allows CSS and JavaScript to select and access specific elements via the class selectors or functions like the method `Document.getElementsByClassName()`. */
   className?: string;
 

package/dist/ForgeAiVoiceInput.d.ts

@@ -3,22 +3,21 @@ import { ForgeAiVoiceInput as ForgeAiVoiceInputElement } from "@tylertech/forge-
 
 export type { ForgeAiVoiceInputElement };
 
-export interface ForgeAiVoiceInputProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgeAiVoiceInputProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** A space-separated list of the classes of the element. Classes allows CSS and JavaScript to select and access specific elements via the class selectors or functions like the method `Document.getElementsByClassName()`. */
   className?: string;
 

package/dist/ForgePromptButton.d.ts

@@ -3,22 +3,21 @@ import { ForgePromptButton as ForgePromptButtonElement } from "@tylertech/forge-
 
 export type { ForgePromptButtonElement };
 
-export interface ForgePromptButtonProps
-  extends Pick<
-    React.AllHTMLAttributes<HTMLElement>,
-    | "children"
-    | "dir"
-    | "hidden"
-    | "id"
-    | "lang"
-    | "slot"
-    | "style"
-    | "title"
-    | "translate"
-    | "onClick"
-    | "onFocus"
-    | "onBlur"
-  > {
+export interface ForgePromptButtonProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
   /** Whether the button is disabled */
   disabled?: boolean;