@app-studio/web 0.9.11 → 0.9.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import { ChatInputProps } from '../ChatInput/ChatInput/ChatInput.props';
3
+ interface FormikChatInputProps extends Omit<ChatInputProps, 'value' | 'onChange' | 'onSubmit' | 'getPendingFiles' | 'clearPendingFiles'> {
4
+ name: string;
5
+ onSubmit?: (message: string, options?: any) => void;
6
+ }
7
+ /**
8
+ * ChatInput is a component used to create a chat input field with file upload support,
9
+ * auto-completion, mentions, and other advanced features, integrated with Formik.
10
+ */
11
+ export declare const FormikChatInput: React.FC<FormikChatInputProps>;
12
+ export {};
@@ -4,4 +4,6 @@ import { TagInputProps } from '../Form/TagInput/TagInput/TagInput.props';
4
4
  * TagInput allows users to add and manage a list of tags.
5
5
  * Integrated with Formik for form validation and state management.
6
6
  */
7
- export declare const FormikTagInput: React.FC<TagInputProps>;
7
+ export declare const FormikTagInput: React.FC<TagInputProps & {
8
+ name: string;
9
+ }>;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ export declare const FormikChatInputExample: () => React.JSX.Element;
3
+ export declare const FormikChatInputSimpleExample: () => React.JSX.Element;
@@ -1,4 +1,5 @@
1
1
  export * from './FormikCheckbox';
2
+ export * from './FormikChatInput';
2
3
  export * from './FormikColorInput';
3
4
  export * from './FormikComboBox';
4
5
  export * from './FormikCountryPicker';
@@ -1,9 +1,11 @@
1
1
  export { FormikCheckbox } from './Formik.Checkbox';
2
+ export { FormikChatInput } from './Formik.ChatInput';
2
3
  export { FormikColorInput } from './Formik.ColorInput';
3
4
  export { FormikDatePicker } from './Formik.DatePicker';
4
5
  export { FormikCountryPicker } from './Formik.CountryPicker';
5
6
  export { FormikSelect } from './Formik.Select';
6
7
  export { FormikSwitch } from './Formik.Switch';
8
+ export { FormikTagInput } from './Formik.TagInput';
7
9
  export { FormikTextArea } from './Formik.TextArea';
8
10
  export { FormikTextField } from './Formik.TextField';
9
11
  export { FormikPassword } from './Formik.Password';
@@ -61,11 +61,27 @@ export interface TitleProps extends ViewProps {
61
61
  * This should be an animation object with properties like from, to, duration, etc.
62
62
  */
63
63
  animate?: AnimationProps | AnimationProps[];
64
+ /**
65
+ * Controls the animation loop behavior for the title animation
66
+ * @default '1' (play once)
67
+ */
68
+ animationLoop?: number | 'infinite';
69
+ /**
70
+ * Controls the animation loop behavior for the highlight animation
71
+ * @default '1' (play once)
72
+ */
73
+ highlightAnimationLoop?: number | 'infinite';
64
74
  /**
65
75
  * Size of the title
66
76
  * @default 'xl'
67
77
  */
68
78
  size?: TitleSize;
79
+ /**
80
+ * Whether to enable responsive sizing based on breakpoints
81
+ * When true, the title will automatically adapt its size across mobile/tablet/desktop
82
+ * @default false
83
+ */
84
+ responsive?: boolean;
69
85
  /**
70
86
  * Whether to center the title
71
87
  * @default false
@@ -14,6 +14,33 @@ export declare const TitleSizes: {
14
14
  * Line heights for different title sizes
15
15
  */
16
16
  export declare const LineHeights: Record<TitleSize, number>;
17
+ /**
18
+ * Responsive typography system that maps title sizes to responsive breakpoints
19
+ * Based on the Typography system with dynamic breakpoint sizing
20
+ */
21
+ export declare const ResponsiveTypography: Record<TitleSize, {
22
+ lineHeight: string;
23
+ fontWeight: number;
24
+ marginBottom?: number;
25
+ letterSpacing?: number;
26
+ media: {
27
+ mobile: {
28
+ fontSize: number;
29
+ width?: string;
30
+ minWidth?: string;
31
+ };
32
+ tablet: {
33
+ fontSize: number;
34
+ width?: string;
35
+ minWidth?: string;
36
+ };
37
+ desktop: {
38
+ fontSize: number;
39
+ width?: string;
40
+ minWidth?: string;
41
+ };
42
+ };
43
+ }>;
17
44
  /**
18
45
  * Default styles for different highlight types
19
46
  */
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ /**
3
+ * Examples of Title with different animation loop controls
4
+ */
5
+ export declare const AnimationLoopTitle: () => React.JSX.Element;
@@ -1,6 +1,7 @@
1
1
  export * from './default';
2
2
  export * from './highlighted';
3
3
  export * from './animated';
4
+ export * from './animationLoop';
4
5
  export * from './hero';
5
6
  export * from './responsive';
6
7
  export * from './custom';
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  /**
3
- * Example of responsive Title using media queries
3
+ * Example of responsive Title using the new responsive prop
4
4
  */
5
5
  export declare const ResponsiveTitle: () => React.JSX.Element;
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ /**
3
+ * Demo page showcasing the responsive Title component functionality
4
+ */
5
+ export declare const ResponsiveTitleDemoPage: () => React.JSX.Element;
6
+ export default ResponsiveTitleDemoPage;