@micromag/screen-contribution 0.4.49 → 0.4.50

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.
Files changed (2) hide show
  1. package/es/index.js +248 -224
  2. package/package.json +16 -16
package/es/index.js CHANGED
@@ -8,7 +8,7 @@ import { faSpinner } from '@fortawesome/free-solid-svg-icons/faSpinner';
8
8
  import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
9
9
  import classNames from 'classnames';
10
10
  import DOMPurify from 'dompurify';
11
- import React, { useRef, useState, useCallback, useEffect } from 'react';
11
+ import { useRef, useState, useCallback, useEffect } from 'react';
12
12
  import { ScreenElement, Transitions } from '@micromag/core/components';
13
13
  import { useScreenSize, useViewerContext, useScreenRenderContext, useViewerWebView, usePlaybackContext, usePlaybackMediaRef } from '@micromag/core/contexts';
14
14
  import { useTrackScreenEvent, useDimensionObserver } from '@micromag/core/hooks';
@@ -24,6 +24,7 @@ import Layout from '@micromag/element-layout';
24
24
  import Scroll from '@micromag/element-scroll';
25
25
  import Text from '@micromag/element-text';
26
26
  import TextInput from '@micromag/element-text-input';
27
+ import { jsx, jsxs } from 'react/jsx-runtime';
27
28
 
28
29
  var styles = {"container":"micromag-screen-contribution-container","background":"micromag-screen-contribution-background","content":"micromag-screen-contribution-content","inner":"micromag-screen-contribution-inner","layout":"micromag-screen-contribution-layout","header":"micromag-screen-contribution-header","emptyTitle":"micromag-screen-contribution-emptyTitle","emptyInputName":"micromag-screen-contribution-emptyInputName","emptyInputMessage":"micromag-screen-contribution-emptyInputMessage","emptySubmit":"micromag-screen-contribution-emptySubmit","emptySkip":"micromag-screen-contribution-emptySkip","title":"micromag-screen-contribution-title","interactiveContainer":"micromag-screen-contribution-interactiveContainer","form":"micromag-screen-contribution-form","inputName":"micromag-screen-contribution-inputName","inputMessage":"micromag-screen-contribution-inputMessage","buttonSubmit":"micromag-screen-contribution-buttonSubmit","buttonSkip":"micromag-screen-contribution-buttonSkip","showBack":"micromag-screen-contribution-showBack","formContent":"micromag-screen-contribution-formContent","formLoading":"micromag-screen-contribution-formLoading","loadingIcon":"micromag-screen-contribution-loadingIcon","contributionsContainer":"micromag-screen-contribution-contributionsContainer","contributionsContent":"micromag-screen-contribution-contributionsContent","contributions":"micromag-screen-contribution-contributions","contribution":"micromag-screen-contribution-contribution","footer":"micromag-screen-contribution-footer","disabled":"micromag-screen-contribution-disabled","submitting":"micromag-screen-contribution-submitting","submitted":"micromag-screen-contribution-submitted","showContributions":"micromag-screen-contribution-showContributions","isPlaceholder":"micromag-screen-contribution-isPlaceholder","reset":"micromag-screen-contribution-reset"};
29
30
 
