@integration-app/react 2.3.1 → 2.4.1-beta.0

package/dist/types/components/DataBuilder/Formula/case.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const CaseFormula: import("react").ForwardRefExoticComponent<FormulaProps<FormulaClass.Case> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/concat.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const ConcatFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/copy.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const CopyFormula: import("react").ForwardRefExoticComponent<FormulaProps<FormulaClass.Copy> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/domainFromEmail.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const DomainFromEmailFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/extractDate.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const ExtractDateFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/extractTime.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const ExtractTimeFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/findAppRecordId.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const FindAppRecordIdFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/findExternalRecordId.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const FindExternalRecordIdFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/firstName.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const FirstNameFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/firstNotEmpty.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const FirstNotEmptyFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/iterate.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const IterateFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/jsonata.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const JsonataFormulaTag: import("react").ForwardRefExoticComponent<FormulaProps<FormulaClass.Jsonata> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/lastName.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const LastNameFormula: import("react").ForwardRefExoticComponent<FormulaProps<FormulaClass.LastName> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/lookup.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps } from './types';
 declare const LookupFormula: import("react").ForwardRefExoticComponent<FormulaProps<FormulaClass.Lookup> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/map.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const MapFormula: import("react").ForwardRefExoticComponent<FormulaProps<FormulaClass.Map> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/mergeObjects.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps, DropdownComponentFormulaProps } from './types';
 declare const MergeObjectsFormula: import("react").ForwardRefExoticComponent<FormulaProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/record.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula } from '@integration-app/sdk';
 import { FormulaProps } from './types';
 declare const RecordFormula: import("react").ForwardRefExoticComponent<FormulaProps<Formula.Record> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/tpl.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula as FormulaClass } from '@integration-app/sdk';
 import { FormulaProps } from './types';
 declare const TplFormula: import("react").ForwardRefExoticComponent<FormulaProps<FormulaClass.Tpl> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilder/Formula/var.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Formula } from '@integration-app/sdk';
 import { FormulaProps } from './types';
 declare const VarFormula: import("react").ForwardRefExoticComponent<FormulaProps<Formula.Var> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DataBuilderUI/FieldControlPanel/index.d.ts

@@ -9,7 +9,7 @@ export declare const FieldControlPanel: typeof FieldControlPanelRoot & {
     Text: typeof FieldControlPanelText;
     ButtonGroup: typeof FieldControlButtonGroup;
     Button: import("react").ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & {
-        isNested?: boolean | undefined;
+        isNested?: boolean;
     } & import("react").RefAttributes<HTMLButtonElement>>;
 };
 export {};

package/dist/types/components/DropdownUI/BackButton.d.ts

@@ -1,4 +1,4 @@
 import { HTMLAttributes } from 'react';
 export declare const BackButton: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLButtonElement> & {
-    current?: boolean | undefined;
+    current?: boolean;
 } & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/types/components/DropdownUI/ErrorHeading.d.ts

@@ -1,4 +1,4 @@
 import { HTMLAttributes } from 'react';
 export declare const ErrorHeading: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
-    text?: string | undefined;
+    text?: string;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DropdownUI/InfoHeading.d.ts

@@ -1,4 +1,4 @@
 import { HTMLAttributes } from 'react';
 export declare const InfoHeading: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
-    text?: string | undefined;
+    text?: string;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DropdownUI/Item.d.ts

@@ -1,7 +1,7 @@
 import { HTMLAttributes } from 'react';
 export declare const Item: import("react").ForwardRefExoticComponent<{
-    className?: string | undefined;
-    current?: boolean | undefined;
+    className?: string;
+    current?: boolean;
 } & HTMLAttributes<HTMLDivElement> & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DropdownUI/LoadingItem.d.ts

@@ -1,4 +1,4 @@
 import { HTMLAttributes } from 'react';
 export declare const LoadingItem: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
-    delay?: number | undefined;
+    delay?: number;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DropdownUI/NoOptionsHeading.d.ts

@@ -1,4 +1,4 @@
 import { HTMLAttributes } from 'react';
 export declare const NoOptionsHeading: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
-    text?: string | undefined;
+    text?: string;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/DropdownUI/Search.d.ts

