@subiz/widget-v4 4.1.100 → 4.1.102

package/dist/HASH

@@ -1 +1 @@
-191a16d5da3
+191a179639e

package/dist/screenshoot.html

@@ -4,4 +4,4 @@
 			}
 			body {
 				background: #ddd;
-			}</style></head><body><script defer="defer" src="https://vcdn.subiz-cdn.com/widget-v4/public/191a16d5da3.screenshoot.js"></script></body></html>
+			}</style></head><body><script defer="defer" src="./screenshoot.js"></script></body></html>

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@subiz/widget-v4",
-	"version": "4.1.100",
+	"version": "4.1.102",
 	"main": "./compiled_src/lib.js",
 	"scripts": {
 		"dev": "npx webpack serve --config webpack.dev.js",
@@ -30,10 +30,10 @@
 		"babel-loader": "^9.1.3",
 		"babel-plugin-syntax-jsx": "^6.18.0",
 		"html-webpack-plugin": "^5.6.0",
-		"puppeteer": "^23.2.1",
+		"puppeteer": "^23.3.0",
 		"webpack": "^5.94.0",
 		"webpack-bundle-analyzer": "^4.10.2",
 		"webpack-cli": "^5.1.4",
-		"webpack-dev-server": "^5.0.4"
+		"webpack-dev-server": "^5.1.0"
 	}
 }

package/src/chatbox/PoweredBy.js

@@ -11,7 +11,7 @@ export default function PoweredBy(props) {
 	return (
 		<div class='poweredby'>
 			<a href={link} class='poweredby--text' target='_blank' title='Subiz'>
-				<img width='14' height='10' class='poweredby--subiz-logo' src={logo} alt='powerred by subiz' /> Subiz
+				<img width='17' height='12' class='poweredby--subiz-logo' src={logo} alt='powerred by subiz' /> Subiz
 			</a>
 		</div>
 	)

package/src/chatbox/Widget.js

@@ -214,7 +214,7 @@ export default class Widget extends Com {
 
 		if (is_lead) sb.setUserAttr(user, {key: 'lead_source', text: 'widget'})
 
-		let firstmsg = sb.get(data, 'question.value')
+		let firstmsg = sb.get(data, 'question.value', this.props.t('get_started'))
 		let groupid = sb.get(data, 'group.value', '')
 
 		// creating convo
@@ -279,13 +279,6 @@ export default class Widget extends Com {
 	formMounted = (form) => {
 		// waiting for element to be created
 		let formData = this.fillForm(form)
-		formData['question'] = {
-			key: 'question',
-			is_required: true,
-			label: this.props.t.i18n(sb.get(form, `i18n_question_label`, {})) || form.question_label,
-			type: 'text',
-			value: this.state.quickReplyMessage.text,
-		}
 
 		this.setState({formData})
 		// dont steal focus on mobile or trying to override form
@@ -302,6 +295,11 @@ export default class Widget extends Com {
 		this.setState({formData})
 	}
 
+	onKeywordField(e, form, formName, key) {
+		if (e.code == 'Enter') {
+			this.submitPrechatForm(form, formName)
+		}
+	}
 	onInputChange(key, val) {
 		this.wasFormInputed = true
 		let formData = sb.cloneDeep(this.state.formData)
@@ -447,7 +445,7 @@ export default class Widget extends Com {
 		)
 	}
 
-	renderFields() {
+	renderFields(form, formName) {
 		if (sb.size(this.state.formData) === 0) return null
 		let $fields = sb.map(this.state.formData, (field, key) => {
 			// not display question when click bot quick reply
@@ -484,6 +482,7 @@ export default class Widget extends Com {
 							value={field.value || ''}
 							onInput={(e) => this.onInputChange(key, e.target.value)}
 							onChange={(e) => this.onInputChange(key, e.target.value)}
+							onKeyDown={(e) => this.onKeywordField(e, form, formName, key)}
 							ref={(ref) => {
 								this['form_' + encode(key)] = ref
 							}}
@@ -604,7 +603,7 @@ export default class Widget extends Com {
 					<div class='flex-grow-1'>
 						<div class='form mt-3 pl-3 pr-3 pt-3 pb-3 d-flex flex-column'>
 							<div>{title}</div>
-							{this.renderFields()}
+							{this.renderFields(form, formName)}
 						</div>
 					</div>
 
@@ -730,9 +729,7 @@ export default class Widget extends Com {
 
 	fillQuickReplyToQuestion(message) {
 		let formData = this.state.formData
-		if (formData) {
-			sb.set(formData, 'question.value', message.text)
-		}
+		if (formData) sb.set(formData, 'question.value', message.text || this.props.t('get_started'))
 		this.setState({formData, quickReplyMessage: message})
 	}
 
@@ -1085,12 +1082,14 @@ export default class Widget extends Com {
 			}
 		}
 
-		// add question field
-		data['question'] = {
-			key: 'question',
-			is_required: true,
-			label: this.props.t.i18n(sb.get(form, `i18n_question_label`, {})) || form.question_label,
-			type: 'text',
+		if (form.question_required) {
+			// add question field
+			data['question'] = {
+				key: 'question',
+				is_required: true,
+				label: this.props.t.i18n(sb.get(form, `i18n_question_label`, {})) || form.question_label,
+				type: 'text',
+			}
 		}
 
 		if (this.isFormChanged(this.state.formData, data)) {
@@ -1156,6 +1155,16 @@ export default class Widget extends Com {
 				list: sb.map(form.groups, (group) => ({value: group.id, label: group.name})),
 			}
 		}
+
+		if (form.question_required) {
+			formData['question'] = {
+				key: 'question',
+				is_required: true,
+				label: this.props.t.i18n(sb.get(form, `i18n_question_label`, {})) || form.question_label,
+				type: 'text',
+				value: this.state.quickReplyMessage.text,
+			}
+		}
 		return data
 	}
 }

package/webpack.prod.js

@@ -10,7 +10,6 @@ webpackconfig.entry = {
 	app: './app.js',
 	preview: './preview.js',
 	library: './library.js',
-	screenshoot: './screenshoot.js',
 }
 
 const HASH = Date.now().toString(16)
@@ -34,12 +33,6 @@ webpackconfig.plugins = [
 		inject: 'body',
 		chunks: ['app'],
 	}),
-	new HtmlWebpackPlugin({
-		filename: 'screenshoot.html',
-		template: './screenshoot.html',
-		inject: 'body',
-		chunks: ['screenshoot'],
-	}),
 	new HtmlWebpackPlugin({
 		filename: HASH + '.preview.html',
 		template: './preview.html',

package/webpack.screenshoot.js

@@ -1,6 +1,5 @@
 var HtmlWebpackPlugin = require('html-webpack-plugin')
 let webpackconfig = require('./webpack.dev.js')
-var fs = require('fs')
 
 webpackconfig.output.publicPath = './'