@@ -279,13 +280,12 @@ function ContributionScreen(_ref) {
279
280
 
280
281
  // Title
281
282
 
282
- var items = [/*#__PURE__*/React.createElement(ScreenElement, {
283
- key: "title",
283
+ var items = [/*#__PURE__*/jsx(ScreenElement, {
284
284
  placeholder: "title",
285
285
  placeholderProps: {
286
286
  height: '0.75em'
287
287
  },
288
- emptyLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
288
+ emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
289
289
  id: "2ZOPe+",
290
290
  defaultMessage: [{
291
291
  "type": 0,
@@ -293,10 +293,11 @@ function ContributionScreen(_ref) {
293
293
  }]
294
294
  }),
295
295
  emptyClassName: styles.emptyTitle,
296
- isEmpty: !hasTitle
297
- }, hasTitle ? /*#__PURE__*/React.createElement(Heading, Object.assign({}, title, {
298
- className: styles.title
299
- })) : null)];
296
+ isEmpty: !hasTitle,
297
+ children: hasTitle ? /*#__PURE__*/jsx(Heading, _objectSpread(_objectSpread({}, title), {}, {
298
+ className: styles.title
299
+ })) : null
300
+ }, "title")];
300
301
  var allContributions = [].concat(_toConsumableArray(userName !== null && userName !== '' && userMessage !== null && userMessage !== '' ? [{
301
302
  name: userName,
302
303
  message: userMessage
@@ -304,232 +305,255 @@ function ContributionScreen(_ref) {
304
305
 
305
306
  // Form
306
307
 
307
- items.push(/*#__PURE__*/React.createElement("div", {
308
- key: "form",
308
+ items.push(/*#__PURE__*/jsxs("div", {
309
309
  className: styles.interactiveContainer,
310
310
  style: {
311
311
  height: submitState < 4 ? interactiveContainerHeight : null,
312
312
  transitionDuration: "".concat(resizeTransitionDuration, "ms")
313
- }
314
- }, /*#__PURE__*/React.createElement("form", {
315
- className: styles.form,
316
- onSubmit: onSubmit,
317
- ref: formRef
318
- }, /*#__PURE__*/React.createElement("div", {
319
- className: styles.formContent
320
- }, /*#__PURE__*/React.createElement(ScreenElement, {
321
- placeholder: "inputText",
322
- placeholderProps: {
323
- height: '0.25em'
324
- },
325
- emptyLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
326
- id: "G/ITGY",
327
- defaultMessage: [{
328
- "type": 0,
329
- "value": "Your name"
330
- }]
331
- }),
332
- emptyClassName: styles.emptyInputName,
333
- isEmpty: !hasNameLabel
334
- }, /*#__PURE__*/React.createElement(Transitions, {
335
- transitions: transitions,
336
- playing: transitionPlaying,
337
- delay: transitionStagger,
338
- disabled: transitionDisabled
339
- }, /*#__PURE__*/React.createElement(TextInput, Object.assign({
340
- className: styles.inputName
341
- }, name, {
342
- value: userName,
343
- onChange: function onChange(e) {
344
- return onNameChange(e);
345
313
  },
346
- onBlur: function onBlur(e) {
347
- return onNameBlur(e);
348
- },
349
- focusable: current && isView,
350
- disabled: isPreview,
351
- required: true
352
- })))), /*#__PURE__*/React.createElement(ScreenElement, {
353
- placeholder: "inputText",
354
- placeholderProps: {
355
- height: '0.75em'
356
- },
357
- emptyLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
358
- id: "JAguka",
359
- defaultMessage: [{
360
- "type": 0,
361
- "value": "Your message"
362
- }]
363
- }),
364
- emptyClassName: styles.emptyInputMessage,
365
- isEmpty: !hasMessageLabel
366
- }, /*#__PURE__*/React.createElement(Transitions, {
367
- transitions: transitions,
368
- playing: transitionPlaying,
369
- delay: transitionStagger * 2,
370
- disabled: transitionDisabled
371
- }, /*#__PURE__*/React.createElement(TextInput, Object.assign({
372
- className: styles.inputMessage
373
- }, message, {
374
- value: userMessage,
375
- onChange: function onChange(e) {
376
- return onMessageChange(e);
377
- },
378
- onBlur: function onBlur(e) {
379
- return onMessageBlur(e);
380
- },
381
- disabled: isPreview,
382
- focusable: current && isView,
383
- multiline: true,
384
- required: true
385
- })))), /*#__PURE__*/React.createElement(ScreenElement, {
386
- placeholder: "button",
387
- emptyLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
388
- id: "5uH4x7",
389
- defaultMessage: [{
390
- "type": 0,
391
- "value": "Submit"
392
- }]
393
- }),
394
- emptyClassName: styles.emptySubmit,
395
- isEmpty: !hasSubmit
396
- }, /*#__PURE__*/React.createElement(Transitions, {
397
- transitions: transitions,
398
- playing: transitionPlaying,
399
- delay: transitionStagger * 3,
400
- disabled: transitionDisabled
401
- }, /*#__PURE__*/React.createElement(Button, {
402
- type: "submit",
403
- className: styles.buttonSubmit,
404
- disabled: isPreview,
405
- buttonStyle: submit !== null ? submit.buttonStyle : null,
406
- focusable: current && isView
407
- }, /*#__PURE__*/React.createElement(Text, Object.assign({}, submit, {
408
- inline: true
409
- })))))), /*#__PURE__*/React.createElement("div", {
410
- className: styles.formLoading
411
- }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
412
- className: styles.loadingIcon,
413
- icon: faSpinner
414
- }))), canViewAnswers && !hasSubmitted ? /*#__PURE__*/React.createElement(ScreenElement, {
415
- placeholder: "button",
416
- emptyLabel: submitState !== 4 ? /*#__PURE__*/React.createElement(FormattedMessage, {
417
- id: "U2RZp5",
418
- defaultMessage: [{
419
- "type": 0,
420
- "value": "Skip"
421
- }]
422
- }) : /*#__PURE__*/React.createElement(FormattedMessage, {
423
- id: "AzN1aW",
424
- defaultMessage: [{
425
- "type": 0,
426
- "value": "Back"
427
- }]
428
- }),
429
- emptyClassName: styles.emptySkip
430
- }, /*#__PURE__*/React.createElement(Transitions, {
431
- transitions: transitions,
432
- playing: transitionPlaying,
433
- delay: transitionStagger * 3,
434
- disabled: transitionDisabled
435
- }, /*#__PURE__*/React.createElement(Button, {
436
- type: "button",
437
- className: classNames([styles.buttonSkip, _defineProperty({}, styles.showBack, submitState === 4)]),
438
- disabled: isPreview,
439
- onClick: onClickSkip,
440
- buttonStyle: finalAnswersButton !== null ? finalAnswersButton.buttonStyle : null,
441
- focusable: current && isView
442
- }, /*#__PURE__*/React.createElement(Text, Object.assign({}, finalAnswersButton, {
443
- inline: true
444
- }))))) : null, /*#__PURE__*/React.createElement("div", {
445
- className: styles.contributionsContainer,
446
- "aria-hidden": submitState === 4 ? null : 'true'
447
- }, /*#__PURE__*/React.createElement("div", {
448
- className: styles.contributionsContent
449
- }, /*#__PURE__*/React.createElement("div", {
450
- className: styles.contributions,
451
- ref: contributionsRef
452
- }, allContributions.map(function (contribution, contributionIndex) {
453
- var nameInnerStyle = nameStyle !== null ? nameStyle.style || null : null;
454
- var messageInnerStyle = messageStyle !== null ? messageStyle.style || null : null;
455
- return /*#__PURE__*/React.createElement("div", {
456
- key: "contribution-".concat(contributionIndex),
457
- className: styles.contribution,
458
- style: nameInnerStyle !== null ? getStyleFromColor(nameInnerStyle.color, 'borderColor') : null
459
- }, /*#__PURE__*/React.createElement(Heading, {
460
- className: styles.contributionName,
461
- body: contribution.name,
462
- size: 2,
463
- textStyle: nameInnerStyle
464
- }), /*#__PURE__*/React.createElement(Text, {
465
- className: styles.contributionMessage,
466
- body: contribution.message,
467
- textStyle: messageInnerStyle
468
- }));
469
- })))), hasFooter ? /*#__PURE__*/React.createElement("div", {
470
- style: {
471
- height: callToActionHeight
472
- }
473
- }) : null));
474
- var headerElement = !isPlaceholder && hasHeader ? /*#__PURE__*/React.createElement("div", {
314
+ children: [/*#__PURE__*/jsxs("form", {
315
+ className: styles.form,
316
+ onSubmit: onSubmit,
317
+ ref: formRef,
318
+ children: [/*#__PURE__*/jsxs("div", {
319
+ className: styles.formContent,
320
+ children: [/*#__PURE__*/jsx(ScreenElement, {
321
+ placeholder: "inputText",
322
+ placeholderProps: {
323
+ height: '0.25em'
324
+ },
325
+ emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
326
+ id: "G/ITGY",
327
+ defaultMessage: [{
328
+ "type": 0,
329
+ "value": "Your name"
330
+ }]
331
+ }),
332
+ emptyClassName: styles.emptyInputName,
333
+ isEmpty: !hasNameLabel,
334
+ children: /*#__PURE__*/jsx(Transitions, {
335
+ transitions: transitions,
336
+ playing: transitionPlaying,
337
+ delay: transitionStagger,
338
+ disabled: transitionDisabled,
339
+ children: /*#__PURE__*/jsx(TextInput, _objectSpread(_objectSpread({
340
+ className: styles.inputName
341
+ }, name), {}, {
342
+ value: userName,
343
+ onChange: function onChange(e) {
344
+ return onNameChange(e);
345
+ },
346
+ onBlur: function onBlur(e) {
347
+ return onNameBlur(e);
348
+ },
349
+ focusable: current && isView,
350
+ disabled: isPreview,
351
+ required: true
352
+ }))
353
+ })
354
+ }), /*#__PURE__*/jsx(ScreenElement, {
355
+ placeholder: "inputText",
356
+ placeholderProps: {
357
+ height: '0.75em'
358
+ },
359
+ emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
360
+ id: "JAguka",
361
+ defaultMessage: [{
362
+ "type": 0,
363
+ "value": "Your message"
364
+ }]
365
+ }),
366
+ emptyClassName: styles.emptyInputMessage,
367
+ isEmpty: !hasMessageLabel,
368
+ children: /*#__PURE__*/jsx(Transitions, {
369
+ transitions: transitions,
370
+ playing: transitionPlaying,
371
+ delay: transitionStagger * 2,
372
+ disabled: transitionDisabled,
373
+ children: /*#__PURE__*/jsx(TextInput, _objectSpread(_objectSpread({
374
+ className: styles.inputMessage
375
+ }, message), {}, {
376
+ value: userMessage,
377
+ onChange: function onChange(e) {
378
+ return onMessageChange(e);
379
+ },
380
+ onBlur: function onBlur(e) {
381
+ return onMessageBlur(e);
382
+ },
383
+ disabled: isPreview,
384
+ focusable: current && isView,
385
+ multiline: true,
386
+ required: true
387
+ }))
388
+ })
389
+ }), /*#__PURE__*/jsx(ScreenElement, {
390
+ placeholder: "button",
391
+ emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
392
+ id: "5uH4x7",
393
+ defaultMessage: [{
394
+ "type": 0,
395
+ "value": "Submit"
396
+ }]
397
+ }),
398
+ emptyClassName: styles.emptySubmit,
399
+ isEmpty: !hasSubmit,
400
+ children: /*#__PURE__*/jsx(Transitions, {
401
+ transitions: transitions,
402
+ playing: transitionPlaying,
403
+ delay: transitionStagger * 3,
404
+ disabled: transitionDisabled,
405
+ children: /*#__PURE__*/jsx(Button, {
406
+ type: "submit",
407
+ className: styles.buttonSubmit,
408
+ disabled: isPreview,
409
+ buttonStyle: submit !== null ? submit.buttonStyle : null,
410
+ focusable: current && isView,
411
+ children: /*#__PURE__*/jsx(Text, _objectSpread(_objectSpread({}, submit), {}, {
412
+ inline: true
413
+ }))
414
+ })
415
+ })
416
+ })]
417
+ }), /*#__PURE__*/jsx("div", {
418
+ className: styles.formLoading,
419
+ children: /*#__PURE__*/jsx(FontAwesomeIcon, {
420
+ className: styles.loadingIcon,
421
+ icon: faSpinner
422
+ })
423
+ })]
424
+ }), canViewAnswers && !hasSubmitted ? /*#__PURE__*/jsx(ScreenElement, {
425
+ placeholder: "button",
426
+ emptyLabel: submitState !== 4 ? /*#__PURE__*/jsx(FormattedMessage, {
427
+ id: "U2RZp5",
428
+ defaultMessage: [{
429
+ "type": 0,
430
+ "value": "Skip"
431
+ }]
432
+ }) : /*#__PURE__*/jsx(FormattedMessage, {
433
+ id: "AzN1aW",
434
+ defaultMessage: [{
435
+ "type": 0,
436
+ "value": "Back"
437
+ }]
438
+ }),
439
+ emptyClassName: styles.emptySkip,
440
+ children: /*#__PURE__*/jsx(Transitions, {
441
+ transitions: transitions,
442
+ playing: transitionPlaying,
443
+ delay: transitionStagger * 3,
444
+ disabled: transitionDisabled,
445
+ children: /*#__PURE__*/jsx(Button, {
446
+ type: "button",
447
+ className: classNames([styles.buttonSkip, _defineProperty({}, styles.showBack, submitState === 4)]),
448
+ disabled: isPreview,
449
+ onClick: onClickSkip,
450
+ buttonStyle: finalAnswersButton !== null ? finalAnswersButton.buttonStyle : null,
451
+ focusable: current && isView,
452
+ children: /*#__PURE__*/jsx(Text, _objectSpread(_objectSpread({}, finalAnswersButton), {}, {
453
+ inline: true
454
+ }))
455
+ })
456
+ })
457
+ }) : null, /*#__PURE__*/jsx("div", {
458
+ className: styles.contributionsContainer,
459
+ "aria-hidden": submitState === 4 ? null : 'true',
460
+ children: /*#__PURE__*/jsx("div", {
461
+ className: styles.contributionsContent,
462
+ children: /*#__PURE__*/jsx("div", {
463
+ className: styles.contributions,
464
+ ref: contributionsRef,
465
+ children: allContributions.map(function (contribution, contributionIndex) {
466
+ var nameInnerStyle = nameStyle !== null ? nameStyle.style || null : null;
467
+ var messageInnerStyle = messageStyle !== null ? messageStyle.style || null : null;
468
+ return /*#__PURE__*/jsxs("div", {
469
+ className: styles.contribution,
470
+ style: nameInnerStyle !== null ? getStyleFromColor(nameInnerStyle.color, 'borderColor') : null,
471
+ children: [/*#__PURE__*/jsx(Heading, {
472
+ className: styles.contributionName,
473
+ body: contribution.name,
474
+ size: 2,
475
+ textStyle: nameInnerStyle
476
+ }), /*#__PURE__*/jsx(Text, {
477
+ className: styles.contributionMessage,
478
+ body: contribution.message,
479
+ textStyle: messageInnerStyle
480
+ })]
481
+ }, "contribution-".concat(contributionIndex));
482
+ })
483
+ })
484
+ })
485
+ }), hasFooter ? /*#__PURE__*/jsx("div", {
486
+ style: {
487
+ height: callToActionHeight
488
+ }
489
+ }) : null]
490
+ }, "form"));
491
+ var headerElement = !isPlaceholder && hasHeader ? /*#__PURE__*/jsx("div", {
475
492
  className: styles.header,
476
493
  style: {
477
494
  paddingBottom: spacing
478
- }
479
- }, /*#__PURE__*/React.createElement(Header, header)) : null;
495
+ },
496
+ children: /*#__PURE__*/jsx(Header, _objectSpread({}, header))
497
+ }) : null;
480
498
  var showReset = isEdit && submitState === 4;
