beem-component 1.9.6 → 1.9.8

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.
@@ -1,23 +1,14 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
3
  Object.defineProperty(exports, "__esModule", {
5
4
  value: true
6
5
  });
7
6
  exports.BmContactCheckbox = exports.BmContactCard = void 0;
8
7
  var _styledComponents = _interopRequireDefault(require("styled-components"));
9
- var _react = _interopRequireWildcard(require("react"));
8
+ var _react = _interopRequireDefault(require("react"));
10
9
  var _colors = require("../../colors");
11
10
  var _excluded = ["className", "checked", "label", "value", "disabled", "onChange"];
12
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
13
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
14
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
16
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
17
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
18
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
19
- function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
20
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
21
12
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
22
13
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
23
14
  /* eslint-disable jsx-a11y/label-has-associated-control */
@@ -50,18 +41,13 @@ var CheckboxContainer = _styledComponents.default.div.withConfig({
50
41
  });
51
42
  var BmContactCheckbox = function BmContactCheckbox(_ref4) {
52
43
  var className = _ref4.className,
53
- defaultChecked = _ref4.checked,
44
+ checked = _ref4.checked,
54
45
  label = _ref4.label,
55
46
  value = _ref4.value,
56
47
  disabled = _ref4.disabled,
57
48
  onChange = _ref4.onChange,
58
49
  props = _objectWithoutProperties(_ref4, _excluded);
59
- var _useState = (0, _react.useState)(defaultChecked),
60
- _useState2 = _slicedToArray(_useState, 2),
61
- checked = _useState2[0],
62
- setChecked = _useState2[1];
63
50
  var handleChange = function handleChange(event) {
64
- setChecked(event.target.checked);
65
51
  if (onChange) {
66
52
  onChange(event);
67
53
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "beem-component",
3
- "version": "1.9.6",
3
+ "version": "1.9.8",
4
4
  "private": false,
5
5
  "main": "dist/components/index.js",
6
6
  "scripts": {
package/src/App.js CHANGED
@@ -119,405 +119,51 @@ const Chat = () => {
119
119
  prev_message: 'how are you????????',
120
120
  },
121
121
  },
122
- {
123
- message: 'how are you????????',
124
- id: 20268,
125
- time: '2024-01-22T10:03:23.000Z',
126
- direction: 'inbound',
127
- message_type: 'text',
128
- messageId: null,
129
- is_live_agent: true,
130
- is_deleted: false,
131
- is_comment: false,
132
- channel: 'whatsapp',
133
- sent_to_vendor: true,
134
- replyMessageId: null,
135
- agent_name: null,
136
- df_agent_name: null,
137
- resolve_time: null,
138
- metadata: null,
139
- },
140
- {
141
- message: 'hi\n',
142
- id: 20267,
143
- time: '2024-01-22T10:03:01.000Z',
144
- direction: 'outbound',
145
- message_type: null,
146
- messageId: 'f38be83c-92b1-47a7-9e6a-0d209da0ad86',
147
- is_live_agent: false,
148
- is_deleted: false,
149
- is_comment: false,
150
- channel: 'whatsapp',
151
- sent_to_vendor: true,
152
- replyMessageId: null,
153
- agent_name: 'arl@beem.co.tz',
154
- df_agent_name: 'Dev arl',
155
- resolve_time: null,
156
- metadata: null,
157
- statusDetails: {
158
- statusCode: 3,
159
- },
160
- },
161
- {
162
- message: 'Sorry, what was that?',
163
- id: 20266,
164
- time: '2024-01-22T10:02:36.000Z',
165
- direction: 'outbound',
166
- message_type: 'text',
167
- messageId: null,
168
- is_live_agent: false,
169
- is_deleted: false,
170
- is_comment: false,
171
- channel: 'whatsapp',
172
- sent_to_vendor: true,
173
- replyMessageId: null,
174
- agent_name: null,
175
- df_agent_name: null,
176
- resolve_time: null,
177
- metadata: null,
178
- statusDetails: {
179
- statusCode: 3,
180
- },
181
- },
182
- {
183
- message: 'how are you?',
184
- id: 20265,
185
- time: '2024-01-22T10:02:17.000Z',
186
- direction: 'inbound',
187
- message_type: 'text',
188
- messageId: null,
189
- is_live_agent: false,
190
- is_deleted: false,
191
- is_comment: false,
192
- channel: 'whatsapp',
193
- sent_to_vendor: true,
194
- replyMessageId: null,
195
- agent_name: null,
196
- df_agent_name: null,
197
- resolve_time: null,
198
- metadata: null,
199
- },
200
- {
201
- message: 'thank you for chatting with us!!! -Dev',
202
- id: 20264,
203
- time: '2024-01-22T09:55:00.000Z',
204
- direction: 'outbound',
205
- message_type: null,
206
- messageId: null,
207
- is_live_agent: true,
208
- is_deleted: false,
209
- is_comment: false,
210
- channel: 'whatsapp',
211
- sent_to_vendor: true,
212
- replyMessageId: null,
213
- agent_name: null,
214
- df_agent_name: null,
215
- resolve_time: null,
216
- metadata: null,
217
- statusDetails: {
218
- statusCode: 3,
219
- },
220
- },
221
- {
222
- message: 'One more time?',
223
- id: 20223,
224
- time: '2024-01-19T11:00:59.000Z',
225
- direction: 'outbound',
226
- message_type: 'text',
227
- messageId: null,
228
- is_live_agent: false,
229
- is_deleted: false,
230
- is_comment: false,
231
- channel: 'whatsapp',
232
- sent_to_vendor: true,
233
- replyMessageId: null,
234
- agent_name: null,
235
- df_agent_name: null,
236
- resolve_time: null,
237
- metadata: null,
238
- statusDetails: {
239
- statusCode: 3,
240
- },
241
- },
242
- {
243
- message: 'i am good',
244
- id: 20222,
245
- time: '2024-01-19T11:00:55.000Z',
246
- direction: 'inbound',
247
- message_type: 'text',
248
- messageId: null,
249
- is_live_agent: false,
250
- is_deleted: false,
251
- is_comment: false,
252
- channel: 'whatsapp',
253
- sent_to_vendor: true,
254
- replyMessageId: null,
255
- agent_name: null,
256
- df_agent_name: null,
257
- resolve_time: null,
258
- metadata: {
259
- id: 'ABEGJVaCQwSAAhCt33VV1Zivq9-48AP8bs_t',
260
- prev_message: 'if it doesnt exists then to fetch',
261
- },
262
- },
263
- {
264
- message: 'how are you?',
265
- id: 20220,
266
- time: '2024-01-19T10:59:48.000Z',
267
- direction: 'inbound',
268
- message_type: 'text',
269
- messageId: null,
270
- is_live_agent: false,
271
- is_deleted: false,
272
- is_comment: false,
273
- channel: 'whatsapp',
274
- sent_to_vendor: true,
275
- replyMessageId: null,
276
- agent_name: null,
277
- df_agent_name: null,
278
- resolve_time: null,
279
- metadata: null,
280
- },
281
- {
282
- message: 'thank you for chatting with us!!! -Dev',
283
- id: 20217,
284
- time: '2024-01-19T09:55:00.000Z',
285
- direction: 'outbound',
286
- message_type: null,
287
- messageId: null,
288
- is_live_agent: true,
289
- is_deleted: false,
290
- is_comment: false,
291
- channel: 'whatsapp',
292
- sent_to_vendor: true,
293
- replyMessageId: null,
294
- agent_name: null,
295
- df_agent_name: null,
296
- resolve_time: null,
297
- metadata: null,
298
- statusDetails: {
299
- statusCode: 3,
300
- },
301
- },
302
- {
303
- message: 'if it doesnt exists then to fetch',
304
- id: 20208,
305
- time: '2024-01-19T08:54:12.000Z',
306
- direction: 'inbound',
307
- message_type: 'text',
308
- messageId: null,
309
- is_live_agent: true,
310
- is_deleted: false,
311
- is_comment: false,
312
- channel: 'whatsapp',
313
- sent_to_vendor: true,
314
- replyMessageId: null,
315
- agent_name: null,
316
- df_agent_name: null,
317
- resolve_time: null,
318
- metadata: null,
319
- },
320
- {
321
- message: 'hi',
322
- id: 20207,
323
- time: '2024-01-19T08:49:23.000Z',
324
- direction: 'inbound',
325
- message_type: 'text',
326
- messageId: null,
327
- is_live_agent: true,
328
- is_deleted: false,
329
- is_comment: false,
330
- channel: 'whatsapp',
331
- sent_to_vendor: true,
332
- replyMessageId: null,
333
- agent_name: null,
334
- df_agent_name: null,
335
- resolve_time: null,
336
- metadata: null,
337
- },
338
- {
339
- message: 'hi',
340
- id: 20206,
341
- time: '2024-01-19T08:46:09.000Z',
342
- direction: 'inbound',
343
- message_type: 'text',
344
- messageId: null,
345
- is_live_agent: true,
346
- is_deleted: false,
347
- is_comment: false,
348
- channel: 'whatsapp',
349
- sent_to_vendor: true,
350
- replyMessageId: null,
351
- agent_name: null,
352
- df_agent_name: null,
353
- resolve_time: null,
354
- metadata: null,
355
- },
356
- {
357
- message: 'hi',
358
- id: 20205,
359
- time: '2024-01-19T08:43:58.000Z',
360
- direction: 'inbound',
361
- message_type: 'text',
362
- messageId: null,
363
- is_live_agent: true,
364
- is_deleted: false,
365
- is_comment: false,
366
- channel: 'whatsapp',
367
- sent_to_vendor: true,
368
- replyMessageId: null,
369
- agent_name: null,
370
- df_agent_name: null,
371
- resolve_time: null,
372
- metadata: null,
373
- },
374
- {
375
- message: 'hi',
376
- id: 20204,
377
- time: '2024-01-19T08:41:43.000Z',
378
- direction: 'inbound',
379
- message_type: 'text',
380
- messageId: null,
381
- is_live_agent: true,
382
- is_deleted: false,
383
- is_comment: false,
384
- channel: 'whatsapp',
385
- sent_to_vendor: true,
386
- replyMessageId: null,
387
- agent_name: null,
388
- df_agent_name: null,
389
- resolve_time: null,
390
- metadata: null,
391
- },
392
- {
393
- message: 'hi',
394
- id: 20201,
395
- time: '2024-01-19T08:40:27.000Z',
396
- direction: 'inbound',
397
- message_type: 'text',
398
- messageId: null,
399
- is_live_agent: true,
400
- is_deleted: false,
401
- is_comment: false,
402
- channel: 'whatsapp',
403
- sent_to_vendor: true,
404
- replyMessageId: null,
405
- agent_name: null,
406
- df_agent_name: null,
407
- resolve_time: null,
408
- metadata: null,
409
- },
410
- {
411
- message: 'hi',
412
- id: 20200,
413
- time: '2024-01-19T08:39:19.000Z',
414
- direction: 'inbound',
415
- message_type: 'text',
416
- messageId: null,
417
- is_live_agent: true,
418
- is_deleted: false,
419
- is_comment: false,
420
- channel: 'whatsapp',
421
- sent_to_vendor: true,
422
- replyMessageId: null,
423
- agent_name: null,
424
- df_agent_name: null,
425
- resolve_time: null,
426
- metadata: null,
427
- },
428
- {
429
- message: 'hi',
430
- id: 20199,
431
- time: '2024-01-19T08:37:26.000Z',
432
- direction: 'inbound',
433
- message_type: 'text',
434
- messageId: null,
435
- is_live_agent: true,
436
- is_deleted: false,
437
- is_comment: false,
438
- channel: 'whatsapp',
439
- sent_to_vendor: true,
440
- replyMessageId: null,
441
- agent_name: null,
442
- df_agent_name: null,
443
- resolve_time: null,
444
- metadata: null,
445
- },
446
- {
447
- message: 'hi',
448
- id: 20198,
449
- time: '2024-01-19T08:36:57.000Z',
450
- direction: 'inbound',
451
- message_type: 'text',
452
- messageId: null,
453
- is_live_agent: true,
454
- is_deleted: false,
455
- is_comment: false,
456
- channel: 'whatsapp',
457
- sent_to_vendor: true,
458
- replyMessageId: null,
459
- agent_name: null,
460
- df_agent_name: null,
461
- resolve_time: null,
462
- metadata: null,
463
- },
464
- {
465
- message: 'hi',
466
- id: 20150,
467
- time: '2024-01-18T12:47:26.000Z',
468
- direction: 'inbound',
469
- message_type: 'text',
470
- messageId: null,
471
- is_live_agent: true,
472
- is_deleted: false,
473
- is_comment: false,
474
- channel: 'whatsapp',
475
- sent_to_vendor: true,
476
- replyMessageId: null,
477
- agent_name: null,
478
- df_agent_name: null,
479
- resolve_time: null,
480
- metadata: null,
481
- },
482
- {
483
- message: 'https://bm-chatbot-images.s3.eu-west-1.amazonaws.com/short.jpg',
484
- id: 20147,
485
- time: '2024-01-18T09:57:52.000Z',
486
- direction: 'outbound',
487
- message_type: 'image/png',
488
- messageId: 'ea15131f-2c55-43a3-b166-c38a2c4314b1',
489
- is_live_agent: true,
490
- is_deleted: false,
491
- is_comment: false,
492
- channel: 'whatsapp',
493
- sent_to_vendor: true,
494
- replyMessageId: null,
495
- agent_name: 'arl@beem.co.tz',
496
- df_agent_name: 'Dev arl',
497
- resolve_time: null,
498
- metadata: null,
499
- statusDetails: {
500
- statusCode: 3,
501
- },
502
- },
503
122
  ];
504
123
  // State to manage the visibility of checkboxes
505
- const [checkboxVisibility, setCheckboxVisibility] = useState([]);
124
+ const [checkboxVisibility, setCheckboxVisibility] = useState(msg);
506
125
 
507
126
  // Handler function for the checkbox change event
508
- const handleCheckboxChange = (index, checked) => {
509
- const updatedVisibility = [...checkboxVisibility]; // Create a copy of the visibility state array
510
- updatedVisibility[index] = checked; // Update the visibility state for the corresponding checkbox
511
- setCheckboxVisibility(updatedVisibility); // Update the state
127
+ const handleCheckboxChange = (id) => {
128
+ // e.stopImmediatePropagation();
129
+ const updatedData = checkboxVisibility.map((user) => {
130
+ if (user.id === id) {
131
+ return {
132
+ ...user,
133
+ checked: !user.checked,
134
+ };
135
+ }
136
+ return user;
137
+ });
138
+ setCheckboxVisibility(updatedData);
512
139
  };
140
+
141
+ const selectAll = () => {
142
+ const updatedData = checkboxVisibility.map((user) => {
143
+ return {
144
+ ...user,
145
+ checked: true,
146
+ };
147
+ });
148
+ setCheckboxVisibility(updatedData);
149
+ };
150
+
513
151
  return (
514
152
  <>
515
153
  <GlobalStyle />
516
154
 
517
155
  <BmChat>
518
156
  <BmChat.Body>
519
- {msg.map((ms, index) => (
520
- <BmContactCard isVisible={checkboxVisibility[index]}>
157
+ <button type="button" onClick={selectAll}>
158
+ all
159
+ </button>
160
+ {checkboxVisibility.map((ms) => (
161
+ <BmContactCard
162
+ isVisible={ms.checked}
163
+ onClick={() => {
164
+ console.log('parent');
165
+ }}
166
+ >
521
167
  <BmContactCard.Profile>
522
168
  <BmAvatar user="chatbot" size="medium" />
523
169
  </BmContactCard.Profile>
@@ -525,12 +171,12 @@ const Chat = () => {
525
171
  <BmContactCard.SubDetails>
526
172
  <h3>Contact Names</h3>
527
173
  <BmContactCheckbox
528
- isVisible={checkboxVisibility[index]}
529
- onChange={(event) => {
174
+ isVisible={ms.checked}
175
+ onChange={(e) => {
530
176
  console.log(1);
531
- handleCheckboxChange(index, event.target.checked);
177
+ handleCheckboxChange(ms.id, e);
532
178
  }}
533
- checked={checkboxVisibility[index]}
179
+ checked={ms.checked}
534
180
  />
535
181
  </BmContactCard.SubDetails>
536
182
  <BmContactCard.SubDetails>
@@ -1,5 +1,5 @@
1
1
  import styled from 'styled-components';
2
- import React, { useState } from 'react';
2
+ import React from 'react';
3
3
  import {
4
4
  BmSecondaryBlue12,
5
5
  BmGrey400,
@@ -52,17 +52,14 @@ const CheckboxContainer = styled.div`
52
52
 
53
53
  export const BmContactCheckbox = ({
54
54
  className,
55
- checked: defaultChecked,
55
+ checked,
56
56
  label,
57
57
  value,
58
58
  disabled,
59
59
  onChange,
60
60
  ...props
61
61
  }) => {
62
- const [checked, setChecked] = useState(defaultChecked);
63
-
64
62
  const handleChange = (event) => {
65
- setChecked(event.target.checked);
66
63
  if (onChange) {
67
64
  onChange(event);
68
65
  }