@ibti-tech/chatbot 0.5.7 → 0.6.0
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.
- package/README.md +39 -0
- package/dist/index.d.ts +59 -15
- package/dist/index.mjs +349 -55
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -79,6 +79,45 @@ Main component that displays the chatbot bar with toggle button and conversation
|
|
|
79
79
|
|------|------|----------|-------------|
|
|
80
80
|
| `verticalPosition` | `'top' \| 'bottom'` | ❌ | Vertical position of the chatbot. Default: `'bottom'` |
|
|
81
81
|
| `horizontalPosition` | `'left' \| 'right'` | ❌ | Horizontal position of the chatbot. Default: `'right'` |
|
|
82
|
+
| `zIndex` | `number` | ❌ | Custom z-index value. If not provided, uses theme.zIndex.modals. Useful when you need the chatbot to appear above specific elements like headers |
|
|
83
|
+
| `topOffset` | `string \| number` | ❌ | Offset from the top when verticalPosition is 'top'. Can be a number (in pixels) or a string (e.g., '100px', '10rem'). Useful to position the chatbot below a fixed header |
|
|
84
|
+
| `aboveHeader` | `boolean` | ❌ | Convenient prop to position the chatbot above header elements. When true, sets z-index to 9999 and allows topOffset configuration. Default: `false` |
|
|
85
|
+
| `pushContentDown` | `boolean` | ❌ | When true and verticalPosition is 'top', the chatbot will push content down instead of overlaying it. The chatbot will occupy space in the document flow. When false, the chatbot will be fixed and overlay the content. Default: `false` |
|
|
86
|
+
|
|
87
|
+
#### Examples
|
|
88
|
+
|
|
89
|
+
**Positioning above header elements:**
|
|
90
|
+
|
|
91
|
+
```jsx
|
|
92
|
+
// Option 1: Using aboveHeader prop (recommended)
|
|
93
|
+
<ChatbotBar
|
|
94
|
+
verticalPosition="top"
|
|
95
|
+
aboveHeader={true}
|
|
96
|
+
topOffset={120} // Adjust based on your header height
|
|
97
|
+
/>
|
|
98
|
+
|
|
99
|
+
// Option 2: Using custom zIndex
|
|
100
|
+
<ChatbotBar
|
|
101
|
+
verticalPosition="top"
|
|
102
|
+
zIndex={9999}
|
|
103
|
+
topOffset="120px"
|
|
104
|
+
/>
|
|
105
|
+
|
|
106
|
+
// Option 3: Using CSS units for topOffset
|
|
107
|
+
<ChatbotBar
|
|
108
|
+
verticalPosition="top"
|
|
109
|
+
aboveHeader={true}
|
|
110
|
+
topOffset="8rem" // Using rem units for better scalability
|
|
111
|
+
/>
|
|
112
|
+
|
|
113
|
+
// Option 4: Push content down instead of overlaying (only works with verticalPosition="top")
|
|
114
|
+
<ChatbotBar
|
|
115
|
+
verticalPosition="top"
|
|
116
|
+
pushContentDown={true}
|
|
117
|
+
/>
|
|
118
|
+
```
|
|
119
|
+
|
|
120
|
+
**Note:** The component maintains full responsiveness even with custom positioning. The `topOffset` prop accepts both numbers (pixels) and strings (any valid CSS unit). The `pushContentDown` prop only works when `verticalPosition` is `'top'` and makes the chatbot reserve space in the document flow instead of overlaying content.
|
|
82
121
|
|
|
83
122
|
### `ChatbotDevice`
|
|
84
123
|
|
package/dist/index.d.ts
CHANGED
|
@@ -37,19 +37,48 @@ declare module '@ibti-tech/chatbot/components/ChatUserFeedbackRating/styles' {
|
|
|
37
37
|
//# sourceMappingURL=styles.d.ts.map
|
|
38
38
|
}
|
|
39
39
|
declare module '@ibti-tech/chatbot/components/ChatUserFeedbackRating/styles.d.ts' {
|
|
40
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatUserFeedbackRating/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa,6NAWzB,CAAA;AAED,eAAO,MAAM,IAAI,
|
|
40
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatUserFeedbackRating/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa,6NAWzB,CAAA;AAED,eAAO,MAAM,IAAI,mOAkDhB,CAAA;AAED,eAAO,MAAM,WAAW,6NAKvB,CAAA;AAED,eAAO,MAAM,KAAK,+NAKjB,CAAA;AAED,eAAO,MAAM,GAAG;;;;;;;wRAef,CAAA;AAED,eAAO,MAAM,OAAO;aAAyB,OAAO;YA4BnD,CAAA"}
|
|
41
41
|
}
|
|
42
42
|
declare module '@ibti-tech/chatbot/components/ChatbotBar/index' {
|
|
43
43
|
import React from 'react';
|
|
44
44
|
export type ChatbotBarProps = {
|
|
45
45
|
verticalPosition?: 'top' | 'bottom';
|
|
46
46
|
horizontalPosition?: 'left' | 'right';
|
|
47
|
+
/**
|
|
48
|
+
* Horizontal position of the ChatbotDevice on desktop.
|
|
49
|
+
* Can be a predefined value ('left', 'right', 'center') or a custom value with any unit (e.g., '20px', '10%', '2rem', 'calc(100% - 200px)').
|
|
50
|
+
* When using a custom value, it will be applied as the 'left' property.
|
|
51
|
+
* If not provided, the device will use the parent container's positioning.
|
|
52
|
+
*/
|
|
53
|
+
deviceHorizontalPosition?: 'left' | 'right' | 'center' | string;
|
|
54
|
+
/**
|
|
55
|
+
* Custom z-index value. If not provided, uses theme.zIndex.modals
|
|
56
|
+
* Useful when you need the chatbot to appear above specific elements like headers
|
|
57
|
+
*/
|
|
58
|
+
zIndex?: number;
|
|
59
|
+
/**
|
|
60
|
+
* Offset from the top when verticalPosition is 'top'
|
|
61
|
+
* Can be a number (in pixels) or a string (e.g., '100px', '10rem')
|
|
62
|
+
* Useful to position the chatbot below a fixed header
|
|
63
|
+
*/
|
|
64
|
+
topOffset?: string | number;
|
|
65
|
+
/**
|
|
66
|
+
* Convenient prop to position the chatbot above header elements
|
|
67
|
+
* When true, sets z-index to 9999 and allows topOffset configuration
|
|
68
|
+
*/
|
|
69
|
+
aboveHeader?: boolean;
|
|
70
|
+
/**
|
|
71
|
+
* When true and verticalPosition is 'top', the chatbot will push content down
|
|
72
|
+
* instead of overlaying it. The chatbot will occupy space in the document flow.
|
|
73
|
+
* When false, the chatbot will be fixed and overlay the content.
|
|
74
|
+
*/
|
|
75
|
+
pushContentDown?: boolean;
|
|
47
76
|
};
|
|
48
|
-
export const ChatbotBar: ({ verticalPosition, horizontalPosition, }: ChatbotBarProps) => React.JSX.Element;
|
|
77
|
+
export const ChatbotBar: ({ verticalPosition, horizontalPosition, deviceHorizontalPosition, zIndex, topOffset, aboveHeader, pushContentDown, }: ChatbotBarProps) => React.JSX.Element;
|
|
49
78
|
//# sourceMappingURL=index.d.ts.map
|
|
50
79
|
}
|
|
51
80
|
declare module '@ibti-tech/chatbot/components/ChatbotBar/index.d.ts' {
|
|
52
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotBar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,MAAM,MAAM,eAAe,GAAG;IAC5B,gBAAgB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IACnC,kBAAkB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;
|
|
81
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotBar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,MAAM,MAAM,eAAe,GAAG;IAC5B,gBAAgB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IACnC,kBAAkB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACrC;;;;;OAKG;IACH,wBAAwB,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAA;IAC/D;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,UAAU,GAAI,sHAQxB,eAAe,sBA8BjB,CAAA"}
|
|
53
82
|
}
|
|
54
83
|
declare module '@ibti-tech/chatbot/components/ChatbotBar/styles' {
|
|
55
84
|
import { breakpoints } from '@ibti-tech/ui';
|
|
@@ -60,16 +89,21 @@ declare module '@ibti-tech/chatbot/components/ChatbotBar/styles' {
|
|
|
60
89
|
$horizontalPosition: "left" | "right";
|
|
61
90
|
$opened: boolean;
|
|
62
91
|
$verticalPosition: "top" | "bottom";
|
|
92
|
+
$pushContentDown?: boolean;
|
|
63
93
|
}>> & string & Omit<({ children, className, style, variant, }: import("@ibti-tech/ui").ContainerProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
|
|
64
94
|
export const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
65
95
|
$verticalPosition: "top" | "bottom";
|
|
66
96
|
$horizontalPosition: "left" | "right";
|
|
67
97
|
$opened: boolean;
|
|
98
|
+
$zIndex?: number;
|
|
99
|
+
$topOffset?: string | number;
|
|
100
|
+
$aboveHeader?: boolean;
|
|
101
|
+
$pushContentDown?: boolean;
|
|
68
102
|
}>> & string;
|
|
69
103
|
//# sourceMappingURL=styles.d.ts.map
|
|
70
104
|
}
|
|
71
105
|
declare module '@ibti-tech/chatbot/components/ChatbotBar/styles.d.ts' {
|
|
72
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotBar/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAW,MAAM,eAAe,CAAA;AAIpD,eAAO,MAAM,YAAY;;oBAGH,kBACnB;;yBAHoB,MAAM,GAAG,OAAO;aAC5B,OAAO;uBACG,KAAK,GAAG,QAAQ;
|
|
106
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotBar/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAW,MAAM,eAAe,CAAA;AAIpD,eAAO,MAAM,YAAY;;oBAGH,kBACnB;;yBAHoB,MAAM,GAAG,OAAO;aAC5B,OAAO;uBACG,KAAK,GAAG,QAAQ;uBAChB,OAAO;iMAmC3B,CAAA;AAED,eAAO,MAAM,OAAO;uBACC,KAAK,GAAG,QAAQ;yBACd,MAAM,GAAG,OAAO;aAC5B,OAAO;cACN,MAAM;iBACH,MAAM,GAAG,MAAM;mBACb,OAAO;uBACH,OAAO;YAqG3B,CAAA"}
|
|
73
107
|
}
|
|
74
108
|
declare module '@ibti-tech/chatbot/components/ChatbotBody/index' {
|
|
75
109
|
import React from 'react';
|
|
@@ -88,29 +122,39 @@ declare module '@ibti-tech/chatbot/components/ChatbotBody/styles' {
|
|
|
88
122
|
//# sourceMappingURL=styles.d.ts.map
|
|
89
123
|
}
|
|
90
124
|
declare module '@ibti-tech/chatbot/components/ChatbotBody/styles.d.ts' {
|
|
91
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotBody/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY,6NAAe,CAAA;AAExC,eAAO,MAAM,YAAY,iOAQxB,CAAA;AAED,eAAO,MAAM,OAAO,
|
|
125
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotBody/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY,6NAAe,CAAA;AAExC,eAAO,MAAM,YAAY,iOAQxB,CAAA;AAED,eAAO,MAAM,OAAO,6NAsCnB,CAAA"}
|
|
92
126
|
}
|
|
93
127
|
declare module '@ibti-tech/chatbot/components/ChatbotDevice/index' {
|
|
94
128
|
import React from 'react';
|
|
95
129
|
export type ChatbotDeviceProps = {
|
|
96
130
|
verticalPosition?: 'top' | 'bottom';
|
|
131
|
+
pushContentDown?: boolean;
|
|
132
|
+
/**
|
|
133
|
+
* Horizontal position on desktop.
|
|
134
|
+
* Can be a predefined value ('left', 'right', 'center') or a custom value with any unit (e.g., '20px', '10%', '2rem', 'calc(100% - 200px)').
|
|
135
|
+
* When using a custom value, it will be applied as the 'left' property.
|
|
136
|
+
* Default: undefined (uses parent container positioning)
|
|
137
|
+
*/
|
|
138
|
+
horizontalPosition?: 'left' | 'right' | 'center' | string;
|
|
97
139
|
};
|
|
98
|
-
export const ChatbotDevice: ({ verticalPosition, }: ChatbotDeviceProps) => React.JSX.Element;
|
|
140
|
+
export const ChatbotDevice: ({ verticalPosition, pushContentDown, horizontalPosition, }: ChatbotDeviceProps) => React.JSX.Element;
|
|
99
141
|
export default ChatbotDevice;
|
|
100
142
|
//# sourceMappingURL=index.d.ts.map
|
|
101
143
|
}
|
|
102
144
|
declare module '@ibti-tech/chatbot/components/ChatbotDevice/index.d.ts' {
|
|
103
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotDevice/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAUzB,MAAM,MAAM,kBAAkB,GAAG;IAC/B,gBAAgB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;
|
|
145
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotDevice/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAUzB,MAAM,MAAM,kBAAkB,GAAG;IAC/B,gBAAgB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IACnC,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB;;;;;OAKG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAA;CAC1D,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,4DAI3B,kBAAkB,sBAkBpB,CAAA;AAED,eAAe,aAAa,CAAA"}
|
|
104
146
|
}
|
|
105
147
|
declare module '@ibti-tech/chatbot/components/ChatbotDevice/styles' {
|
|
106
148
|
export const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
107
149
|
$opened: boolean;
|
|
108
150
|
$verticalPosition: "top" | "bottom";
|
|
151
|
+
$pushContentDown?: boolean;
|
|
152
|
+
$horizontalPosition?: "left" | "right" | "center" | string;
|
|
109
153
|
}>> & string;
|
|
110
154
|
//# sourceMappingURL=styles.d.ts.map
|
|
111
155
|
}
|
|
112
156
|
declare module '@ibti-tech/chatbot/components/ChatbotDevice/styles.d.ts' {
|
|
113
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotDevice/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO;aACT,OAAO;uBACG,KAAK,GAAG,QAAQ;
|
|
157
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotDevice/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO;aACT,OAAO;uBACG,KAAK,GAAG,QAAQ;uBAChB,OAAO;0BACJ,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM;YAqK3D,CAAA"}
|
|
114
158
|
}
|
|
115
159
|
declare module '@ibti-tech/chatbot/components/ChatbotFooter/index' {
|
|
116
160
|
import React from 'react';
|
|
@@ -129,7 +173,7 @@ declare module '@ibti-tech/chatbot/components/ChatbotFooter/styles' {
|
|
|
129
173
|
//# sourceMappingURL=styles.d.ts.map
|
|
130
174
|
}
|
|
131
175
|
declare module '@ibti-tech/chatbot/components/ChatbotFooter/styles.d.ts' {
|
|
132
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotFooter/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,yBAAyB,+
|
|
176
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotFooter/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,yBAAyB,+NAQrC,CAAA;AAED,eAAO,MAAM,IAAI,mOA+EhB,CAAA;AAED,eAAO,MAAM,OAAO,6NAYnB,CAAA"}
|
|
133
177
|
}
|
|
134
178
|
declare module '@ibti-tech/chatbot/components/ChatbotHeader/index' {
|
|
135
179
|
import React from 'react';
|
|
@@ -152,7 +196,7 @@ declare module '@ibti-tech/chatbot/components/ChatbotHeader/styles' {
|
|
|
152
196
|
//# sourceMappingURL=styles.d.ts.map
|
|
153
197
|
}
|
|
154
198
|
declare module '@ibti-tech/chatbot/components/ChatbotHeader/styles.d.ts' {
|
|
155
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotHeader/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,+NAGhB,CAAA;AAED,eAAO,MAAM,WAAW,6NAIvB,CAAA;AAED,eAAO,MAAM,YAAY,+NAaxB,CAAA;AAED,eAAO,MAAM,OAAO,
|
|
199
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotHeader/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,+NAGhB,CAAA;AAED,eAAO,MAAM,WAAW,6NAIvB,CAAA;AAED,eAAO,MAAM,YAAY,+NAaxB,CAAA;AAED,eAAO,MAAM,OAAO,6NAgBnB,CAAA"}
|
|
156
200
|
}
|
|
157
201
|
declare module '@ibti-tech/chatbot/components/ChatbotStatusLabel/index' {
|
|
158
202
|
import React from 'react';
|
|
@@ -171,7 +215,7 @@ declare module '@ibti-tech/chatbot/components/ChatbotStatusLabel/styles' {
|
|
|
171
215
|
//# sourceMappingURL=styles.d.ts.map
|
|
172
216
|
}
|
|
173
217
|
declare module '@ibti-tech/chatbot/components/ChatbotStatusLabel/styles.d.ts' {
|
|
174
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotStatusLabel/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,OAAO;kBAA+B,MAAM;
|
|
218
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotStatusLabel/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,OAAO;kBAA+B,MAAM;YAoBxD,CAAA"}
|
|
175
219
|
}
|
|
176
220
|
declare module '@ibti-tech/chatbot/components/ChatbotToggle/index' {
|
|
177
221
|
import React from 'react';
|
|
@@ -194,7 +238,7 @@ declare module '@ibti-tech/chatbot/components/ChatbotToggle/styles' {
|
|
|
194
238
|
//# sourceMappingURL=styles.d.ts.map
|
|
195
239
|
}
|
|
196
240
|
declare module '@ibti-tech/chatbot/components/ChatbotToggle/styles.d.ts' {
|
|
197
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotToggle/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa;aACf,OAAO;uBACG,KAAK,GAAG,QAAQ;
|
|
241
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/ChatbotToggle/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa;aACf,OAAO;uBACG,KAAK,GAAG,QAAQ;YAmDpC,CAAA"}
|
|
198
242
|
}
|
|
199
243
|
declare module '@ibti-tech/chatbot/components/MessageBalloon/index' {
|
|
200
244
|
import React from 'react';
|
|
@@ -244,7 +288,7 @@ declare module '@ibti-tech/chatbot/components/MessageBalloon/styles' {
|
|
|
244
288
|
//# sourceMappingURL=styles.d.ts.map
|
|
245
289
|
}
|
|
246
290
|
declare module '@ibti-tech/chatbot/components/MessageBalloon/styles.d.ts' {
|
|
247
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/MessageBalloon/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,IAAI;WAAwB,UAAU,GAAG,MAAM;
|
|
291
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/MessageBalloon/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,IAAI;WAAwB,UAAU,GAAG,MAAM;YAoB3D,CAAA;AAED,eAAO,MAAM,OAAO;WACX,UAAU,GAAG,MAAM;aACjB,OAAO;YAqKjB,CAAA;AAED,eAAO,MAAM,KAAK,+NAKjB,CAAA;AAED,eAAO,MAAM,wBAAwB;WAAuB,UAAU,GAAG,MAAM;YAiB9E,CAAA;AAED,eAAO,MAAM,gBAAgB;WAAuB,UAAU,GAAG,MAAM;YAmBtE,CAAA;AAED,eAAO,MAAM,sBAAsB;WAAuB,UAAU,GAAG,MAAM;YAqB5E,CAAA;AAED,eAAO,MAAM,gBAAgB;WAAuB,UAAU,GAAG,MAAM;gBAAc,OAAO;YAoC3F,CAAA;AAED,eAAO,MAAM,YAAY;kBAAiC,UAAU,GAAG,MAAM;YA2B5E,CAAA;AAED,eAAO,MAAM,OAAO;kBAA+B,UAAU,GAAG,MAAM;YAgBrE,CAAA;AAED,eAAO,MAAM,OAAO;WAAuB,UAAU,GAAG,MAAM;YAkB7D,CAAA"}
|
|
248
292
|
}
|
|
249
293
|
declare module '@ibti-tech/chatbot/components/SuggestedQuestions/index' {
|
|
250
294
|
import React from 'react';
|
|
@@ -265,7 +309,7 @@ declare module '@ibti-tech/chatbot/components/SuggestedQuestions/styles' {
|
|
|
265
309
|
//# sourceMappingURL=styles.d.ts.map
|
|
266
310
|
}
|
|
267
311
|
declare module '@ibti-tech/chatbot/components/SuggestedQuestions/styles.d.ts' {
|
|
268
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/SuggestedQuestions/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,cAAc,
|
|
312
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/SuggestedQuestions/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,cAAc,mcAY1B,CAAA;AAED,eAAO,MAAM,gBAAgB,6NAAc,CAAA;AAE3C,eAAO,MAAM,YAAY,iOAIxB,CAAA;AAED,eAAO,MAAM,KAAK,+NAMjB,CAAA;AAED,eAAO,MAAM,OAAO,6NAYnB,CAAA"}
|
|
269
313
|
}
|
|
270
314
|
declare module '@ibti-tech/chatbot/components/WritingIndicator/index' {
|
|
271
315
|
import React from 'react';
|
|
@@ -288,7 +332,7 @@ declare module '@ibti-tech/chatbot/components/WritingIndicator/styles' {
|
|
|
288
332
|
//# sourceMappingURL=styles.d.ts.map
|
|
289
333
|
}
|
|
290
334
|
declare module '@ibti-tech/chatbot/components/WritingIndicator/styles.d.ts' {
|
|
291
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/WritingIndicator/styles.ts"],"names":[],"mappings":"AAiBA,eAAO,MAAM,IAAI,+NAKhB,CAAA;AAED,eAAO,MAAM,GAAG;YAAyB,MAAM;YAO9C,CAAA;AAED,eAAO,MAAM,IAAI,+NAEhB,CAAA;AAED,eAAO,MAAM,OAAO,
|
|
335
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../home/runner/work/ibti-chatbot/ibti-chatbot/src/components/WritingIndicator/styles.ts"],"names":[],"mappings":"AAiBA,eAAO,MAAM,IAAI,+NAKhB,CAAA;AAED,eAAO,MAAM,GAAG;YAAyB,MAAM;YAO9C,CAAA;AAED,eAAO,MAAM,IAAI,+NAEhB,CAAA;AAED,eAAO,MAAM,OAAO,6NAiCnB,CAAA;AAED,eAAO,MAAM,KAAK,+NAIjB,CAAA;AAED,eAAO,MAAM,OAAO,6NAYnB,CAAA"}
|
|
292
336
|
}
|
|
293
337
|
declare module '@ibti-tech/chatbot/contexts/Chatbot/context' {
|
|
294
338
|
import * as React from 'react';
|
package/dist/index.mjs
CHANGED
|
@@ -726,6 +726,7 @@ import React14 from "react";
|
|
|
726
726
|
import { breakpoints, screens } from "@ibti-tech/ui";
|
|
727
727
|
import { css, styled } from "styled-components";
|
|
728
728
|
var Wrapper = styled.div`
|
|
729
|
+
/* Base styles */
|
|
729
730
|
width: 100%;
|
|
730
731
|
background-color: ${(props) => props.theme.colors.layers[1].background};
|
|
731
732
|
border: 1px solid ${(props) => props.theme.colors.layers[1].border};
|
|
@@ -738,39 +739,127 @@ var Wrapper = styled.div`
|
|
|
738
739
|
max-height: calc(100vh - 45px);
|
|
739
740
|
box-sizing: border-box;
|
|
740
741
|
position: relative;
|
|
742
|
+
|
|
743
|
+
/* Typography */
|
|
744
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
745
|
+
font-weight: 600 !important;
|
|
746
|
+
|
|
747
|
+
* {
|
|
748
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
749
|
+
}
|
|
741
750
|
|
|
751
|
+
*:not(b):not(strong):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
752
|
+
font-weight: 600 !important;
|
|
753
|
+
}
|
|
754
|
+
|
|
755
|
+
/* Mobile styles */
|
|
742
756
|
@media screen and (max-width: ${breakpoints.tablet}px) {
|
|
757
|
+
${(props) => props.$opened && props.$verticalPosition === "top" && css`
|
|
758
|
+
max-height: 100vh !important;
|
|
759
|
+
height: 100vh !important;
|
|
760
|
+
`}
|
|
761
|
+
|
|
743
762
|
${(props) => props.$opened && props.$verticalPosition === "bottom" ? css`
|
|
744
763
|
max-height: 100vh;
|
|
745
764
|
` : ""}
|
|
765
|
+
|
|
766
|
+
${(props) => props.$opened && props.$verticalPosition === "top" ? css`
|
|
767
|
+
max-height: 100vh !important;
|
|
768
|
+
height: 100vh !important;
|
|
769
|
+
width: 100% !important;
|
|
770
|
+
transform: none !important;
|
|
771
|
+
position: relative !important;
|
|
772
|
+
` : ""}
|
|
746
773
|
}
|
|
747
774
|
|
|
775
|
+
/* Border radius based on vertical position */
|
|
748
776
|
${(props) => props.$verticalPosition === "top" ? css`
|
|
749
|
-
border-end-end-radius: ${
|
|
750
|
-
border-end-start-radius: ${
|
|
777
|
+
border-end-end-radius: ${props.theme.borderRadius.medium};
|
|
778
|
+
border-end-start-radius: ${props.theme.borderRadius.medium};
|
|
751
779
|
` : css`
|
|
752
|
-
border-start-end-radius: ${
|
|
753
|
-
border-start-start-radius: ${
|
|
780
|
+
border-start-end-radius: ${props.theme.borderRadius.medium};
|
|
781
|
+
border-start-start-radius: ${props.theme.borderRadius.medium};
|
|
754
782
|
`}
|
|
755
783
|
|
|
784
|
+
/* Desktop styles */
|
|
756
785
|
${screens.tablet} {
|
|
757
|
-
|
|
786
|
+
/* Height when closed with pushContentDown vs opened */
|
|
787
|
+
${(props) => props.$pushContentDown && !props.$opened ? css`
|
|
788
|
+
height: 32px !important;
|
|
789
|
+
max-height: 32px !important;
|
|
790
|
+
` : css`
|
|
791
|
+
height: 500px;
|
|
792
|
+
`}
|
|
793
|
+
|
|
758
794
|
max-width: ${breakpoints.mobileL}px;
|
|
795
|
+
|
|
796
|
+
/* Horizontal positioning on desktop */
|
|
797
|
+
${(props) => {
|
|
798
|
+
if (!props.$horizontalPosition) return "";
|
|
799
|
+
if (props.$horizontalPosition === "left") {
|
|
800
|
+
return css`
|
|
801
|
+
margin-left: 0;
|
|
802
|
+
margin-right: auto;
|
|
803
|
+
`;
|
|
804
|
+
}
|
|
805
|
+
if (props.$horizontalPosition === "right") {
|
|
806
|
+
return css`
|
|
807
|
+
margin-left: auto;
|
|
808
|
+
margin-right: 0;
|
|
809
|
+
`;
|
|
810
|
+
}
|
|
811
|
+
if (props.$horizontalPosition === "center") {
|
|
812
|
+
return css`
|
|
813
|
+
margin-left: auto;
|
|
814
|
+
margin-right: auto;
|
|
815
|
+
`;
|
|
816
|
+
}
|
|
817
|
+
return css`
|
|
818
|
+
left: ${props.$horizontalPosition};
|
|
819
|
+
width: ${breakpoints.mobileL}px;
|
|
820
|
+
min-width: ${breakpoints.mobileL}px;
|
|
821
|
+
`;
|
|
822
|
+
}}
|
|
759
823
|
}
|
|
760
824
|
|
|
825
|
+
/* Closed state styles */
|
|
761
826
|
${(props) => !props.$opened && (props.$verticalPosition === "top" ? css`
|
|
762
|
-
|
|
827
|
+
${props.$pushContentDown ? css`
|
|
828
|
+
/* Push content down mode: show only toggle button */
|
|
829
|
+
height: 32px !important;
|
|
830
|
+
max-height: 32px !important;
|
|
831
|
+
${screens.tablet} {
|
|
832
|
+
height: 32px !important;
|
|
833
|
+
max-height: 32px !important;
|
|
834
|
+
}
|
|
835
|
+
> *:not(:last-child) {
|
|
836
|
+
display: none;
|
|
837
|
+
}
|
|
838
|
+
> *:last-child {
|
|
839
|
+
flex-shrink: 0;
|
|
840
|
+
min-height: 32px;
|
|
841
|
+
height: 32px;
|
|
842
|
+
width: 100%;
|
|
843
|
+
}
|
|
844
|
+
` : css`
|
|
845
|
+
/* Overlay mode: translate up to show only toggle button */
|
|
846
|
+
transform: translateY(calc(-100% + 32px));
|
|
847
|
+
`}
|
|
763
848
|
` : css`
|
|
849
|
+
/* Bottom position: translate down to show only toggle button */
|
|
764
850
|
transform: translateY(calc(100% - 32px));
|
|
765
851
|
width: 100%;
|
|
852
|
+
|
|
766
853
|
${screens.tablet} {
|
|
767
854
|
width: ${breakpoints.mobileL}px;
|
|
768
855
|
max-width: ${breakpoints.mobileL}px;
|
|
769
856
|
min-width: ${breakpoints.mobileL}px;
|
|
770
857
|
}
|
|
858
|
+
|
|
771
859
|
> *:not(:last-child) {
|
|
772
860
|
display: none;
|
|
773
861
|
}
|
|
862
|
+
|
|
774
863
|
> *:last-child {
|
|
775
864
|
flex-shrink: 0;
|
|
776
865
|
min-height: 32px;
|
|
@@ -787,7 +876,7 @@ import React6 from "react";
|
|
|
787
876
|
import { styled as styled2 } from "styled-components";
|
|
788
877
|
var Name = styled2.span`
|
|
789
878
|
color: ${(props) => props.theme.colors.content.title};
|
|
790
|
-
font-weight:
|
|
879
|
+
font-weight: 700;
|
|
791
880
|
`;
|
|
792
881
|
var ProfileInfo = styled2.div`
|
|
793
882
|
display: flex;
|
|
@@ -814,6 +903,16 @@ var Wrapper2 = styled2.div`
|
|
|
814
903
|
display: flex;
|
|
815
904
|
padding: ${(props) => props.theme.spacing.components.small};
|
|
816
905
|
gap: ${(props) => props.theme.spacing.components.small};
|
|
906
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
907
|
+
font-weight: 600 !important;
|
|
908
|
+
|
|
909
|
+
* {
|
|
910
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
911
|
+
}
|
|
912
|
+
|
|
913
|
+
*:not(b):not(strong):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
914
|
+
font-weight: 600 !important;
|
|
915
|
+
}
|
|
817
916
|
`;
|
|
818
917
|
|
|
819
918
|
// src/components/BotIcon/index.tsx
|
|
@@ -950,6 +1049,13 @@ import { styled as styled3 } from "styled-components";
|
|
|
950
1049
|
var Wrapper3 = styled3.span`
|
|
951
1050
|
color: ${(props) => props.theme.colors.content.detail};
|
|
952
1051
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
1052
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1053
|
+
font-weight: 600 !important;
|
|
1054
|
+
|
|
1055
|
+
* {
|
|
1056
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1057
|
+
font-weight: 600 !important;
|
|
1058
|
+
}
|
|
953
1059
|
|
|
954
1060
|
&::before {
|
|
955
1061
|
content: '';
|
|
@@ -1022,6 +1128,16 @@ var Wrapper4 = styled4.div`
|
|
|
1022
1128
|
flex: 1;
|
|
1023
1129
|
height: 100%;
|
|
1024
1130
|
padding-right: ${(props) => props.theme.spacing.components.small};
|
|
1131
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1132
|
+
font-weight: 600 !important;
|
|
1133
|
+
|
|
1134
|
+
* {
|
|
1135
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1136
|
+
}
|
|
1137
|
+
|
|
1138
|
+
*:not(b):not(strong):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
1139
|
+
font-weight: 600 !important;
|
|
1140
|
+
}
|
|
1025
1141
|
|
|
1026
1142
|
/* Custom scrollbar styles */
|
|
1027
1143
|
&::-webkit-scrollbar {
|
|
@@ -1056,6 +1172,8 @@ var Time = styled5.span`
|
|
|
1056
1172
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
1057
1173
|
color: ${(props) => props.theme.colors.content.detail};
|
|
1058
1174
|
white-space: nowrap;
|
|
1175
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1176
|
+
font-weight: 600 !important;
|
|
1059
1177
|
|
|
1060
1178
|
${({ $type }) => {
|
|
1061
1179
|
switch ($type) {
|
|
@@ -1080,6 +1198,16 @@ var Balloon = styled5.div`
|
|
|
1080
1198
|
line-height: 1.5em;
|
|
1081
1199
|
display: flex;
|
|
1082
1200
|
gap: ${(props) => props.theme.spacing.components.small};
|
|
1201
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1202
|
+
font-weight: 600 !important;
|
|
1203
|
+
|
|
1204
|
+
* {
|
|
1205
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1206
|
+
}
|
|
1207
|
+
|
|
1208
|
+
p, li, span, div, code, pre {
|
|
1209
|
+
font-weight: 600 !important;
|
|
1210
|
+
}
|
|
1083
1211
|
|
|
1084
1212
|
&::after {
|
|
1085
1213
|
position: absolute;
|
|
@@ -1140,7 +1268,7 @@ var Balloon = styled5.div`
|
|
|
1140
1268
|
|
|
1141
1269
|
a {
|
|
1142
1270
|
color: ${(props) => props.theme.colors.palette.primary.normal};
|
|
1143
|
-
font-weight:
|
|
1271
|
+
font-weight: 700 !important;
|
|
1144
1272
|
|
|
1145
1273
|
${({ $type }) => $type === "sent" && css2`
|
|
1146
1274
|
color: white;
|
|
@@ -1209,7 +1337,7 @@ var Balloon = styled5.div`
|
|
|
1209
1337
|
strong,
|
|
1210
1338
|
b {
|
|
1211
1339
|
color: inherit;
|
|
1212
|
-
font-weight:
|
|
1340
|
+
font-weight: 700;
|
|
1213
1341
|
}
|
|
1214
1342
|
|
|
1215
1343
|
em,
|
|
@@ -1220,6 +1348,8 @@ var Balloon = styled5.div`
|
|
|
1220
1348
|
var Label = styled5.span`
|
|
1221
1349
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
1222
1350
|
color: ${(props) => props.theme.colors.content.detail};
|
|
1351
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1352
|
+
font-weight: 600 !important;
|
|
1223
1353
|
`;
|
|
1224
1354
|
var BalloonAndActionsWrapper = styled5.div`
|
|
1225
1355
|
display: flex;
|
|
@@ -1355,6 +1485,7 @@ var Tooltip = styled5.span`
|
|
|
1355
1485
|
color: ${(props) => props.theme.colors.content.text};
|
|
1356
1486
|
border-radius: ${(props) => props.theme.borderRadius.small};
|
|
1357
1487
|
font-size: ${(props) => props.theme.fontSizes.xsmall};
|
|
1488
|
+
font-weight: 500;
|
|
1358
1489
|
pointer-events: none;
|
|
1359
1490
|
z-index: 30;
|
|
1360
1491
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
|
|
@@ -1364,6 +1495,7 @@ var Tooltip = styled5.span`
|
|
|
1364
1495
|
`;
|
|
1365
1496
|
var Wrapper5 = styled5.div`
|
|
1366
1497
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
1498
|
+
font-weight: 600 !important;
|
|
1367
1499
|
display: flex;
|
|
1368
1500
|
flex-direction: column;
|
|
1369
1501
|
gap: 2px;
|
|
@@ -1561,6 +1693,13 @@ var Balloon2 = styled6.div`
|
|
|
1561
1693
|
align-items: center;
|
|
1562
1694
|
background: ${(props) => props.theme.colors.layers[2].background};
|
|
1563
1695
|
color: ${(props) => props.theme.colors.content.text};
|
|
1696
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1697
|
+
font-weight: 600 !important;
|
|
1698
|
+
|
|
1699
|
+
* {
|
|
1700
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1701
|
+
font-weight: 600 !important;
|
|
1702
|
+
}
|
|
1564
1703
|
|
|
1565
1704
|
&::after {
|
|
1566
1705
|
position: absolute;
|
|
@@ -1578,12 +1717,21 @@ var Balloon2 = styled6.div`
|
|
|
1578
1717
|
`;
|
|
1579
1718
|
var Label2 = styled6.span`
|
|
1580
1719
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
1720
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1721
|
+
font-weight: 600 !important;
|
|
1581
1722
|
`;
|
|
1582
1723
|
var Wrapper6 = styled6.div`
|
|
1583
1724
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
1584
1725
|
display: flex;
|
|
1585
1726
|
flex-direction: column;
|
|
1586
1727
|
gap: ${(props) => props.theme.spacing.components.xsmall};
|
|
1728
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1729
|
+
font-weight: 600 !important;
|
|
1730
|
+
|
|
1731
|
+
* {
|
|
1732
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1733
|
+
font-weight: 600 !important;
|
|
1734
|
+
}
|
|
1587
1735
|
`;
|
|
1588
1736
|
|
|
1589
1737
|
// src/components/WritingIndicator/index.tsx
|
|
@@ -1673,6 +1821,13 @@ var QuestionButton = styled7(Button2)`
|
|
|
1673
1821
|
justify-content: flex-start;
|
|
1674
1822
|
height: auto;
|
|
1675
1823
|
padding: ${(props) => props.theme.spacing.components.small};
|
|
1824
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1825
|
+
font-weight: 600 !important;
|
|
1826
|
+
|
|
1827
|
+
* {
|
|
1828
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1829
|
+
font-weight: 600 !important;
|
|
1830
|
+
}
|
|
1676
1831
|
`;
|
|
1677
1832
|
var QuestionListItem = styled7.li``;
|
|
1678
1833
|
var QuestionList = styled7.ul`
|
|
@@ -1683,12 +1838,22 @@ var QuestionList = styled7.ul`
|
|
|
1683
1838
|
var Title = styled7.span`
|
|
1684
1839
|
display: block;
|
|
1685
1840
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
1686
|
-
font-weight:
|
|
1841
|
+
font-weight: 700;
|
|
1687
1842
|
margin-bottom: ${(props) => props.theme.spacing.components.medium};
|
|
1688
1843
|
/* text-align: center; */
|
|
1689
1844
|
`;
|
|
1690
1845
|
var Wrapper7 = styled7.div`
|
|
1691
1846
|
padding: ${(props) => props.theme.spacing.components.medium};
|
|
1847
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1848
|
+
font-weight: 600 !important;
|
|
1849
|
+
|
|
1850
|
+
* {
|
|
1851
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1852
|
+
}
|
|
1853
|
+
|
|
1854
|
+
*:not(b):not(strong):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
1855
|
+
font-weight: 600 !important;
|
|
1856
|
+
}
|
|
1692
1857
|
`;
|
|
1693
1858
|
|
|
1694
1859
|
// src/components/SuggestedQuestions/index.tsx
|
|
@@ -1758,6 +1923,7 @@ var LoadingSuggestedQuestions = styled8.span`
|
|
|
1758
1923
|
align-items: center;
|
|
1759
1924
|
gap: ${(props) => props.theme.spacing.components.small};
|
|
1760
1925
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
1926
|
+
font-weight: 600 !important;
|
|
1761
1927
|
padding: ${(props) => props.theme.spacing.components.small}
|
|
1762
1928
|
${(props) => props.theme.spacing.components.medium};
|
|
1763
1929
|
`;
|
|
@@ -1774,13 +1940,14 @@ var Form = styled8.form`
|
|
|
1774
1940
|
|
|
1775
1941
|
/* Chatbot textarea styles */
|
|
1776
1942
|
.textareaField {
|
|
1777
|
-
font-family:
|
|
1943
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1778
1944
|
|
|
1779
1945
|
&,
|
|
1780
1946
|
*,
|
|
1781
1947
|
textarea {
|
|
1782
1948
|
font-size: ${(props) => props.theme.fontSizes.medium} !important;
|
|
1783
|
-
font-family:
|
|
1949
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1950
|
+
font-weight: 600 !important;
|
|
1784
1951
|
}
|
|
1785
1952
|
|
|
1786
1953
|
textarea {
|
|
@@ -1794,7 +1961,8 @@ var Form = styled8.form`
|
|
|
1794
1961
|
line-height: 1.5 !important;
|
|
1795
1962
|
width: 100% !important;
|
|
1796
1963
|
box-sizing: border-box !important;
|
|
1797
|
-
font-family:
|
|
1964
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
1965
|
+
font-weight: 600 !important;
|
|
1798
1966
|
overflow-y: auto !important;
|
|
1799
1967
|
overflow-x: hidden !important;
|
|
1800
1968
|
|
|
@@ -1828,7 +1996,8 @@ var Form = styled8.form`
|
|
|
1828
1996
|
&::placeholder {
|
|
1829
1997
|
color: ${(props) => props.theme.colors.content.detail} !important;
|
|
1830
1998
|
font-size: ${(props) => props.theme.fontSizes.medium} !important;
|
|
1831
|
-
font-family:
|
|
1999
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2000
|
+
font-weight: 600 !important;
|
|
1832
2001
|
}
|
|
1833
2002
|
}
|
|
1834
2003
|
|
|
@@ -1840,6 +2009,16 @@ var Form = styled8.form`
|
|
|
1840
2009
|
`;
|
|
1841
2010
|
var Wrapper8 = styled8.div`
|
|
1842
2011
|
padding: ${(props) => props.theme.spacing.components.small};
|
|
2012
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2013
|
+
font-weight: 600 !important;
|
|
2014
|
+
|
|
2015
|
+
* {
|
|
2016
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2017
|
+
}
|
|
2018
|
+
|
|
2019
|
+
*:not(b):not(strong):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
2020
|
+
font-weight: 600 !important;
|
|
2021
|
+
}
|
|
1843
2022
|
`;
|
|
1844
2023
|
|
|
1845
2024
|
// src/components/ChatbotFooter/index.tsx
|
|
@@ -1917,11 +2096,19 @@ import { css as css4, styled as styled9 } from "styled-components";
|
|
|
1917
2096
|
var ButtonWrapper = styled9.button`
|
|
1918
2097
|
height: 32px;
|
|
1919
2098
|
width: 100%;
|
|
2099
|
+
min-width: auto;
|
|
2100
|
+
max-width: 100%;
|
|
1920
2101
|
background: transparent;
|
|
1921
2102
|
color: ${(props) => props.theme.colors.palette.primary.normal};
|
|
1922
2103
|
padding: ${(props) => props.theme.spacing.components.small};
|
|
1923
2104
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
1924
|
-
font-
|
|
2105
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2106
|
+
font-weight: 700 !important;
|
|
2107
|
+
|
|
2108
|
+
* {
|
|
2109
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2110
|
+
font-weight: 700 !important;
|
|
2111
|
+
}
|
|
1925
2112
|
display: flex;
|
|
1926
2113
|
align-items: center;
|
|
1927
2114
|
justify-content: center;
|
|
@@ -1931,6 +2118,7 @@ var ButtonWrapper = styled9.button`
|
|
|
1931
2118
|
outline: none !important;
|
|
1932
2119
|
box-shadow: none !important;
|
|
1933
2120
|
flex-shrink: 0;
|
|
2121
|
+
box-sizing: border-box;
|
|
1934
2122
|
|
|
1935
2123
|
${(props) => !props.$opened && props.$verticalPosition === "bottom" && css4`
|
|
1936
2124
|
background-color: ${props.theme.colors.layers[1].background};
|
|
@@ -2005,13 +2193,14 @@ var Form2 = styled10.form`
|
|
|
2005
2193
|
|
|
2006
2194
|
/* Feedback textarea styles */
|
|
2007
2195
|
.feedbackTextarea {
|
|
2008
|
-
font-family:
|
|
2196
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2009
2197
|
|
|
2010
2198
|
&,
|
|
2011
2199
|
*,
|
|
2012
2200
|
textarea {
|
|
2013
2201
|
font-size: ${(props) => props.theme.fontSizes.medium} !important;
|
|
2014
|
-
font-family:
|
|
2202
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2203
|
+
font-weight: 600 !important;
|
|
2015
2204
|
}
|
|
2016
2205
|
|
|
2017
2206
|
textarea {
|
|
@@ -2024,7 +2213,8 @@ var Form2 = styled10.form`
|
|
|
2024
2213
|
line-height: 1.5 !important;
|
|
2025
2214
|
width: 100% !important;
|
|
2026
2215
|
box-sizing: border-box !important;
|
|
2027
|
-
font-family:
|
|
2216
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2217
|
+
font-weight: 600 !important;
|
|
2028
2218
|
color: ${(props) => props.theme.colors.content.text} !important;
|
|
2029
2219
|
background-color: ${(props) => props.theme.colors.layers[2].background} !important;
|
|
2030
2220
|
|
|
@@ -2036,7 +2226,8 @@ var Form2 = styled10.form`
|
|
|
2036
2226
|
&::placeholder {
|
|
2037
2227
|
color: ${(props) => props.theme.colors.content.detail} !important;
|
|
2038
2228
|
font-size: ${(props) => props.theme.fontSizes.medium} !important;
|
|
2039
|
-
font-family:
|
|
2229
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2230
|
+
font-weight: 600 !important;
|
|
2040
2231
|
}
|
|
2041
2232
|
}
|
|
2042
2233
|
|
|
@@ -2050,10 +2241,11 @@ var Description = styled10.div`
|
|
|
2050
2241
|
font-size: ${(props) => props.theme.fontSizes.small};
|
|
2051
2242
|
color: ${(props) => props.theme.colors.content.text};
|
|
2052
2243
|
margin-bottom: ${(props) => props.theme.spacing.components.medium};
|
|
2244
|
+
font-weight: 600 !important;
|
|
2053
2245
|
`;
|
|
2054
2246
|
var Title2 = styled10.span`
|
|
2055
2247
|
display: block;
|
|
2056
|
-
font-weight:
|
|
2248
|
+
font-weight: 700;
|
|
2057
2249
|
color: ${(props) => props.theme.colors.content.text};
|
|
2058
2250
|
margin-bottom: ${(props) => props.theme.spacing.components.small};
|
|
2059
2251
|
`;
|
|
@@ -2062,6 +2254,16 @@ var Box = styled10(CardBase)`
|
|
|
2062
2254
|
height: max-content;
|
|
2063
2255
|
padding: ${(props) => props.theme.spacing.components.medium};
|
|
2064
2256
|
transition: ${(props) => props.theme.transitionDurations.default};
|
|
2257
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2258
|
+
font-weight: 600 !important;
|
|
2259
|
+
|
|
2260
|
+
* {
|
|
2261
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2262
|
+
}
|
|
2263
|
+
|
|
2264
|
+
*:not(b):not(strong):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
2265
|
+
font-weight: 600 !important;
|
|
2266
|
+
}
|
|
2065
2267
|
`;
|
|
2066
2268
|
var Wrapper9 = styled10.div`
|
|
2067
2269
|
position: absolute;
|
|
@@ -2188,11 +2390,26 @@ var useChatFeedbackBox = /* @__PURE__ */ __name(() => {
|
|
|
2188
2390
|
|
|
2189
2391
|
// src/components/ChatbotDevice/index.tsx
|
|
2190
2392
|
var ChatbotDevice = /* @__PURE__ */ __name(({
|
|
2191
|
-
verticalPosition = "bottom"
|
|
2393
|
+
verticalPosition = "bottom",
|
|
2394
|
+
pushContentDown = false,
|
|
2395
|
+
horizontalPosition
|
|
2192
2396
|
}) => {
|
|
2193
2397
|
const { opened } = useChatbot_default();
|
|
2194
2398
|
const chatFeedbackBox = useChatFeedbackBox();
|
|
2195
|
-
return /* @__PURE__ */ React14.createElement(
|
|
2399
|
+
return /* @__PURE__ */ React14.createElement(
|
|
2400
|
+
Wrapper,
|
|
2401
|
+
{
|
|
2402
|
+
$opened: opened,
|
|
2403
|
+
$verticalPosition: verticalPosition,
|
|
2404
|
+
$pushContentDown: pushContentDown,
|
|
2405
|
+
$horizontalPosition: horizontalPosition
|
|
2406
|
+
},
|
|
2407
|
+
/* @__PURE__ */ React14.createElement(ChatUserFeedbackRating, { chatFeedbackBox }),
|
|
2408
|
+
/* @__PURE__ */ React14.createElement(ChatbotHeader_default, { chatFeedbackBox }),
|
|
2409
|
+
/* @__PURE__ */ React14.createElement(ChatbotBody_default, null),
|
|
2410
|
+
/* @__PURE__ */ React14.createElement(ChatbotFooter_default, null),
|
|
2411
|
+
/* @__PURE__ */ React14.createElement(ChatbotToggle_default, { verticalPosition, opened })
|
|
2412
|
+
);
|
|
2196
2413
|
}, "ChatbotDevice");
|
|
2197
2414
|
var ChatbotDevice_default = ChatbotDevice;
|
|
2198
2415
|
|
|
@@ -2201,15 +2418,30 @@ import { breakpoints as breakpoints3, screens as screens3 } from "@ibti-tech/ui"
|
|
|
2201
2418
|
import { Container } from "@ibti-tech/ui/dist/components/Container";
|
|
2202
2419
|
import { css as css6, styled as styled11 } from "styled-components";
|
|
2203
2420
|
var BarContainer = styled11(Container)`
|
|
2421
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2422
|
+
font-weight: 600 !important;
|
|
2423
|
+
|
|
2424
|
+
* {
|
|
2425
|
+
font-family: 'Montserrat', sans-serif !important;
|
|
2426
|
+
}
|
|
2427
|
+
|
|
2428
|
+
*:not(b):not(strong):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
2429
|
+
font-weight: 600 !important;
|
|
2430
|
+
}
|
|
2431
|
+
|
|
2204
2432
|
@media screen and (max-width: ${breakpoints3.tablet}px) {
|
|
2205
2433
|
padding: 0;
|
|
2434
|
+
${(props) => props.$opened && props.$verticalPosition === "top" && css6`
|
|
2435
|
+
width: 100% !important;
|
|
2436
|
+
max-width: 100% !important;
|
|
2437
|
+
`}
|
|
2206
2438
|
}
|
|
2207
2439
|
|
|
2208
2440
|
${screens3.tablet} {
|
|
2209
2441
|
display: flex;
|
|
2210
2442
|
justify-content: ${(props) => props.$horizontalPosition === "right" ? "flex-end" : "flex-start"};
|
|
2211
2443
|
|
|
2212
|
-
${(props) => !props.$opened && props.$verticalPosition === "bottom" ? css6`
|
|
2444
|
+
${(props) => !props.$opened && props.$verticalPosition === "bottom" && !props.$pushContentDown ? css6`
|
|
2213
2445
|
width: ${breakpoints3.mobileL}px;
|
|
2214
2446
|
max-width: ${breakpoints3.mobileL}px;
|
|
2215
2447
|
min-width: ${breakpoints3.mobileL}px;
|
|
@@ -2218,60 +2450,122 @@ var BarContainer = styled11(Container)`
|
|
|
2218
2450
|
}
|
|
2219
2451
|
`;
|
|
2220
2452
|
var Wrapper10 = styled11.div`
|
|
2221
|
-
|
|
2222
|
-
|
|
2223
|
-
|
|
2224
|
-
|
|
2225
|
-
|
|
2226
|
-
|
|
2227
|
-
|
|
2228
|
-
|
|
2229
|
-
|
|
2230
|
-
|
|
2231
|
-
|
|
2232
|
-
|
|
2233
|
-
|
|
2234
|
-
|
|
2235
|
-
|
|
2236
|
-
|
|
2237
|
-
|
|
2238
|
-
|
|
2239
|
-
|
|
2240
|
-
|
|
2241
|
-
|
|
2242
|
-
|
|
2243
|
-
|
|
2244
|
-
|
|
2245
|
-
|
|
2246
|
-
|
|
2453
|
+
${(props) => {
|
|
2454
|
+
if (props.$pushContentDown && props.$verticalPosition === "top") {
|
|
2455
|
+
return css6`
|
|
2456
|
+
position: relative;
|
|
2457
|
+
width: 100%;
|
|
2458
|
+
top: 0;
|
|
2459
|
+
z-index: ${props.$zIndex !== void 0 ? props.$zIndex : props.theme.zIndex.modals};
|
|
2460
|
+
pointer-events: none;
|
|
2461
|
+
clear: both;
|
|
2462
|
+
|
|
2463
|
+
${screens3.tablet} {
|
|
2464
|
+
width: auto;
|
|
2465
|
+
background-color: transparent;
|
|
2466
|
+
border: none;
|
|
2467
|
+
padding: 0;
|
|
2468
|
+
${props.$horizontalPosition === "right" ? css6`
|
|
2469
|
+
right: ${(props2) => props2.theme.spacing.components.medium};
|
|
2470
|
+
` : css6`
|
|
2471
|
+
left: ${(props2) => props2.theme.spacing.components.medium};
|
|
2472
|
+
`}
|
|
2473
|
+
}
|
|
2474
|
+
|
|
2475
|
+
@media screen and (max-width: ${breakpoints3.tablet}px) {
|
|
2476
|
+
${props.$opened ? css6`
|
|
2477
|
+
padding-top: 0 !important;
|
|
2478
|
+
height: 100vh;
|
|
2479
|
+
` : css6`
|
|
2480
|
+
height: 32px;
|
|
2481
|
+
min-height: 32px;
|
|
2482
|
+
`}
|
|
2483
|
+
}
|
|
2484
|
+
`;
|
|
2485
|
+
}
|
|
2486
|
+
return css6`
|
|
2487
|
+
position: fixed;
|
|
2488
|
+
width: 100%;
|
|
2489
|
+
z-index: ${props.$zIndex !== void 0 ? props.$zIndex : props.theme.zIndex.modals};
|
|
2490
|
+
pointer-events: none;
|
|
2491
|
+
|
|
2492
|
+
${props.$verticalPosition === "top" ? css6`
|
|
2493
|
+
top: ${props.$topOffset !== void 0 ? typeof props.$topOffset === "number" ? `${props.$topOffset}px` : props.$topOffset : "0"};
|
|
2494
|
+
padding-top: ${props.$topOffset !== void 0 ? 0 : props.theme.spacing.components.xsmall};
|
|
2495
|
+
|
|
2496
|
+
@media screen and (max-width: ${breakpoints3.tablet}px) {
|
|
2497
|
+
${props.$opened ? css6`
|
|
2498
|
+
padding-top: 0 !important;
|
|
2499
|
+
top: 0 !important;
|
|
2500
|
+
height: 100vh;
|
|
2501
|
+
` : ""}
|
|
2502
|
+
}
|
|
2247
2503
|
` : css6`
|
|
2248
|
-
|
|
2504
|
+
bottom: 0;
|
|
2505
|
+
padding-bottom: ${(props2) => props2.theme.spacing.components.xsmall};
|
|
2506
|
+
|
|
2507
|
+
@media screen and (max-width: ${breakpoints3.tablet}px) {
|
|
2508
|
+
${props.$opened ? css6`
|
|
2509
|
+
padding-bottom: 0;
|
|
2510
|
+
` : ""}
|
|
2511
|
+
}
|
|
2249
2512
|
`}
|
|
2250
|
-
|
|
2513
|
+
|
|
2514
|
+
${screens3.tablet} {
|
|
2515
|
+
width: auto;
|
|
2516
|
+
background-color: transparent;
|
|
2517
|
+
border: none;
|
|
2518
|
+
padding: 0;
|
|
2519
|
+
${props.$horizontalPosition === "right" ? css6`
|
|
2520
|
+
right: ${(props2) => props2.theme.spacing.components.medium};
|
|
2521
|
+
` : css6`
|
|
2522
|
+
left: ${(props2) => props2.theme.spacing.components.medium};
|
|
2523
|
+
`}
|
|
2524
|
+
}
|
|
2525
|
+
`;
|
|
2526
|
+
}}
|
|
2251
2527
|
`;
|
|
2252
2528
|
|
|
2253
2529
|
// src/components/ChatbotBar/index.tsx
|
|
2254
2530
|
import React15 from "react";
|
|
2255
2531
|
var ChatbotBar = /* @__PURE__ */ __name(({
|
|
2256
2532
|
verticalPosition = "bottom",
|
|
2257
|
-
horizontalPosition = "right"
|
|
2533
|
+
horizontalPosition = "right",
|
|
2534
|
+
deviceHorizontalPosition,
|
|
2535
|
+
zIndex,
|
|
2536
|
+
topOffset,
|
|
2537
|
+
aboveHeader = false,
|
|
2538
|
+
pushContentDown = false
|
|
2258
2539
|
}) => {
|
|
2259
2540
|
const { opened } = useChatbot_default();
|
|
2541
|
+
const calculatedZIndex = aboveHeader ? 9999 : zIndex;
|
|
2260
2542
|
return /* @__PURE__ */ React15.createElement(
|
|
2261
2543
|
Wrapper10,
|
|
2262
2544
|
{
|
|
2263
2545
|
$verticalPosition: verticalPosition,
|
|
2264
2546
|
$horizontalPosition: horizontalPosition,
|
|
2265
|
-
$opened: opened
|
|
2547
|
+
$opened: opened,
|
|
2548
|
+
$zIndex: calculatedZIndex,
|
|
2549
|
+
$topOffset: topOffset,
|
|
2550
|
+
$aboveHeader: aboveHeader,
|
|
2551
|
+
$pushContentDown: pushContentDown
|
|
2266
2552
|
},
|
|
2267
2553
|
/* @__PURE__ */ React15.createElement(
|
|
2268
2554
|
BarContainer,
|
|
2269
2555
|
{
|
|
2270
2556
|
$horizontalPosition: horizontalPosition,
|
|
2271
2557
|
$opened: opened,
|
|
2272
|
-
$verticalPosition: verticalPosition
|
|
2558
|
+
$verticalPosition: verticalPosition,
|
|
2559
|
+
$pushContentDown: pushContentDown && verticalPosition === "top"
|
|
2273
2560
|
},
|
|
2274
|
-
/* @__PURE__ */ React15.createElement(
|
|
2561
|
+
/* @__PURE__ */ React15.createElement(
|
|
2562
|
+
ChatbotDevice_default,
|
|
2563
|
+
{
|
|
2564
|
+
verticalPosition,
|
|
2565
|
+
pushContentDown: pushContentDown && verticalPosition === "top",
|
|
2566
|
+
horizontalPosition: deviceHorizontalPosition
|
|
2567
|
+
}
|
|
2568
|
+
)
|
|
2275
2569
|
)
|
|
2276
2570
|
);
|
|
2277
2571
|
}, "ChatbotBar");
|