481
- return /*#__PURE__*/React.createElement("div", {
499
+ return /*#__PURE__*/jsxs("div", {
482
500
  className: classNames([styles.container, className, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, styles.isPlaceholder, isPlaceholder), styles.submitting, submitState === 1), styles.submitted, submitState > 1), styles.showContributions, submitState === 4)]),
483
- "data-screen-ready": true
484
- }, /*#__PURE__*/React.createElement(Container, {
485
- width: width,
486
- height: height,
487
- className: styles.content
488
- }, showReset ? /*#__PURE__*/React.createElement(Button, {
489
- className: styles.reset,
490
- icon: /*#__PURE__*/React.createElement(FontAwesomeIcon, {
491
- icon: faRedo,
492
- size: "md"
493
- }),
494
- onClick: onContributionReset
495
- }) : null, /*#__PURE__*/React.createElement("div", {
496
- className: styles.inner
497
- }, /*#__PURE__*/React.createElement(Scroll, {
498
- verticalAlign: layout,
499
- disabled: scrollingDisabled,
500
- onScrolledTrigger: onScrolledTrigger,
501
- onScrolledBottom: onScrolledBottom,
502
- onScrolledNotBottom: onScrolledNotBottom,
503
- scrolleeClassName: styles.scrollee,
504
- withShadow: true
505
- }, /*#__PURE__*/React.createElement(Layout, {
506
- className: styles.layout,
507
- style: !isPlaceholder ? {
508
- padding: spacing,
509
- paddingTop: hasHeader ? spacing / 2 + (!isPreview ? viewerTopHeight : 0) : spacing / 2,
510
- paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing / 2
511
- } : null
512
- }, headerElement, items)), !isPlaceholder && hasFooter ? /*#__PURE__*/React.createElement("div", {
513
- ref: footerRef,
514
- className: classNames([styles.footer, _defineProperty({}, styles.disabled, !swipeUpLinkActive)]),
515
- style: {
516
- paddingLeft: Math.max(viewerBottomSidesWidth, spacing / 2),
517
- paddingRight: Math.max(viewerBottomSidesWidth, spacing / 2),
518
- paddingTop: 0,
519
- paddingBottom: (!isPreview ? viewerBottomHeight : 0) + spacing / 2
520
- }
521
- }, /*#__PURE__*/React.createElement(Footer, footerProps)) : null)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
522
- background: background,
523
- width: width,
524
- height: height,
525
- resolution: resolution,
526
- playing: backgroundPlaying,
527
- muted: muted,
528
- shouldLoad: mediaShouldLoad,
529
- mediaRef: mediaRef,
530
- withoutVideo: isPreview,
531
- className: styles.background
532
- }) : null);
501
+ "data-screen-ready": true,
502
+ children: [/*#__PURE__*/jsxs(Container, {
503
+ width: width,
504
+ height: height,
505
+ className: styles.content,
506
+ children: [showReset ? /*#__PURE__*/jsx(Button, {
507
+ className: styles.reset,
508
+ icon: /*#__PURE__*/jsx(FontAwesomeIcon, {
509
+ icon: faRedo,
510
+ size: "md"
511
+ }),
512
+ onClick: onContributionReset
513
+ }) : null, /*#__PURE__*/jsxs("div", {
514
+ className: styles.inner,
515
+ children: [/*#__PURE__*/jsx(Scroll, {
516
+ verticalAlign: layout,
517
+ disabled: scrollingDisabled,
518
+ onScrolledTrigger: onScrolledTrigger,
519
+ onScrolledBottom: onScrolledBottom,
520
+ onScrolledNotBottom: onScrolledNotBottom,
521
+ scrolleeClassName: styles.scrollee,
522
+ withShadow: true,
523
+ children: /*#__PURE__*/jsxs(Layout, {
524
+ className: styles.layout,
525
+ style: !isPlaceholder ? {
526
+ padding: spacing,
527
+ paddingTop: hasHeader ? spacing / 2 + (!isPreview ? viewerTopHeight : 0) : spacing / 2,
528
+ paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing / 2
529
+ } : null,
530
+ children: [headerElement, items]
531
+ })
532
+ }), !isPlaceholder && hasFooter ? /*#__PURE__*/jsx("div", {
533
+ ref: footerRef,
534
+ className: classNames([styles.footer, _defineProperty({}, styles.disabled, !swipeUpLinkActive)]),
535
+ style: {
536
+ paddingLeft: Math.max(viewerBottomSidesWidth, spacing / 2),
537
+ paddingRight: Math.max(viewerBottomSidesWidth, spacing / 2),
538
+ paddingTop: 0,
539
+ paddingBottom: (!isPreview ? viewerBottomHeight : 0) + spacing / 2
540
+ },
541
+ children: /*#__PURE__*/jsx(Footer, _objectSpread({}, footerProps))
542
+ }) : null]
543
+ })]
544
+ }), !isPlaceholder ? /*#__PURE__*/jsx(Background, {
545
+ background: background,
546
+ width: width,
547
+ height: height,
548
+ resolution: resolution,
549
+ playing: backgroundPlaying,
550
+ muted: muted,
551
+ shouldLoad: mediaShouldLoad,
552
+ mediaRef: mediaRef,
553
+ withoutVideo: isPreview,
554
+ className: styles.background
555
+ }) : null]
556
+ });
533
557
  }