@@ -1,7 +1,7 @@
 import { HTMLAttributes } from 'react';
 export declare const Search: import("react").ForwardRefExoticComponent<{
-    value?: string | undefined;
-    onChange?: ((value: string) => void) | undefined;
-    autoFocus?: boolean | undefined;
-    placeholder?: string | undefined;
+    value?: string;
+    onChange?: (value: string) => void;
+    autoFocus?: boolean;
+    placeholder?: HTMLInputElement["placeholder"];
 } & Omit<HTMLAttributes<HTMLDivElement>, "onChange"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/DropdownUI/index.d.ts

@@ -1,38 +1,37 @@
-/// <reference types="react" />
 import { ItemIcon } from './ItemIcon';
 import { ItemNestingIndicator } from './ItemNestingIndicator';
 import { ItemTitle } from './ItemTitle';
 export declare const DropdownUI: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>> & {
     Content: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
     Search: import("react").ForwardRefExoticComponent<{
-        value?: string | undefined;
-        onChange?: ((value: string) => void) | undefined;
-        autoFocus?: boolean | undefined;
-        placeholder?: string | undefined;
+        value?: string;
+        onChange?: (value: string) => void;
+        autoFocus?: boolean;
+        placeholder?: HTMLInputElement["placeholder"];
     } & Omit<import("react").HTMLAttributes<HTMLDivElement>, "onChange"> & import("react").RefAttributes<HTMLInputElement>>;
     Panel: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
     List: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
     Item: import("react").ForwardRefExoticComponent<{
-        className?: string | undefined;
-        current?: boolean | undefined;
+        className?: string;
+        current?: boolean;
     } & import("react").HTMLAttributes<HTMLDivElement> & {
-        children?: import("react").ReactNode;
+        children?: import("react").ReactNode | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
     ListHeader: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLSpanElement> & import("react").RefAttributes<HTMLSpanElement>>;
     BackButton: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLButtonElement> & {
-        current?: boolean | undefined;
+        current?: boolean;
     } & import("react").RefAttributes<HTMLButtonElement>>;
     NoOptionsHeading: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<HTMLDivElement>, "children"> & {
-        text?: string | undefined;
+        text?: string;
     } & import("react").RefAttributes<HTMLDivElement>>;
     ErrorHeading: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<HTMLDivElement>, "children"> & {
-        text?: string | undefined;
+        text?: string;
     } & import("react").RefAttributes<HTMLDivElement>>;
     InfoHeading: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<HTMLDivElement>, "children"> & {
-        text?: string | undefined;
+        text?: string;
     } & import("react").RefAttributes<HTMLDivElement>>;
     LoadingItem: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<HTMLDivElement>, "children"> & {
-        delay?: number | undefined;
+        delay?: number;
     } & import("react").RefAttributes<HTMLDivElement>>;
     ItemIcon: typeof ItemIcon;
     ItemTitle: typeof ItemTitle;

package/dist/types/components/DropdownUI/item-context.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="react" />
 export declare const DropdownItemContextProvider: import("react").Provider<{
-    id?: string | undefined;
+    id?: string;
 }>;
 export declare const useDropdownItemContext: () => {
-    id?: string | undefined;
+    id?: string;
 };

package/dist/types/components/Formula/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SvgIconType } from '../../components/SvgIcon/svg-icon-type';
 interface IFormula {
     children: React.ReactNode;

package/dist/types/components/Input/SearchInput.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { InputProps } from './Input';
 export type SearchInputProps = InputProps;
 export declare const SearchInput: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/IntegrationElements/integration-element-context.d.ts

@@ -2,8 +2,8 @@ import { PropsWithChildren } from 'react';
 import { IntegrationElementLevel } from '@integration-app/sdk';
 export declare function useIntegrationElementContext(): {
     level: IntegrationElementLevel;
-    integrationId?: string | undefined;
-    connectionId?: string | undefined;
+    integrationId?: string;
+    connectionId?: string;
 };
 export declare const IntegrationElementProvider: ({ children, integrationId: integrationIdfromParams, connectionId: connectionIdFromParams, }: PropsWithChildren<{
     integrationId?: string;

package/dist/types/components/Integrations/IntegrationAvatar/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Integration } from '@integration-app/sdk';
 type HTMLDivProps = React.HTMLAttributes<HTMLDivElement>;
 export declare const IntegrationAvatar: React.FC<{

package/dist/types/components/Integrations/IntegrationItem/index.d.ts

@@ -4,5 +4,5 @@ import { StrictAsChild } from '../../../utils/types';
 type HTMLButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
 export declare const IntegrationItem: React.ForwardRefExoticComponent<({
     integration: Integration;
-} & HTMLButtonProps & StrictAsChild<HTMLButtonElement>) & React.RefAttributes<HTMLButtonElement>>;
+} & (HTMLButtonProps & StrictAsChild<HTMLButtonElement>)) & React.RefAttributes<HTMLButtonElement>>;
 export {};

package/dist/types/components/Popover/index.d.ts

@@ -12,14 +12,14 @@ export type PopperProps = PropsWithChildren<{
     onClickOutside?: () => void;
 }>;
 export declare const DefaultPopper: React.ForwardRefExoticComponent<{
-    refElement?: PopperRefElementType | undefined;
-    isOpen?: boolean | undefined;
-    onClick?: (() => void) | undefined;
-    className?: string | undefined;
-    placement?: NonNullable<Popover.RootProps['positioning']>['placement'];
+    refElement?: PopperRefElementType;
+    isOpen?: boolean;
+    onClick?: () => void;
+    className?: string;
+    placement?: NonNullable<Popover.RootProps["positioning"]>["placement"];
     triggerNode?: React.ReactNode;
-    offset?: [number, number] | undefined;
-    onClickOutside?: (() => void) | undefined;
+    offset?: [number, number];
+    onClickOutside?: () => void;
 } & {
-    children?: React.ReactNode;
+    children?: React.ReactNode | undefined;
 } & React.RefAttributes<HTMLDivElement>>;

package/dist/types/components/SimpleInput/SimpleRadio.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare function SimpleRadio({ label, checked, onCheck, }: {
     label: string | JSX.Element;
     checked: boolean;

package/dist/types/components/Toggle/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SwitchProps } from '@headlessui/react';
 type GenericToggleProps = SwitchProps<'button'> & {
     checked: boolean;

package/dist/types/helpers/hooks/keyboard-events.d.ts

@@ -9,7 +9,7 @@ export declare enum EVENT_TYPE {
 }
 type ScopedComboboxId = string;
 type CallbackFunctionType = (scopedComboboxId: ScopedComboboxId) => void;
-export declare function useOptionListKeyNavDispatch(ref: HTMLElement | MutableRefObject<HTMLElement> | null | undefined, scopedComboboxId: string): void;
+export declare function useOptionListKeyNavDispatch(ref: (HTMLElement | MutableRefObject<HTMLElement> | null) | undefined, scopedComboboxId: string): void;
 export declare function useKeyboardEventSubscribe({ scopedComboboxId: scopedComboboxId, event, callback, }: {
     scopedComboboxId: string;
     event: EVENT_TYPE;

package/dist/types/helpers/hooks/useForwardedRef.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function useForwardedRef<T>(ref: any): import("react").RefObject<T>;

package/dist/types/hooks/data-links/useDataLinkTableInstance.d.ts

@@ -11,7 +11,7 @@ export declare function useDataLinkTableInstance(selector: string | DataLinkTabl
     dataLinkTableInstance: DataLinkTableInstance | undefined;
     accessor: DataLinkTableInstanceAccessor | undefined;
     refresh: () => Promise<DataLinkTableInstance>;
-    findLinks: ((query?: import("@integration-app/sdk").FindDataLinksInTableQuery | undefined) => Promise<import("@integration-app/sdk").FindDataLinksResponse>) | undefined;
+    findLinks: ((query?: import("@integration-app/sdk").FindDataLinksInTableQuery) => Promise<import("@integration-app/sdk").FindDataLinksResponse>) | undefined;
     createLink: ((data: import("@integration-app/sdk").CreateDataLinkRequest) => Promise<void>) | undefined;
     deleteLink: ((data: import("@integration-app/sdk").DeleteDataLinkRequest) => Promise<void>) | undefined;
 };

package/dist/types/hooks/flows/useFlowInstance.d.ts

@@ -1,4 +1,4 @@
-import { FlowInstance, FlowInstanceAccessor, FlowInstanceSelector, OpenFlowInstanceConfigurationOptions, ResetFlowInstanceOptions, RunFlowOptions } from '@integration-app/sdk';
+import { FlowInstance, FlowInstanceAccessor, FlowInstanceSelector, OpenFlowInstanceConfigurationOptions, OpenFlowInstanceEditorOptions, ResetFlowInstanceOptions, RunFlowOptions } from '@integration-app/sdk';
 export declare function useFlowInstance(selector: string | FlowInstanceSelector | undefined): {
     loading: boolean;
     saving: boolean;
@@ -24,8 +24,13 @@ export declare function useFlowInstance(selector: string | FlowInstanceSelector
                 name?: string | undefined;
                 filter?: any;
             }[] | undefined;
+            isCustomized?: boolean | undefined;
         }> | undefined;
         enabled?: boolean | undefined;
+        customized?: {
+            name?: boolean | undefined;
+            nodes?: boolean | undefined;
+        } | undefined;
     }) => Promise<FlowInstance | undefined>;
     patch: (data: Partial<{
         name?: string | undefined;
@@ -45,11 +50,11 @@ export declare function useFlowInstance(selector: string | FlowInstanceSelector
             isCustomized?: boolean | undefined;
         }> | undefined;
         enabled?: boolean | undefined;
-        archivedAt?: string | undefined;
         customized?: {
             name?: boolean | undefined;
             nodes?: boolean | undefined;
         } | undefined;
+        archivedAt?: string | undefined;
     }>) => Promise<void>;
     put: (data: {
         name?: string | undefined;
@@ -69,11 +74,11 @@ export declare function useFlowInstance(selector: string | FlowInstanceSelector
             isCustomized?: boolean | undefined;
         }> | undefined;
         enabled?: boolean | undefined;
-        archivedAt?: string | undefined;
         customized?: {
             name?: boolean | undefined;
             nodes?: boolean | undefined;
         } | undefined;
+        archivedAt?: string | undefined;
     }) => Promise<void>;
     archive: () => Promise<void>;
     flowInstance: FlowInstance | undefined;
@@ -84,6 +89,7 @@ export declare function useFlowInstance(selector: string | FlowInstanceSelector
     reset: (options?: ResetFlowInstanceOptions) => Promise<void>;
     setup: () => Promise<void>;
     openConfiguration: (options: OpenFlowInstanceConfigurationOptions) => Promise<void | undefined>;
+    openEditor: (options?: OpenFlowInstanceEditorOptions) => Promise<void | undefined>;
     run: (options?: RunFlowOptions) => Promise<import("@integration-app/sdk").FlowRun | undefined>;
     startRun: (options?: RunFlowOptions) => Promise<import("@integration-app/sdk").FlowRun | undefined>;
 };

package/dist/types/styled-system/types/composition.d.ts

@@ -132,7 +132,33 @@ export type LayerStyle = CompositionStyleObject<LayerStyleProperty>
 
 export type LayerStyles = Recursive<Token<LayerStyle>>
 
+/* -----------------------------------------------------------------------------
+ * Motion styles
+ * -----------------------------------------------------------------------------*/
+
+type AnimationStyleProperty =
+  | 'animation'
+  | 'animationComposition'
+  | 'animationDelay'
+  | 'animationDirection'
+  | 'animationDuration'
+  | 'animationFillMode'
+  | 'animationIterationCount'
+  | 'animationName'
+  | 'animationPlayState'
+  | 'animationTimingFunction'
+  | 'animationRange'
+  | 'animationRangeStart'
+  | 'animationRangeEnd'
+  | 'animationTimeline'
+  | 'transformOrigin'
+
+export type AnimationStyle = CompositionStyleObject<AnimationStyleProperty>
+
+export type AnimationStyles = Recursive<Token<AnimationStyle>>
+
 export interface CompositionStyles {
   textStyles: TextStyles
   layerStyles: LayerStyles
+  animationStyles: AnimationStyles
 }

package/dist/types/styled-system/types/conditions.d.ts

@@ -32,6 +32,12 @@ export interface Conditions {
 	"_expanded": string
 	/** `&[data-highlighted]` */
 	"_highlighted": string
+	/** `&[data-complete]` */
+	"_complete": string
+	/** `&[data-incomplete]` */
+	"_incomplete": string
+	/** `&[data-dragging]` */
+	"_dragging": string
 	/** `&::before` */
 	"_before": string
 	/** `&::after` */
@@ -112,9 +118,9 @@ export interface Conditions {
 	"_invalid": string
 	/** `&:autofill` */
 	"_autofill": string
-	/** `&:in-range` */
+	/** `&:is(:in-range, [data-in-range])` */
 	"_inRange": string
-	/** `&:out-of-range` */
+	/** `&:is(:out-of-range, [data-outside-range])` */
 	"_outOfRange": string
 	/** `&::placeholder, &[data-placeholder]` */
 	"_placeholder": string
@@ -124,6 +130,14 @@ export interface Conditions {
 	"_pressed": string
 	/** `&:is([aria-selected=true], [data-selected])` */
 	"_selected": string
+	/** `&:is([aria-grabbed=true], [data-grabbed])` */
+	"_grabbed": string
+	/** `&:is([data-state="under-value"])` */
+	"_underValue": string
+	/** `&[data-state=over-value]` */
+	"_overValue": string
+	/** `&[data-state=at-value]` */
+	"_atValue": string
 	/** `&:default` */
 	"_default": string
 	/** `&:optional` */
@@ -132,14 +146,30 @@ export interface Conditions {
 	"_open": string
 	/** `&:is([closed], [data-closed], [data-state="closed"])` */
 	"_closed": string
-	/** `&:fullscreen` */
+	/** `&is(:fullscreen, [data-fullscreen])` */
 	"_fullscreen": string
 	/** `&:is([data-loading], [aria-busy=true])` */
 	"_loading": string
+	/** `&:is([hidden])` */
+	"_hidden": string
+	/** `&:is([data-current])` */
+	"_current": string
 	/** `&[aria-current=page]` */
 	"_currentPage": string
 	/** `&[aria-current=step]` */
 	"_currentStep": string
+	/** `&:is([data-today])` */
+	"_today": string
+	/** `&[data-unavailable]` */
+	"_unavailable": string
+	/** `&[data-range-start]` */
+	"_rangeStart": string
+	/** `&[data-range-end]` */
+	"_rangeEnd": string
+	/** `&[data-now]` */
+	"_now": string
+	/** `&[data-topmost]` */
+	"_topmost": string
 	/** `@media (prefers-reduced-motion: reduce)` */
 	"_motionReduce": string
 	/** `@media (prefers-reduced-motion: no-preference)` */
@@ -178,22 +208,16 @@ export interface Conditions {
 	"_horizontal": string
 	/** `&[data-orientation=vertical]` */
 	"_vertical": string
+	/** `& :where(svg)` */
+	"_icon": string
 	/** `@starting-style` */
 	"_starting": string
 	/** `&:is([aria-collapsed=true], [data-collapsed], [data-state="collapsed"])` */
 	"_collapsed": string
-	/** `&:is([data-current])` */
-	"_current": string
-	/** `&:is([hidden])` */
-	"_hidden": string
 	/** `&:is([data-state="off"])` */
 	"_off": string
 	/** `&:is([data-state="on"])` */
 	"_on": string
-	/** `&:is([data-today])` */
-	"_today": string
-	/** `&:is([data-state="under-value"])` */
-	"_underValue": string
 	/** `@media screen and (min-width: 40rem)` */
 	"sm": string
 	/** `@media screen and (min-width: 40rem) and (max-width: 47.9975rem)` */

package/dist/types/styled-system/types/global.d.ts

@@ -13,6 +13,7 @@ declare module '@pandacss/dev' {
   export function defineStyles(definition: SystemStyleObject): SystemStyleObject
   export function defineGlobalStyles(definition: GlobalStyleObject): Panda.GlobalStyleObject
   export function defineTextStyles(definition: CompositionStyles['textStyles']): Panda.TextStyles
+  export function defineAnimationStyles(definition: CompositionStyles['animationStyles']): Panda.AnimationStyles
   export function defineLayerStyles(definition: CompositionStyles['layerStyles']): Panda.LayerStyles
   export function definePattern<T extends PatternProperties>(config: PatternConfig<T>): Panda.PatternConfig
   export function defineParts<T extends Parts>(parts: T): (config: Partial<Record<keyof T, SystemStyleObject>>) => Partial<Record<keyof T, SystemStyleObject>>

package/dist/types/styled-system/types/prop-type.d.ts

@@ -159,7 +159,6 @@ export interface UtilityValues {
 	caretColor: Tokens["colors"];
 	scrollbar: "visible" | "hidden";
 	scrollbarColor: Tokens["colors"];
-	scrollbarGutter: Tokens["spacing"];
 	scrollbarWidth: Tokens["sizes"];
 	scrollMargin: Tokens["spacing"];
 	scrollMarginLeft: Tokens["spacing"];