534
558
 
535
559
  var definition = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-contribution",
3
- "version": "0.4.49",
3
+ "version": "0.4.50",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [
@@ -64,20 +64,20 @@
64
64
  "@fortawesome/fontawesome-svg-core": "^7.2.0",
65
65
  "@fortawesome/free-solid-svg-icons": "^7.2.0",
66
66
  "@fortawesome/react-fontawesome": "^3.2.0",
67
- "@micromag/core": "^0.4.49",
68
- "@micromag/data": "^0.4.49",
69
- "@micromag/element-background": "^0.4.49",
70
- "@micromag/element-button": "^0.4.49",
71
- "@micromag/element-container": "^0.4.49",
72
- "@micromag/element-footer": "^0.4.49",
73
- "@micromag/element-header": "^0.4.49",
74
- "@micromag/element-heading": "^0.4.49",
75
- "@micromag/element-layout": "^0.4.49",
76
- "@micromag/element-scroll": "^0.4.49",
77
- "@micromag/element-share-incentive": "^0.4.49",
78
- "@micromag/element-text": "^0.4.49",
79
- "@micromag/element-text-input": "^0.4.49",
80
- "@micromag/transforms": "^0.4.49",
67
+ "@micromag/core": "^0.4.50",
68
+ "@micromag/data": "^0.4.50",
69
+ "@micromag/element-background": "^0.4.50",
70
+ "@micromag/element-button": "^0.4.50",
71
+ "@micromag/element-container": "^0.4.50",
72
+ "@micromag/element-footer": "^0.4.50",
73
+ "@micromag/element-header": "^0.4.50",
74
+ "@micromag/element-heading": "^0.4.50",
75
+ "@micromag/element-layout": "^0.4.50",
76
+ "@micromag/element-scroll": "^0.4.50",
77
+ "@micromag/element-share-incentive": "^0.4.50",
78
+ "@micromag/element-text": "^0.4.50",
79
+ "@micromag/element-text-input": "^0.4.50",
80
+ "@micromag/transforms": "^0.4.50",
81
81
  "classnames": "^2.2.6",
82
82
  "dompurify": "^3.2.6",
83
83
  "lodash": "^4.17.23",
@@ -88,6 +88,6 @@
88
88
  "access": "public",
89
89
  "registry": "https://registry.npmjs.org/"
90
90
  },
91
- "gitHead": "0a225ff29387217cccb0fcc5a731e23c74bd202e",
91
+ "gitHead": "940d5ca98f8f448b79eaa3e2fa685c3ee95185b8",
92
92
  "types": "es/index.d.ts"
93
93
  }