@micromag/core 0.4.88 → 0.4.90-alpha.1

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 (12) hide show
  1. package/assets/css/styles.css +4 -15
  2. package/assets/css/vendor.css +1 -1
  3. package/es/components.d.ts +106 -118
  4. package/es/components.js +1627 -1437
  5. package/es/contexts.d.ts +129 -90
  6. package/es/contexts.js +2 -136
  7. package/es/hooks.d.ts +80 -80
  8. package/es/index.d.ts +62 -46
  9. package/es/styles.css +4 -15
  10. package/es/utils.d.ts +85 -84
  11. package/es/utils.js +4 -4
  12. package/package.json +23 -20
package/es/components.js CHANGED
@@ -9,17 +9,17 @@ import { isMessage, getFieldFromPath, getComponentFromName, setFieldValue, valid
9
9
  import { faClose } from '@fortawesome/free-solid-svg-icons/faClose';
10
10
  import { faAngleDown } from '@fortawesome/free-solid-svg-icons/faAngleDown';
11
11
  import { faAngleUp } from '@fortawesome/free-solid-svg-icons/faAngleUp';
12
- import React, { useState, useEffect, useCallback, useRef, createElement, useMemo, cloneElement } from 'react';
12
+ import React, { useState, useEffect, useCallback, useRef, createElement, Suspense, useMemo, cloneElement } from 'react';
13
13
  import dayjs from 'dayjs';
14
14
  import throttle from 'lodash/throttle';
15
15
  import { useForm, useDocumentEvent, useIntersectionObserver, useDimensionObserver, useDevicePixelRatio } from '@micromag/core/hooks';
16
16
  import get from 'lodash/get';
17
- import { useFieldsManager, useFieldComponent, FieldContextProvider, useFieldContext, withModals, useModals, withPanels, usePanels, ScreenSizeProvider, useScreenComponent, ScreenProvider, useScreenRenderContext, useScreenSize } from '@micromag/core/contexts';
17
+ import { useFieldsManager, useFieldComponent, FieldContextProvider, useFieldContext, withPanels, usePanels, ScreenSizeProvider, useScreenComponent, ScreenProvider, useScreenRenderContext, useScreenSize } from '@micromag/core/contexts';
18
18
  import isObject from 'lodash/isObject';
19
19
  import isArray from 'lodash/isArray';
20
20
  import isString from 'lodash/isString';
21
- import { createPortal } from 'react-dom';
22
21
  import queryString from 'query-string';
22
+ import { createPortal } from 'react-dom';
23
23
  import { faAd } from '@fortawesome/free-solid-svg-icons/faAd';
24
24
  import { faImage } from '@fortawesome/free-solid-svg-icons/faImage';
25
25
  import { faMusic } from '@fortawesome/free-solid-svg-icons/faMusic';
@@ -37,6 +37,9 @@ import { faPercent } from '@fortawesome/free-solid-svg-icons/faPercent';
37
37
  import { getSizeWithinBounds } from '@folklore/size';
38
38
  import { useSpringRef, useSpring } from '@react-spring/core';
39
39
  import { animated, config } from '@react-spring/web';
40
+ import { useUppy } from '@panneau/uppy';
41
+ export { default as DialogModal } from '@panneau/modal-dialog';
42
+ export { Modal, ModalPortal, Modals } from '@panneau/element-modal';
40
43
 
41
44
  const emptyObject$2 = {};
42
45
  function Label(t0) {
@@ -62,7 +65,7 @@ function Label(t0) {
62
65
  return t3;
63
66
  }
64
67
 
65
- var styles$x = {"container":"micromag-core-buttons-button-container","icon":"micromag-core-buttons-button-icon","label":"micromag-core-buttons-button-label","withoutStyle":"micromag-core-buttons-button-withoutStyle","asLink":"micromag-core-buttons-button-asLink","withIcon":"micromag-core-buttons-button-withIcon","right":"micromag-core-buttons-button-right","withIconColumns":"micromag-core-buttons-button-withIconColumns","linkDisabled":"micromag-core-buttons-button-linkDisabled"};
68
+ var styles$m = {"container":"micromag-core-buttons-button-container","icon":"micromag-core-buttons-button-icon","label":"micromag-core-buttons-button-label","withoutStyle":"micromag-core-buttons-button-withoutStyle","asLink":"micromag-core-buttons-button-asLink","withIcon":"micromag-core-buttons-button-withIcon","right":"micromag-core-buttons-button-right","withIconColumns":"micromag-core-buttons-button-withIconColumns","linkDisabled":"micromag-core-buttons-button-linkDisabled"};
66
69
 
67
70
  function Button$1({
68
71
  type = 'button',
@@ -107,10 +110,10 @@ function Button$1({
107
110
  const content = /*#__PURE__*/jsxs(Fragment, {
108
111
  children: [hasInlineIcon ? /*#__PURE__*/jsxs(Fragment, {
109
112
  children: [/*#__PURE__*/jsx("span", {
110
- className: classNames([styles$x.icon, iconClassName]),
113
+ className: classNames([styles$m.icon, iconClassName]),
111
114
  children: icon
112
115
  }), text !== null ? /*#__PURE__*/jsx("span", {
113
- className: classNames([styles$x.label, labelClassName]),
116
+ className: classNames([styles$m.label, labelClassName]),
114
117
  children: text
115
118
  }) : null]
116
119
  }) : null, hasIconColumns ? /*#__PURE__*/jsxs(Fragment, {
@@ -121,7 +124,7 @@ function Button$1({
121
124
  className: classNames([labelClassName]),
122
125
  children: text
123
126
  }), /*#__PURE__*/jsx("span", {
124
- className: classNames([styles$x.right, iconPosition === 'right' ? iconClassName : null]),
127
+ className: classNames([styles$m.right, iconPosition === 'right' ? iconClassName : null]),
125
128
  children: iconPosition === 'right' ? icon : null
126
129
  }), hasChildren ? children : null]
127
130
  }) : null, !hasIcon ? text : null, hasChildren ? children : null]
@@ -132,16 +135,16 @@ function Button$1({
132
135
  [`btn-${outline ? 'outline-' : ''}${theme}`]: withStyle && theme !== null,
133
136
  [`btn-${size}`]: withStyle && size !== null,
134
137
  active: !withoutStyle && active
135
- } : null, styles$x.container, {
136
- [styles$x.withoutStyle]: withoutStyle,
137
- [styles$x.withIcon]: hasIcon,
138
- [styles$x.withIconColumns]: hasIconColumns,
139
- [styles$x.asLink]: asLink
138
+ } : null, styles$m.container, {
139
+ [styles$m.withoutStyle]: withoutStyle,
140
+ [styles$m.withIcon]: hasIcon,
141
+ [styles$m.withIconColumns]: hasIconColumns,
142
+ [styles$m.asLink]: asLink
140
143
  }, className]);
141
144
  if (href !== null) {
142
145
  const linkClassNames = classNames([buttonClassNames, {
143
146
  disabled,
144
- [styles$x.linkDisabled]: disabled
147
+ [styles$m.linkDisabled]: disabled
145
148
  }]);
146
149
  return external || direct ? /*#__PURE__*/jsx("a", {
147
150
  ...props,
@@ -274,70 +277,54 @@ function Buttons(t0) {
274
277
  }
275
278
 
276
279
  function BackButton(t0) {
277
- const $ = c(9);
280
+ const $ = c(5);
278
281
  let props;
279
- let t1;
280
282
  if ($[0] !== t0) {
281
283
  ({
282
- className: t1,
283
284
  ...props
284
285
  } = t0);
285
286
  $[0] = t0;
286
287
  $[1] = props;
287
- $[2] = t1;
288
288
  } else {
289
289
  props = $[1];
290
- t1 = $[2];
291
290
  }
292
- const className = t1 === undefined ? null : t1;
293
- let t2;
294
- if ($[3] !== className) {
295
- t2 = classNames(["px-2", className]);
296
- $[3] = className;
297
- $[4] = t2;
298
- } else {
299
- t2 = $[4];
300
- }
301
- let t3;
302
- if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
303
- t3 = /*#__PURE__*/jsx(FontAwesomeIcon, {
304
- icon: faAngleLeft,
305
- size: "lg"
291
+ let t1;
292
+ if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
293
+ t1 = /*#__PURE__*/jsx(FontAwesomeIcon, {
294
+ icon: faAngleLeft
306
295
  });
307
- $[5] = t3;
296
+ $[2] = t1;
308
297
  } else {
309
- t3 = $[5];
298
+ t1 = $[2];
310
299
  }
311
- let t4;
312
- if ($[6] !== props || $[7] !== t2) {
313
- t4 = /*#__PURE__*/jsx(Button$1, {
314
- className: t2,
300
+ let t2;
301
+ if ($[3] !== props) {
302
+ t2 = /*#__PURE__*/jsx(Button$1, {
315
303
  size: "sm",
316
- icon: t3,
317
- ...props
304
+ ...props,
305
+ children: t1
318
306
  });
319
- $[6] = props;
320
- $[7] = t2;
321
- $[8] = t4;
307
+ $[3] = props;
308
+ $[4] = t2;
322
309
  } else {
323
- t4 = $[8];
310
+ t2 = $[4];
324
311
  }
325
- return t4;
312
+ return t2;
326
313
  }
327
314
 
328
- var styles$w = {"container":"micromag-core-buttons-clear-container","icon":"micromag-core-buttons-clear-icon"};
329
-
330
315
  function ClearButton(t0) {
331
- const $ = c(13);
316
+ const $ = c(16);
332
317
  let props;
333
318
  let t1;
334
319
  let t2;
335
320
  let t3;
321
+ let t4;
336
322
  if ($[0] !== t0) {
337
323
  ({
338
324
  onClick: t1,
339
325
  className: t2,
340
326
  iconOnly: t3,
327
+ disabled: t4,
341
328
  ...props
342
329
  } = t0);
343
330
  $[0] = t0;
@@ -345,51 +332,60 @@ function ClearButton(t0) {
345
332
  $[2] = t1;
346
333
  $[3] = t2;
347
334
  $[4] = t3;
335
+ $[5] = t4;
348
336
  } else {
349
337
  props = $[1];
350
338
  t1 = $[2];
351
339
  t2 = $[3];
352
340
  t3 = $[4];
341
+ t4 = $[5];
353
342
  }
354
343
  const onClick = t1 === undefined ? null : t1;
355
344
  const className = t2 === undefined ? null : t2;
356
345
  const iconOnly = t3 === undefined ? false : t3;
346
+ const disabled = t4 === undefined ? false : t4;
357
347
  const ButtonComponent = iconOnly ? "span" : "button";
358
- let t4;
359
- if ($[5] !== className) {
360
- t4 = classNames([styles$w.container, className]);
361
- $[5] = className;
362
- $[6] = t4;
348
+ let t5;
349
+ if ($[6] !== className || $[7] !== disabled) {
350
+ t5 = classNames(["btn", "d-inline-block", "btn-xs", {
351
+ disabled
352
+ }, className]);
353
+ $[6] = className;
354
+ $[7] = disabled;
355
+ $[8] = t5;
363
356
  } else {
364
- t4 = $[6];
357
+ t5 = $[8];
365
358
  }
366
- let t5;
367
- if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
368
- t5 = /*#__PURE__*/jsx(FontAwesomeIcon, {
369
- className: styles$w.icon,
359
+ const t6 = !iconOnly || !disabled ? onClick : null;
360
+ const t7 = !iconOnly ? disabled : null;
361
+ let t8;
362
+ if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
363
+ t8 = /*#__PURE__*/jsx(FontAwesomeIcon, {
370
364
  icon: faClose
371
365
  });
372
- $[7] = t5;
366
+ $[9] = t8;
373
367
  } else {
374
- t5 = $[7];
368
+ t8 = $[9];
375
369
  }
376
- let t6;
377
- if ($[8] !== ButtonComponent || $[9] !== onClick || $[10] !== props || $[11] !== t4) {
378
- t6 = /*#__PURE__*/jsx(ButtonComponent, {
379
- className: t4,
380
- onClick: onClick,
370
+ let t9;
371
+ if ($[10] !== ButtonComponent || $[11] !== props || $[12] !== t5 || $[13] !== t6 || $[14] !== t7) {
372
+ t9 = /*#__PURE__*/jsx(ButtonComponent, {
373
+ className: t5,
374
+ onClick: t6,
375
+ disabled: t7,
381
376
  ...props,
382
- children: t5
377
+ children: t8
383
378
  });
384
- $[8] = ButtonComponent;
385
- $[9] = onClick;
386
- $[10] = props;
387
- $[11] = t4;
388
- $[12] = t6;
379
+ $[10] = ButtonComponent;
380
+ $[11] = props;
381
+ $[12] = t5;
382
+ $[13] = t6;
383
+ $[14] = t7;
384
+ $[15] = t9;
389
385
  } else {
390
- t6 = $[12];
386
+ t9 = $[15];
391
387
  }
392
- return t6;
388
+ return t9;
393
389
  }
394
390
 
395
391
  const emptyArray$8 = [];
@@ -613,10 +609,9 @@ function FieldForm(t0) {
613
609
  return t19;
614
610
  }
615
611
 
616
- var styles$v = {"container":"micromag-core-forms-form-container","panel":"micromag-core-forms-form-panel","actions":"micromag-core-forms-form-actions","left":"micromag-core-forms-form-left","right":"micromag-core-forms-form-right"};
612
+ var styles$l = {"container":"micromag-core-forms-form-container","panel":"micromag-core-forms-form-panel","actions":"micromag-core-forms-form-actions","left":"micromag-core-forms-form-left","right":"micromag-core-forms-form-right"};
617
613
 
618
614
  /* eslint-disable no-lone-blocks */
619
-
620
615
  const emptyArray$7 = [];
621
616
  function Form({
622
617
  action,
@@ -725,7 +720,7 @@ function Form({
725
720
 
726
721
  return /*#__PURE__*/jsxs("form", {
727
722
  action: action,
728
- className: classNames([styles$v.container, className, {
723
+ className: classNames([styles$l.container, className, {
729
724
  // 'was-validated': status !== null,
730
725
  }]),
731
726
  method: method,
@@ -738,7 +733,7 @@ function Form({
738
733
  onClick: closeFieldForm
739
734
  })
740
735
  }) : null, fields !== null && fields.length > 0 && fieldParams !== null ? /*#__PURE__*/jsx("div", {
741
- className: classNames(['w-100', styles$v.panel]),
736
+ className: classNames(['w-100', styles$l.panel]),
742
737
  children: /*#__PURE__*/jsx(FieldForm, {
743
738
  name: fieldName,
744
739
  fields: fields,
@@ -755,13 +750,13 @@ function Form({
755
750
  onChange: setValue,
756
751
  gotoFieldForm: gotoFieldForm,
757
752
  closeFieldForm: closeFieldForm,
758
- className: classNames([styles$v.fields, fieldsClassName])
753
+ className: classNames([styles$l.fields, fieldsClassName])
759
754
  }) : null, generalError ? /*#__PURE__*/jsx("p", {
760
755
  className: "text-danger my-1",
761
756
  children: generalError
762
757
  }) : null, children, !withoutActions && fieldParams === null ? /*#__PURE__*/jsxs("div", {
763
- className: classNames([styles$v.actions, actionsClassName, {
764
- [styles$v[actionsAlign]]: actionsAlign
758
+ className: classNames([styles$l.actions, actionsClassName, {
759
+ [styles$l[actionsAlign]]: actionsAlign
765
760
  }]),
766
761
  children: [onCancel !== null || onCancelHref !== null ? /*#__PURE__*/jsx(Button$1, {
767
762
  type: "button",
@@ -777,7 +772,7 @@ function Form({
777
772
  })
778
773
  }) : null, buttons !== null ? /*#__PURE__*/jsx(Buttons, {
779
774
  buttons: buttons,
780
- className: styles$v.buttons
775
+ className: styles$l.buttons
781
776
  }) : /*#__PURE__*/jsx(Button$1, {
782
777
  type: "submit",
783
778
  theme: submitButtonTheme || 'primary',
@@ -794,7 +789,7 @@ function Form({
794
789
  });
795
790
  }
796
791
 
797
- var styles$u = {"withoutStyle":"micromag-core-partials-link-withoutStyle"};
792
+ var styles$k = {"withoutStyle":"micromag-core-partials-link-withoutStyle"};
798
793
 
799
794
  function Link(t0) {
800
795
  const $ = c(18);
@@ -847,7 +842,7 @@ function Link(t0) {
847
842
  if ($[9] !== children || $[10] !== className || $[11] !== external || $[12] !== href || $[13] !== props || $[14] !== rel || $[15] !== target || $[16] !== withoutStyle) {
848
843
  t8 = external ? /*#__PURE__*/jsx("a", {
849
844
  className: classNames([className, {
850
- [styles$u.withoutStyle]: withoutStyle
845
+ [styles$k.withoutStyle]: withoutStyle
851
846
  }]),
852
847
  href: href,
853
848
  target: target,
@@ -858,7 +853,7 @@ function Link(t0) {
858
853
  })
859
854
  }) : /*#__PURE__*/jsx(Link$1, {
860
855
  className: classNames([className, {
861
- [styles$u.withoutStyle]: withoutStyle
856
+ [styles$k.withoutStyle]: withoutStyle
862
857
  }]),
863
858
  href: href,
864
859
  ...props,
@@ -1000,7 +995,7 @@ function Card({
1000
995
  });
1001
996
  }
1002
997
 
1003
- var styles$t = {"container":"micromag-core-partials-spinner-container","path":"micromag-core-partials-spinner-path","animated":"micromag-core-partials-spinner-animated"};
998
+ var styles$j = {"container":"micromag-core-partials-spinner-container","path":"micromag-core-partials-spinner-path","animated":"micromag-core-partials-spinner-animated"};
1004
999
 
1005
1000
  function Spinner(t0) {
1006
1001
  const $ = c(9);
@@ -1016,8 +1011,8 @@ function Spinner(t0) {
1016
1011
  const className = t4 === undefined ? null : t4;
1017
1012
  let t5;
1018
1013
  if ($[0] !== animated || $[1] !== className) {
1019
- t5 = classNames([styles$t.container, className, {
1020
- [styles$t.animated]: animated
1014
+ t5 = classNames([styles$j.container, className, {
1015
+ [styles$j.animated]: animated
1021
1016
  }]);
1022
1017
  $[0] = animated;
1023
1018
  $[1] = className;
@@ -1028,7 +1023,7 @@ function Spinner(t0) {
1028
1023
  let t6;
1029
1024
  if ($[3] !== color || $[4] !== strokeWidth) {
1030
1025
  t6 = /*#__PURE__*/jsx("circle", {
1031
- className: styles$t.path,
1026
+ className: styles$j.path,
1032
1027
  cx: "20",
1033
1028
  cy: "20",
1034
1029
  r: "12",
@@ -1061,7 +1056,7 @@ function Spinner(t0) {
1061
1056
  return t7;
1062
1057
  }
1063
1058
 
1064
- var styles$s = {"container":"micromag-core-forms-form-panel-container"};
1059
+ var styles$i = {"container":"micromag-core-forms-form-panel-container"};
1065
1060
 
1066
1061
  function FormPanel(t0) {
1067
1062
  const $ = c(16);
@@ -1097,7 +1092,7 @@ function FormPanel(t0) {
1097
1092
  const className = t4 === undefined ? null : t4;
1098
1093
  let t5;
1099
1094
  if ($[6] !== className) {
1100
- t5 = classNames([styles$s.container, className]);
1095
+ t5 = classNames([styles$i.container, className]);
1101
1096
  $[6] = className;
1102
1097
  $[7] = t5;
1103
1098
  } else {
@@ -1510,7 +1505,7 @@ function UnmuteIcon(t0) {
1510
1505
  return t5;
1511
1506
  }
1512
1507
 
1513
- var styles$r = {"container":"micromag-core-menus-breadcrumb-container","arrow":"micromag-core-menus-breadcrumb-arrow"};
1508
+ var styles$h = {"container":"micromag-core-menus-breadcrumb-container","arrow":"micromag-core-menus-breadcrumb-arrow"};
1514
1509
 
1515
1510
  const emptyArray$6 = [];
1516
1511
  function Breadcrumb({
@@ -1524,7 +1519,7 @@ function Breadcrumb({
1524
1519
  return /*#__PURE__*/jsx("nav", {
1525
1520
  className: className,
1526
1521
  children: /*#__PURE__*/jsx("ol", {
1527
- className: classNames([styles$r.container, 'breadcrumb', 'mb-0', {
1522
+ className: classNames([styles$h.container, 'breadcrumb', 'mb-0', theme !== null ? `text-${theme}` : null, {
1528
1523
  'p-0': withoutBar,
1529
1524
  'bg-transparent': withoutBar,
1530
1525
  'rounded-0': withoutBar,
@@ -1538,7 +1533,7 @@ function Breadcrumb({
1538
1533
  }, index) => /*#__PURE__*/jsxs("li", {
1539
1534
  className: classNames(['breadcrumb-item', {
1540
1535
  active,
1541
- [styles$r.arrow]: separator === 'arrow',
1536
+ [styles$h.arrow]: separator === 'arrow',
1542
1537
  [`text-${theme}`]: active && theme !== null
1543
1538
  }]),
1544
1539
  children: [active ? /*#__PURE__*/jsx(Label, {
@@ -1546,17 +1541,13 @@ function Breadcrumb({
1546
1541
  }) : null, !active && url ? /*#__PURE__*/jsx(Link$1, {
1547
1542
  href: url,
1548
1543
  onClick: onClick,
1549
- className: classNames(['font-weight-bold', 'text-decoration-none', {
1550
- [`text-${theme}`]: theme !== null
1551
- }]),
1544
+ className: classNames(['font-weight-bold', 'text-decoration-none']),
1552
1545
  children: /*#__PURE__*/jsx(Label, {
1553
1546
  children: label
1554
1547
  })
1555
1548
  }) : null, !active && onClick ? /*#__PURE__*/jsx(Button$1, {
1556
1549
  onClick: onClick,
1557
- className: classNames(['font-weight-bold', 'text-decoration-none', {
1558
- [`text-${theme}`]: theme !== null
1559
- }]),
1550
+ className: classNames(['font-weight-bold', 'text-decoration-none']),
1560
1551
  children: /*#__PURE__*/jsx(Label, {
1561
1552
  children: label
1562
1553
  })
@@ -1566,78 +1557,135 @@ function Breadcrumb({
1566
1557
  });
1567
1558
  }
1568
1559
 
1569
- /* eslint-disable react/no-array-index-key */
1570
-
1571
1560
  const emptyArray$5 = [];
1572
- function Dropdown({
1573
- items = emptyArray$5,
1574
- children = null,
1575
- visible = false,
1576
- align = null,
1577
- className = null,
1578
- itemClassName = null,
1579
- onClickItem = null,
1580
- onClickOutside = null
1581
- }) {
1582
- const refContainer = useRef(null);
1561
+ function Dropdown(t0) {
1562
+ const $ = c(20);
1563
+ const {
1564
+ items: t1,
1565
+ children: t2,
1566
+ visible: t3,
1567
+ align: t4,
1568
+ className: t5,
1569
+ itemClassName: t6,
1570
+ onClickItem: t7,
1571
+ onClickOutside: t8
1572
+ } = t0;
1573
+ const items = t1 === undefined ? emptyArray$5 : t1;
1574
+ const children = t2 === undefined ? null : t2;
1575
+ const visible = t3 === undefined ? false : t3;
1576
+ const align = t4 === undefined ? null : t4;
1577
+ const className = t5 === undefined ? null : t5;
1578
+ const itemClassName = t6 === undefined ? null : t6;
1579
+ const onClickItem = t7 === undefined ? null : t7;
1580
+ const onClickOutside = t8 === undefined ? null : t8;
1581
+ const containerRef = useRef(null);
1583
1582
  const [enabled, setEnabled] = useState(visible);
1584
- const onDocumentClick = useCallback(e => {
1585
- if (refContainer.current && !refContainer.current.contains(e.currentTarget) && !refContainer.current.contains(e.target) && onClickOutside !== null) {
1586
- onClickOutside(e);
1587
- }
1588
- }, [refContainer.current, onClickOutside]);
1589
- useDocumentEvent('click', onDocumentClick, enabled);
1590
-
1591
- // Delay the outside click detection
1592
- useEffect(() => {
1593
- const id = setTimeout(() => {
1594
- setEnabled(visible);
1595
- }, 100);
1596
- return () => {
1597
- clearTimeout(id);
1583
+ let t9;
1584
+ if ($[0] !== onClickOutside) {
1585
+ t9 = e => {
1586
+ if (containerRef.current && !containerRef.current.contains(e.currentTarget) && !containerRef.current.contains(e.target) && onClickOutside !== null) {
1587
+ onClickOutside(e);
1588
+ }
1598
1589
  };
1599
- }, [visible, setEnabled]);
1600
- return /*#__PURE__*/jsx("div", {
1601
- className: classNames(['dropdown-menu', {
1602
- [`dropdown-menu-${align}`]: align !== null,
1603
- [`show`]: visible
1604
- }, className]),
1605
- ref: refContainer,
1606
- children: children !== null ? children : items.map((it, index) => {
1590
+ $[0] = onClickOutside;
1591
+ $[1] = t9;
1592
+ } else {
1593
+ t9 = $[1];
1594
+ }
1595
+ const onDocumentClick = t9;
1596
+ useDocumentEvent("click", onDocumentClick, enabled);
1597
+ let t10;
1598
+ let t11;
1599
+ if ($[2] !== visible) {
1600
+ t10 = () => {
1601
+ const id = setTimeout(() => {
1602
+ setEnabled(visible);
1603
+ }, 100);
1604
+ return () => {
1605
+ clearTimeout(id);
1606
+ };
1607
+ };
1608
+ t11 = [visible, setEnabled];
1609
+ $[2] = visible;
1610
+ $[3] = t10;
1611
+ $[4] = t11;
1612
+ } else {
1613
+ t10 = $[3];
1614
+ t11 = $[4];
1615
+ }
1616
+ useEffect(t10, t11);
1617
+ const t12 = align !== null ? `dropdown-menu-${align}` : null;
1618
+ let t13;
1619
+ if ($[5] !== className || $[6] !== t12 || $[7] !== visible) {
1620
+ t13 = classNames(["dropdown-menu", t12, {
1621
+ show: visible
1622
+ }, className]);
1623
+ $[5] = className;
1624
+ $[6] = t12;
1625
+ $[7] = visible;
1626
+ $[8] = t13;
1627
+ } else {
1628
+ t13 = $[8];
1629
+ }
1630
+ const t14 = align === "end" ? "100% 0px auto auto" : null;
1631
+ let t15;
1632
+ if ($[9] !== t14) {
1633
+ t15 = {
1634
+ inset: t14
1635
+ };
1636
+ $[9] = t14;
1637
+ $[10] = t15;
1638
+ } else {
1639
+ t15 = $[10];
1640
+ }
1641
+ let t16;
1642
+ if ($[11] !== children || $[12] !== itemClassName || $[13] !== items || $[14] !== onClickItem) {
1643
+ t16 = children !== null ? children : items.map((it, index) => {
1607
1644
  const {
1608
- // id = null,
1609
- type = 'link',
1610
- className: customClassName = null,
1611
- label = null,
1612
- children: itemChildren = null,
1613
- onClick: customOnClick = null,
1614
- active = false,
1645
+ type: t17,
1646
+ className: t18,
1647
+ label: t19,
1648
+ children: t20,
1649
+ onClick: t21,
1650
+ active: t22,
1615
1651
  ...itemProps
1616
1652
  } = it;
1617
- let ItemComponent = 'div';
1618
- if (type === 'link') {
1653
+ const type = t17 === undefined ? "link" : t17;
1654
+ const customClassName = t18 === undefined ? null : t18;
1655
+ const label = t19 === undefined ? null : t19;
1656
+ const itemChildren = t20 === undefined ? null : t20;
1657
+ const customOnClick = t21 === undefined ? null : t21;
1658
+ const active = t22 === undefined ? false : t22;
1659
+ let ItemComponent = "div";
1660
+ if (type === "link") {
1619
1661
  ItemComponent = Link;
1620
- } else if (type === 'button') {
1621
- ItemComponent = 'button';
1622
- } else if (type === 'header') {
1623
- ItemComponent = 'h6';
1624
- } else if (type === 'divider') {
1625
- ItemComponent = 'hr';
1662
+ } else {
1663
+ if (type === "button") {
1664
+ ItemComponent = "button";
1665
+ } else {
1666
+ if (type === "header") {
1667
+ ItemComponent = "h6";
1668
+ } else {
1669
+ if (type === "divider") {
1670
+ ItemComponent = "hr";
1671
+ }
1672
+ }
1673
+ }
1626
1674
  }
1627
- const finalOnClickItem = customOnClick !== null || type === 'link' && onClickItem !== null ? e_0 => {
1675
+ const finalOnClickItem = customOnClick !== null || type === "link" && onClickItem !== null ? e_0 => {
1628
1676
  if (customOnClick !== null) {
1629
1677
  customOnClick(e_0);
1630
1678
  }
1631
- if (type === 'link' && onClickItem !== null) {
1679
+ if (type === "link" && onClickItem !== null) {
1632
1680
  onClickItem(e_0);
1633
1681
  }
1634
1682
  } : null;
1635
1683
  return ItemComponent !== null ? /*#__PURE__*/jsx("div", {
1636
1684
  children: /*#__PURE__*/jsx(ItemComponent, {
1637
1685
  className: classNames([customClassName, itemClassName, {
1638
- 'dropdown-item': type === 'link' || type === 'button',
1639
- 'dropdown-divider': type === 'divider',
1640
- 'dropdown-header': type === 'header',
1686
+ "dropdown-item": type === "link" || type === "button",
1687
+ "dropdown-divider": type === "divider",
1688
+ "dropdown-header": type === "header",
1641
1689
  active
1642
1690
  }]),
1643
1691
  onClick: finalOnClickItem,
@@ -1647,8 +1695,31 @@ function Dropdown({
1647
1695
  }) : itemChildren
1648
1696
  })
1649
1697
  }, `item-${index + 1}-${label}-${type}`) : null;
1650
- })
1651
- });
1698
+ });
1699
+ $[11] = children;
1700
+ $[12] = itemClassName;
1701
+ $[13] = items;
1702
+ $[14] = onClickItem;
1703
+ $[15] = t16;
1704
+ } else {
1705
+ t16 = $[15];
1706
+ }
1707
+ let t17;
1708
+ if ($[16] !== t13 || $[17] !== t15 || $[18] !== t16) {
1709
+ t17 = /*#__PURE__*/jsx("div", {
1710
+ className: t13,
1711
+ style: t15,
1712
+ ref: containerRef,
1713
+ children: t16
1714
+ });
1715
+ $[16] = t13;
1716
+ $[17] = t15;
1717
+ $[18] = t16;
1718
+ $[19] = t17;
1719
+ } else {
1720
+ t17 = $[19];
1721
+ }
1722
+ return t17;
1652
1723
  }
1653
1724
 
1654
1725
  const emptyArray$4 = [];
@@ -1692,7 +1763,7 @@ function Menu(t0) {
1692
1763
  const dropdownAlign = t17 === undefined ? null : t17;
1693
1764
  let t18;
1694
1765
  if ($[0] !== items) {
1695
- t18 = items.map(_temp$7);
1766
+ t18 = items.map(_temp$9);
1696
1767
  $[0] = items;
1697
1768
  $[1] = t18;
1698
1769
  } else {
@@ -1827,83 +1898,202 @@ function Menu(t0) {
1827
1898
  }
1828
1899
  return t20;
1829
1900
  }
1830
- function _temp$7() {
1901
+ function _temp$9() {
1831
1902
  return false;
1832
1903
  }
1833
1904
 
1834
- var styles$q = {"collapse":"micromag-core-menus-navbar-collapse"};
1905
+ var styles$g = {"collapse":"micromag-core-menus-navbar-collapse"};
1835
1906
 
1836
- /* eslint-disable react/jsx-props-no-spreading */
1837
- function Navbar({
1838
- brand = null,
1839
- brandLink = null,
1840
- breadcrumbs = null,
1841
- theme = null,
1842
- size = 'md',
1843
- compact = false,
1844
- noWrap = false,
1845
- withoutCollapse = false,
1846
- withoutCollapseToggle = false,
1847
- children = null,
1848
- className = null,
1849
- brandClassName = null,
1850
- breadCrumbsClassName = null,
1851
- collapseClassName = null
1852
- }) {
1907
+ function Navbar(t0) {
1908
+ const $ = c(45);
1909
+ const {
1910
+ brand: t1,
1911
+ brandLink: t2,
1912
+ breadcrumbs: t3,
1913
+ theme: t4,
1914
+ size: t5,
1915
+ compact: t6,
1916
+ noWrap: t7,
1917
+ withoutCollapse: t8,
1918
+ withoutCollapseToggle: t9,
1919
+ children: t10,
1920
+ className: t11,
1921
+ brandClassName: t12,
1922
+ breadCrumbsClassName: t13,
1923
+ collapseClassName: t14
1924
+ } = t0;
1925
+ const brand = t1 === undefined ? null : t1;
1926
+ const brandLink = t2 === undefined ? null : t2;
1927
+ const breadcrumbs = t3 === undefined ? null : t3;
1928
+ const theme = t4 === undefined ? null : t4;
1929
+ const size = t5 === undefined ? "md" : t5;
1930
+ const compact = t6 === undefined ? false : t6;
1931
+ const noWrap = t7 === undefined ? false : t7;
1932
+ const withoutCollapse = t8 === undefined ? false : t8;
1933
+ const withoutCollapseToggle = t9 === undefined ? false : t9;
1934
+ const children = t10 === undefined ? null : t10;
1935
+ const className = t11 === undefined ? null : t11;
1936
+ const brandClassName = t12 === undefined ? null : t12;
1937
+ const breadCrumbsClassName = t13 === undefined ? null : t13;
1938
+ const collapseClassName = t14 === undefined ? null : t14;
1853
1939
  const [menuVisible, setMenuVisible] = useState(false);
1854
- const onClickMenu = useCallback(() => setMenuVisible(!menuVisible), [setMenuVisible, menuVisible]);
1855
- return /*#__PURE__*/jsx("nav", {
1856
- className: classNames(['navbar', {
1857
- [`bg-${theme}`]: theme !== null,
1858
- [`navbar-${theme === 'light' ? 'light' : 'dark'}`]: theme !== null,
1859
- [`text-${theme === 'light' ? 'dark' : 'light'}`]: theme !== null,
1860
- [`navbar-expand-${size}`]: !withoutCollapse,
1861
- 'navbar-expand': withoutCollapse,
1862
- 'py-2': compact,
1863
- 'px-2': compact,
1864
- 'flex-nowrap': noWrap
1865
- }, className]),
1866
- children: /*#__PURE__*/jsxs("div", {
1867
- className: classNames(['container-fluid', {
1868
- 'px-0': compact
1940
+ let t15;
1941
+ if ($[0] !== menuVisible) {
1942
+ t15 = () => setMenuVisible(!menuVisible);
1943
+ $[0] = menuVisible;
1944
+ $[1] = t15;
1945
+ } else {
1946
+ t15 = $[1];
1947
+ }
1948
+ const onClickMenu = t15;
1949
+ const t16 = theme !== null ? `bg-${theme}` : "bg-body";
1950
+ const t17 = theme !== null ? `text-${theme === "dark" ? "light" : "dark"}` : null;
1951
+ const t18 = !withoutCollapse ? `navbar-expand-${size}` : null;
1952
+ let t19;
1953
+ if ($[2] !== className || $[3] !== compact || $[4] !== noWrap || $[5] !== t16 || $[6] !== t17 || $[7] !== t18 || $[8] !== withoutCollapse) {
1954
+ t19 = classNames(["navbar", t16, t17, t18, {
1955
+ "navbar-expand": withoutCollapse,
1956
+ "py-2": compact,
1957
+ "px-2": compact,
1958
+ "flex-nowrap": noWrap
1959
+ }, className]);
1960
+ $[2] = className;
1961
+ $[3] = compact;
1962
+ $[4] = noWrap;
1963
+ $[5] = t16;
1964
+ $[6] = t17;
1965
+ $[7] = t18;
1966
+ $[8] = withoutCollapse;
1967
+ $[9] = t19;
1968
+ } else {
1969
+ t19 = $[9];
1970
+ }
1971
+ let t20;
1972
+ if ($[10] !== compact) {
1973
+ t20 = classNames(["container-fluid", {
1974
+ "px-0": compact
1975
+ }]);
1976
+ $[10] = compact;
1977
+ $[11] = t20;
1978
+ } else {
1979
+ t20 = $[11];
1980
+ }
1981
+ let t21;
1982
+ if ($[12] !== brand || $[13] !== brandClassName || $[14] !== brandLink || $[15] !== compact) {
1983
+ t21 = brand !== null && brandLink !== null ? /*#__PURE__*/jsx(Link, {
1984
+ className: classNames(["navbar-brand", brandClassName, {
1985
+ "py-0": compact
1869
1986
  }]),
1870
- children: [brand !== null && brandLink !== null ? /*#__PURE__*/jsx(Link, {
1871
- className: classNames(['navbar-brand', brandClassName, {
1872
- 'py-0': compact
1873
- }]),
1874
- href: brandLink,
1875
- children: brand
1876
- }) : null, brand !== null && brandLink === null ? /*#__PURE__*/jsx("span", {
1877
- className: classNames(['navbar-brand', brandClassName, {
1878
- 'py-0': compact
1879
- }]),
1880
- children: brand
1881
- }) : null, breadcrumbs !== null ? /*#__PURE__*/jsx("span", {
1882
- className: classNames(['navbar-breadcrumbs', breadCrumbsClassName, {
1883
- 'py-0': compact
1884
- }]),
1885
- children: breadcrumbs
1886
- }) : null, !withoutCollapse && !withoutCollapseToggle ? /*#__PURE__*/jsx(Button$1, {
1887
- className: "navbar-toggler",
1888
- onClick: onClickMenu,
1889
- withoutTheme: true,
1890
- "aria-controls": "navbarSupportedContent",
1891
- "aria-expanded": "false",
1892
- "aria-label": "Toggle navigation",
1893
- children: /*#__PURE__*/jsx("span", {
1894
- className: "navbar-toggler-icon"
1895
- })
1896
- }) : null, !withoutCollapse ? /*#__PURE__*/jsx("div", {
1897
- className: classNames(['navbar-collapse', 'collapse', styles$q.collapse, collapseClassName, {
1898
- show: menuVisible
1899
- }]),
1900
- children: children
1901
- }) : children]
1902
- })
1903
- });
1987
+ href: brandLink,
1988
+ children: brand
1989
+ }) : null;
1990
+ $[12] = brand;
1991
+ $[13] = brandClassName;
1992
+ $[14] = brandLink;
1993
+ $[15] = compact;
1994
+ $[16] = t21;
1995
+ } else {
1996
+ t21 = $[16];
1997
+ }
1998
+ let t22;
1999
+ if ($[17] !== brand || $[18] !== brandClassName || $[19] !== brandLink || $[20] !== compact) {
2000
+ t22 = brand !== null && brandLink === null ? /*#__PURE__*/jsx("span", {
2001
+ className: classNames(["navbar-brand", brandClassName, {
2002
+ "py-0": compact
2003
+ }]),
2004
+ children: brand
2005
+ }) : null;
2006
+ $[17] = brand;
2007
+ $[18] = brandClassName;
2008
+ $[19] = brandLink;
2009
+ $[20] = compact;
2010
+ $[21] = t22;
2011
+ } else {
2012
+ t22 = $[21];
2013
+ }
2014
+ let t23;
2015
+ if ($[22] !== breadCrumbsClassName || $[23] !== breadcrumbs || $[24] !== compact) {
2016
+ t23 = breadcrumbs !== null ? /*#__PURE__*/jsx("span", {
2017
+ className: classNames(["navbar-breadcrumbs", breadCrumbsClassName, {
2018
+ "py-0": compact
2019
+ }]),
2020
+ children: breadcrumbs
2021
+ }) : null;
2022
+ $[22] = breadCrumbsClassName;
2023
+ $[23] = breadcrumbs;
2024
+ $[24] = compact;
2025
+ $[25] = t23;
2026
+ } else {
2027
+ t23 = $[25];
2028
+ }
2029
+ let t24;
2030
+ if ($[26] !== onClickMenu || $[27] !== withoutCollapse || $[28] !== withoutCollapseToggle) {
2031
+ t24 = !withoutCollapse && !withoutCollapseToggle ? /*#__PURE__*/jsx(Button$1, {
2032
+ className: "navbar-toggler",
2033
+ onClick: onClickMenu,
2034
+ withoutTheme: true,
2035
+ "aria-controls": "navbarSupportedContent",
2036
+ "aria-expanded": "false",
2037
+ "aria-label": "Toggle navigation",
2038
+ children: /*#__PURE__*/jsx("span", {
2039
+ className: "navbar-toggler-icon"
2040
+ })
2041
+ }) : null;
2042
+ $[26] = onClickMenu;
2043
+ $[27] = withoutCollapse;
2044
+ $[28] = withoutCollapseToggle;
2045
+ $[29] = t24;
2046
+ } else {
2047
+ t24 = $[29];
2048
+ }
2049
+ let t25;
2050
+ if ($[30] !== children || $[31] !== collapseClassName || $[32] !== menuVisible || $[33] !== withoutCollapse) {
2051
+ t25 = !withoutCollapse ? /*#__PURE__*/jsx("div", {
2052
+ className: classNames(["navbar-collapse", "collapse", styles$g.collapse, collapseClassName, {
2053
+ show: menuVisible
2054
+ }]),
2055
+ children: children
2056
+ }) : children;
2057
+ $[30] = children;
2058
+ $[31] = collapseClassName;
2059
+ $[32] = menuVisible;
2060
+ $[33] = withoutCollapse;
2061
+ $[34] = t25;
2062
+ } else {
2063
+ t25 = $[34];
2064
+ }
2065
+ let t26;
2066
+ if ($[35] !== t20 || $[36] !== t21 || $[37] !== t22 || $[38] !== t23 || $[39] !== t24 || $[40] !== t25) {
2067
+ t26 = /*#__PURE__*/jsxs("div", {
2068
+ className: t20,
2069
+ children: [t21, t22, t23, t24, t25]
2070
+ });
2071
+ $[35] = t20;
2072
+ $[36] = t21;
2073
+ $[37] = t22;
2074
+ $[38] = t23;
2075
+ $[39] = t24;
2076
+ $[40] = t25;
2077
+ $[41] = t26;
2078
+ } else {
2079
+ t26 = $[41];
2080
+ }
2081
+ let t27;
2082
+ if ($[42] !== t19 || $[43] !== t26) {
2083
+ t27 = /*#__PURE__*/jsx("nav", {
2084
+ className: t19,
2085
+ children: t26
2086
+ });
2087
+ $[42] = t19;
2088
+ $[43] = t26;
2089
+ $[44] = t27;
2090
+ } else {
2091
+ t27 = $[44];
2092
+ }
2093
+ return t27;
1904
2094
  }
1905
2095
 
1906
- var styles$p = {"container":"micromag-core-menus-pagination-container"};
2096
+ var styles$f = {"container":"micromag-core-menus-pagination-container"};
1907
2097
 
1908
2098
  const messages = defineMessages({
1909
2099
  previous: {
@@ -1969,7 +2159,7 @@ function PaginationMenu(t0) {
1969
2159
  if ($[3] !== className || $[4] !== getUrl || $[5] !== itemClassName || $[6] !== lastPage || $[7] !== linkClassName || $[8] !== maxPages || $[9] !== onClickPage || $[10] !== page || $[11] !== paginationClassName || $[12] !== withPreviousNext) {
1970
2160
  const pageNumbers = Array.from({
1971
2161
  length: parseInt(lastPage, 10)
1972
- }, _temp$6);
2162
+ }, _temp$8);
1973
2163
  const stripPages = maxPages !== null && lastPage > maxPages;
1974
2164
  const startPage = stripPages ? Math.min(Math.max(page - maxPages / 2, 1), lastPage - maxPages) : null;
1975
2165
  const endPage = stripPages ? startPage + maxPages : null;
@@ -1984,7 +2174,7 @@ function PaginationMenu(t0) {
1984
2174
  }, []) : pageNumbers;
1985
2175
  const pages = strippedPages.length > 0 ? strippedPages : [1];
1986
2176
  if ($[17] !== className) {
1987
- t17 = classNames([styles$p.container, className]);
2177
+ t17 = classNames([styles$f.container, className]);
1988
2178
  $[17] = className;
1989
2179
  $[18] = t17;
1990
2180
  } else {
@@ -2124,11 +2314,11 @@ function PaginationMenu(t0) {
2124
2314
  }
2125
2315
  return t20;
2126
2316
  }
2127
- function _temp$6(_, i) {
2317
+ function _temp$8(_, i) {
2128
2318
  return i + 1;
2129
2319
  }
2130
2320
 
2131
- var styles$o = {"container":"micromag-core-menus-tabs-container"};
2321
+ var styles$e = {"container":"micromag-core-menus-tabs-container"};
2132
2322
 
2133
2323
  const emptyArray$3 = [];
2134
2324
  function TabsMenu(t0) {
@@ -2151,7 +2341,7 @@ function TabsMenu(t0) {
2151
2341
  const onClickItem = t7 === undefined ? null : t7;
2152
2342
  let t8;
2153
2343
  if ($[0] !== className) {
2154
- t8 = classNames([styles$o.container, className]);
2344
+ t8 = classNames([styles$e.container, className]);
2155
2345
  $[0] = className;
2156
2346
  $[1] = t8;
2157
2347
  } else {
@@ -2159,7 +2349,7 @@ function TabsMenu(t0) {
2159
2349
  }
2160
2350
  let t9;
2161
2351
  if ($[2] !== buttonClassName) {
2162
- t9 = classNames([styles$o.button, buttonClassName]);
2352
+ t9 = classNames([styles$e.button, buttonClassName]);
2163
2353
  $[2] = buttonClassName;
2164
2354
  $[3] = t9;
2165
2355
  } else {
@@ -2173,7 +2363,7 @@ function TabsMenu(t0) {
2173
2363
  theme: theme,
2174
2364
  renderButton: renderItemButton,
2175
2365
  onClickButton: onClickItem,
2176
- className: styles$o.buttons,
2366
+ className: styles$e.buttons,
2177
2367
  buttonClassName: t9
2178
2368
  });
2179
2369
  $[4] = items;
@@ -2201,80 +2391,211 @@ function TabsMenu(t0) {
2201
2391
  return t11;
2202
2392
  }
2203
2393
 
2204
- var styles$n = {"container":"micromag-core-modals-container","modals":"micromag-core-modals-modals","hasModals":"micromag-core-modals-hasModals"};
2205
-
2206
- function ModalsContainer(t0) {
2207
- const $ = c(12);
2394
+ const DashboardModal = /*#__PURE__*/React.lazy(() => import('@uppy/react').then(({
2395
+ DashboardModal: Component
2396
+ }) => ({
2397
+ default: Component
2398
+ })));
2399
+ function UploadModal(t0) {
2400
+ const $ = c(21);
2208
2401
  const {
2209
- modals,
2210
- setModalsContainer,
2211
- className: t1
2402
+ type: t1,
2403
+ opened: t2,
2404
+ sources: t3,
2405
+ onUploaded: t4,
2406
+ onRequestClose: t5
2212
2407
  } = t0;
2213
- const className = t1 === undefined ? null : t1;
2214
- const containerRef = useRef(null);
2215
- let t2;
2216
- if ($[0] !== setModalsContainer) {
2217
- t2 = () => {
2218
- setModalsContainer(containerRef.current);
2219
- };
2220
- $[0] = setModalsContainer;
2221
- $[1] = t2;
2408
+ const type = t1 === undefined ? null : t1;
2409
+ const opened = t2 === undefined ? false : t2;
2410
+ let t6;
2411
+ if ($[0] !== t3) {
2412
+ t6 = t3 === undefined ? ["webcam", "facebook", "instagram", "dropbox", "google-drive"] : t3;
2413
+ $[0] = t3;
2414
+ $[1] = t6;
2222
2415
  } else {
2223
- t2 = $[1];
2416
+ t6 = $[1];
2224
2417
  }
2225
- let t3;
2226
- if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
2227
- t3 = [];
2228
- $[2] = t3;
2418
+ const sources = t6;
2419
+ const onUploaded = t4 === undefined ? null : t4;
2420
+ const onRequestClose = t5 === undefined ? null : t5;
2421
+ let t7;
2422
+ if ($[2] !== onUploaded) {
2423
+ t7 = response => {
2424
+ if (onUploaded !== null) {
2425
+ onUploaded(response);
2426
+ }
2427
+ };
2428
+ $[2] = onUploaded;
2429
+ $[3] = t7;
2229
2430
  } else {
2230
- t3 = $[2];
2431
+ t7 = $[3];
2231
2432
  }
2232
- useEffect(t2, t3);
2233
- let t4;
2234
- if ($[3] !== className) {
2235
- t4 = classNames([styles$n.container, className]);
2236
- $[3] = className;
2237
- $[4] = t4;
2238
- } else {
2239
- t4 = $[4];
2433
+ const onUppyComplete = t7;
2434
+ let t8;
2435
+ bb0: {
2436
+ if (isArray(type)) {
2437
+ let t9;
2438
+ if ($[4] !== type) {
2439
+ t9 = type.map(_temp$7).filter(_temp2$1);
2440
+ $[4] = type;
2441
+ $[5] = t9;
2442
+ } else {
2443
+ t9 = $[5];
2444
+ }
2445
+ t8 = t9;
2446
+ break bb0;
2447
+ }
2448
+ let t9;
2449
+ if ($[6] !== type) {
2450
+ t9 = ["image", "video", "audio"].indexOf(type) !== -1 ? [`${type}/*`] : null;
2451
+ $[6] = type;
2452
+ $[7] = t9;
2453
+ } else {
2454
+ t9 = $[7];
2455
+ }
2456
+ t8 = t9;
2240
2457
  }
2241
- const t5 = modals.length > 0;
2242
- let t6;
2243
- if ($[5] !== t5) {
2244
- t6 = classNames([styles$n.modals, {
2245
- [styles$n.hasModals]: t5
2246
- }]);
2247
- $[5] = t5;
2248
- $[6] = t6;
2458
+ const fileTypes = t8;
2459
+ const t9 = fileTypes !== null && fileTypes.length > 0 ? fileTypes : null;
2460
+ let t10;
2461
+ if ($[8] !== onUppyComplete || $[9] !== sources || $[10] !== t9) {
2462
+ t10 = {
2463
+ onComplete: onUppyComplete,
2464
+ sources,
2465
+ allowedFileTypes: t9
2466
+ };
2467
+ $[8] = onUppyComplete;
2468
+ $[9] = sources;
2469
+ $[10] = t9;
2470
+ $[11] = t10;
2249
2471
  } else {
2250
- t6 = $[6];
2472
+ t10 = $[11];
2251
2473
  }
2252
- let t7;
2253
- if ($[7] !== t6) {
2254
- t7 = /*#__PURE__*/jsx("div", {
2255
- className: t6,
2256
- ref: containerRef
2257
- });
2258
- $[7] = t6;
2259
- $[8] = t7;
2474
+ const uppy = useUppy(t10);
2475
+ let t11;
2476
+ let t12;
2477
+ if ($[12] !== opened || $[13] !== uppy) {
2478
+ t11 = () => {
2479
+ if (uppy !== null && !opened) {
2480
+ uppy.cancelAll();
2481
+ }
2482
+ };
2483
+ t12 = [uppy, opened];
2484
+ $[12] = opened;
2485
+ $[13] = uppy;
2486
+ $[14] = t11;
2487
+ $[15] = t12;
2260
2488
  } else {
2261
- t7 = $[8];
2489
+ t11 = $[14];
2490
+ t12 = $[15];
2262
2491
  }
2263
- let t8;
2264
- if ($[9] !== t4 || $[10] !== t7) {
2265
- t8 = /*#__PURE__*/jsx("div", {
2266
- className: t4,
2267
- children: t7
2268
- });
2269
- $[9] = t4;
2270
- $[10] = t7;
2271
- $[11] = t8;
2492
+ useEffect(t11, t12);
2493
+ let t13;
2494
+ if ($[16] !== onRequestClose || $[17] !== opened || $[18] !== sources || $[19] !== uppy) {
2495
+ t13 = uppy !== null ? /*#__PURE__*/jsx(Suspense, {
2496
+ fallback: /*#__PURE__*/jsx("div", {}),
2497
+ children: /*#__PURE__*/jsx(DashboardModal, {
2498
+ uppy: uppy,
2499
+ open: opened,
2500
+ closeAfterFinish: true,
2501
+ onRequestClose: onRequestClose,
2502
+ plugins: sources
2503
+ })
2504
+ }) : null;
2505
+ $[16] = onRequestClose;
2506
+ $[17] = opened;
2507
+ $[18] = sources;
2508
+ $[19] = uppy;
2509
+ $[20] = t13;
2272
2510
  } else {
2273
- t8 = $[11];
2511
+ t13 = $[20];
2274
2512
  }
2275
- return t8;
2513
+ return t13;
2514
+ }
2515
+ function _temp2$1(t_0) {
2516
+ return t_0 !== null;
2517
+ }
2518
+ function _temp$7(t) {
2519
+ return ["image", "video", "audio"].indexOf(t) !== -1 ? `${t}/*` : null;
2520
+ }
2521
+
2522
+ var styles$d = {"container":"micromag-core-panels-container"};
2523
+
2524
+ const emptyArray$2 = [];
2525
+ function PanelsContainer(t0) {
2526
+ const $ = c(12);
2527
+ const {
2528
+ panels: t1,
2529
+ setPanelsContainer: t2,
2530
+ className: t3
2531
+ } = t0;
2532
+ const panels = t1 === undefined ? emptyArray$2 : t1;
2533
+ const setPanelsContainer = t2 === undefined ? null : t2;
2534
+ const className = t3 === undefined ? null : t3;
2535
+ const containerRef = useRef(null);
2536
+ let t4;
2537
+ if ($[0] !== setPanelsContainer) {
2538
+ t4 = () => {
2539
+ setPanelsContainer(containerRef.current);
2540
+ };
2541
+ $[0] = setPanelsContainer;
2542
+ $[1] = t4;
2543
+ } else {
2544
+ t4 = $[1];
2545
+ }
2546
+ let t5;
2547
+ if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
2548
+ t5 = [];
2549
+ $[2] = t5;
2550
+ } else {
2551
+ t5 = $[2];
2552
+ }
2553
+ useEffect(t4, t5);
2554
+ let t6;
2555
+ if ($[3] !== className) {
2556
+ t6 = classNames([styles$d.container, className]);
2557
+ $[3] = className;
2558
+ $[4] = t6;
2559
+ } else {
2560
+ t6 = $[4];
2561
+ }
2562
+ const t7 = panels.length > 0;
2563
+ let t8;
2564
+ if ($[5] !== t7) {
2565
+ t8 = classNames([styles$d.panels, {
2566
+ [styles$d.hasPanels]: t7
2567
+ }]);
2568
+ $[5] = t7;
2569
+ $[6] = t8;
2570
+ } else {
2571
+ t8 = $[6];
2572
+ }
2573
+ let t9;
2574
+ if ($[7] !== t8) {
2575
+ t9 = /*#__PURE__*/jsx("div", {
2576
+ className: t8,
2577
+ ref: containerRef
2578
+ });
2579
+ $[7] = t8;
2580
+ $[8] = t9;
2581
+ } else {
2582
+ t9 = $[8];
2583
+ }
2584
+ let t10;
2585
+ if ($[9] !== t6 || $[10] !== t9) {
2586
+ t10 = /*#__PURE__*/jsx("div", {
2587
+ className: t6,
2588
+ children: t9
2589
+ });
2590
+ $[9] = t6;
2591
+ $[10] = t9;
2592
+ $[11] = t10;
2593
+ } else {
2594
+ t10 = $[11];
2595
+ }
2596
+ return t10;
2276
2597
  }
2277
- var Modals = withModals(ModalsContainer);
2598
+ var Panels = withPanels(PanelsContainer);
2278
2599
 
2279
2600
  function ElementPortal(t0) {
2280
2601
  const $ = c(13);
@@ -2343,7 +2664,7 @@ function ElementPortal(t0) {
2343
2664
  return t10;
2344
2665
  }
2345
2666
 
2346
- function ModalPortal(t0) {
2667
+ function PanelPortal(t0) {
2347
2668
  const $ = c(7);
2348
2669
  const {
2349
2670
  id: t1,
@@ -2354,15 +2675,20 @@ function ModalPortal(t0) {
2354
2675
  const data = t2 === undefined ? null : t2;
2355
2676
  const children = t3 === undefined ? null : t3;
2356
2677
  const {
2678
+ panels: t4,
2357
2679
  container,
2358
- register: t4,
2359
- unregister: t5
2360
- } = useModals();
2361
- const register = t4 === undefined ? null : t4;
2362
- const unregister = t5 === undefined ? null : t5;
2363
- let t6;
2680
+ register: t5,
2681
+ unregister: t6
2682
+ } = usePanels();
2683
+ const panels = t4 === undefined ? null : t4;
2684
+ const register = t5 === undefined ? null : t5;
2685
+ const unregister = t6 === undefined ? null : t6;
2686
+ if (panels === null) {
2687
+ return children;
2688
+ }
2689
+ let t7;
2364
2690
  if ($[0] !== children || $[1] !== container || $[2] !== data || $[3] !== id || $[4] !== register || $[5] !== unregister) {
2365
- t6 = /*#__PURE__*/jsx(ElementPortal, {
2691
+ t7 = /*#__PURE__*/jsx(ElementPortal, {
2366
2692
  id: id,
2367
2693
  data: data,
2368
2694
  container: container,
@@ -2376,396 +2702,130 @@ function ModalPortal(t0) {
2376
2702
  $[3] = id;
2377
2703
  $[4] = register;
2378
2704
  $[5] = unregister;
2379
- $[6] = t6;
2705
+ $[6] = t7;
2380
2706
  } else {
2381
- t6 = $[6];
2707
+ t7 = $[6];
2382
2708
  }
2383
- return t6;
2709
+ return t7;
2384
2710
  }
2385
2711
 
2386
- var styles$m = {"container":"micromag-core-modals-modal-container","center":"micromag-core-modals-modal-center","inner":"micromag-core-modals-modal-inner","top":"micromag-core-modals-modal-top"};
2712
+ var styles$c = {"container":"micromag-core-panels-panel-container"};
2387
2713
 
2388
- function Modal(t0) {
2389
- const $ = c(18);
2714
+ function Panel(t0) {
2715
+ const $ = c(11);
2390
2716
  const {
2391
2717
  id: t1,
2392
2718
  children: t2,
2393
- position: t3,
2394
- title: t4
2719
+ title: t3
2395
2720
  } = t0;
2396
2721
  const id = t1 === undefined ? null : t1;
2397
2722
  const children = t2 === undefined ? null : t2;
2398
- const position = t3 === undefined ? "center" : t3;
2399
- const title = t4 === undefined ? null : t4;
2400
- let t5;
2723
+ const title = t3 === undefined ? null : t3;
2724
+ let t4;
2401
2725
  if ($[0] !== children.type || $[1] !== id) {
2402
- t5 = id || getDisplayName(children.type);
2726
+ t4 = id || getDisplayName(children.type);
2403
2727
  $[0] = children.type;
2404
2728
  $[1] = id;
2405
- $[2] = t5;
2729
+ $[2] = t4;
2406
2730
  } else {
2407
- t5 = $[2];
2731
+ t4 = $[2];
2408
2732
  }
2409
- const finalId = t5;
2410
- let t6;
2733
+ const finalId = t4;
2734
+ let t5;
2411
2735
  if ($[3] !== title) {
2412
- t6 = {
2736
+ t5 = {
2413
2737
  title
2414
2738
  };
2415
2739
  $[3] = title;
2416
- $[4] = t6;
2417
- } else {
2418
- t6 = $[4];
2419
- }
2420
- const data = t6;
2421
- const t7 = styles$m[position];
2422
- const t8 = position !== null;
2423
- let t9;
2424
- if ($[5] !== t7 || $[6] !== t8) {
2425
- t9 = classNames([styles$m.container, {
2426
- [t7]: t8
2427
- }]);
2428
- $[5] = t7;
2429
- $[6] = t8;
2430
- $[7] = t9;
2431
- } else {
2432
- t9 = $[7];
2433
- }
2434
- let t10;
2435
- if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
2436
- t10 = classNames([styles$m.inner, "bg-dark", "rounded"]);
2437
- $[8] = t10;
2740
+ $[4] = t5;
2438
2741
  } else {
2439
- t10 = $[8];
2742
+ t5 = $[4];
2440
2743
  }
2441
- let t11;
2442
- if ($[9] !== children) {
2443
- t11 = /*#__PURE__*/jsx("div", {
2444
- className: t10,
2744
+ const data = t5;
2745
+ let t6;
2746
+ if ($[5] !== children) {
2747
+ t6 = /*#__PURE__*/jsx("div", {
2748
+ className: styles$c.container,
2445
2749
  children: children
2446
2750
  });
2447
- $[9] = children;
2448
- $[10] = t11;
2449
- } else {
2450
- t11 = $[10];
2451
- }
2452
- let t12;
2453
- if ($[11] !== t11 || $[12] !== t9) {
2454
- t12 = /*#__PURE__*/jsx("div", {
2455
- className: t9,
2456
- children: t11
2457
- });
2458
- $[11] = t11;
2459
- $[12] = t9;
2460
- $[13] = t12;
2751
+ $[5] = children;
2752
+ $[6] = t6;
2461
2753
  } else {
2462
- t12 = $[13];
2754
+ t6 = $[6];
2463
2755
  }
2464
- let t13;
2465
- if ($[14] !== data || $[15] !== finalId || $[16] !== t12) {
2466
- t13 = /*#__PURE__*/jsx(ModalPortal, {
2756
+ let t7;
2757
+ if ($[7] !== data || $[8] !== finalId || $[9] !== t6) {
2758
+ t7 = /*#__PURE__*/jsx(PanelPortal, {
2467
2759
  id: finalId,
2468
2760
  data: data,
2469
- children: t12
2761
+ children: t6
2470
2762
  });
2471
- $[14] = data;
2472
- $[15] = finalId;
2473
- $[16] = t12;
2474
- $[17] = t13;
2763
+ $[7] = data;
2764
+ $[8] = finalId;
2765
+ $[9] = t6;
2766
+ $[10] = t7;
2475
2767
  } else {
2476
- t13 = $[17];
2768
+ t7 = $[10];
2477
2769
  }
2478
- return t13;
2479
- }
2480
-
2481
- var styles$l = {"container":"micromag-core-modals-dialog-container"};
2482
-
2483
- /* eslint-disable react/no-array-index-key, react/jsx-props-no-spreading */
2484
- function ModalDialog({
2485
- title = null,
2486
- header = null,
2487
- children = null,
2488
- buttons = null,
2489
- footer = null,
2490
- size = null,
2491
- onClose = null,
2492
- className = null,
2493
- bodyClassName = null
2494
- }) {
2495
- return /*#__PURE__*/jsx("div", {
2496
- className: classNames([styles$l.container, 'modal-dialog', className, {
2497
- [`modal-${size}`]: size !== null
2498
- }]),
2499
- role: "dialog",
2500
- children: /*#__PURE__*/jsxs("div", {
2501
- className: "modal-content",
2502
- children: [header || /*#__PURE__*/jsxs("div", {
2503
- className: classNames(['modal-header', 'p-2', 'd-flex', 'justify-content-between', styles$l.header]),
2504
- children: [/*#__PURE__*/jsx("h5", {
2505
- className: "modal-title",
2506
- children: /*#__PURE__*/jsx(Label, {
2507
- children: title
2508
- })
2509
- }), /*#__PURE__*/jsx("button", {
2510
- type: "button",
2511
- className: "btn btn-close p-2",
2512
- "aria-label": "Close",
2513
- onClick: onClose
2514
- })]
2515
- }), /*#__PURE__*/jsx("div", {
2516
- className: classNames(['modal-body', 'p-2', bodyClassName]),
2517
- children: children
2518
- }), footer !== null || buttons !== null ? /*#__PURE__*/jsxs("div", {
2519
- className: classNames(['modal-footer', 'p-2', styles$l.footer]),
2520
- children: [footer, buttons !== null ? /*#__PURE__*/jsx(Buttons, {
2521
- buttons: buttons,
2522
- className: styles$l.buttons
2523
- }) : null]
2524
- }) : null]
2525
- })
2526
- });
2770
+ return t7;
2527
2771
  }
2528
2772
 
2529
- var styles$k = {"container":"micromag-core-panels-container"};
2773
+ var styles$b = {"container":"micromag-core-partials-collapsable-panel-container","top":"micromag-core-partials-collapsable-panel-top","button":"micromag-core-partials-collapsable-panel-button","label":"micromag-core-partials-collapsable-panel-label","content":"micromag-core-partials-collapsable-panel-content","isOpened":"micromag-core-partials-collapsable-panel-isOpened"};
2530
2774
 
2531
- const emptyArray$2 = [];
2532
- function PanelsContainer(t0) {
2533
- const $ = c(12);
2775
+ function CollapsablePanel(t0) {
2776
+ const $ = c(30);
2534
2777
  const {
2535
- panels: t1,
2536
- setPanelsContainer: t2,
2537
- className: t3
2778
+ title: t1,
2779
+ children: t2,
2780
+ className: t3,
2781
+ topClassName: t4,
2782
+ contentClassName: t5,
2783
+ openedClassName: t6,
2784
+ buttonClassName: t7
2538
2785
  } = t0;
2539
- const panels = t1 === undefined ? emptyArray$2 : t1;
2540
- const setPanelsContainer = t2 === undefined ? null : t2;
2786
+ const title = t1 === undefined ? null : t1;
2787
+ const children = t2 === undefined ? null : t2;
2541
2788
  const className = t3 === undefined ? null : t3;
2542
- const containerRef = useRef(null);
2543
- let t4;
2544
- if ($[0] !== setPanelsContainer) {
2545
- t4 = () => {
2546
- setPanelsContainer(containerRef.current);
2547
- };
2548
- $[0] = setPanelsContainer;
2549
- $[1] = t4;
2789
+ const topClassName = t4 === undefined ? null : t4;
2790
+ const contentClassName = t5 === undefined ? null : t5;
2791
+ const openedClassName = t6 === undefined ? null : t6;
2792
+ const buttonClassName = t7 === undefined ? null : t7;
2793
+ const [opened, setOpened] = useState(false);
2794
+ let t8;
2795
+ if ($[0] !== opened) {
2796
+ t8 = () => setOpened(!opened);
2797
+ $[0] = opened;
2798
+ $[1] = t8;
2550
2799
  } else {
2551
- t4 = $[1];
2800
+ t8 = $[1];
2552
2801
  }
2553
- let t5;
2554
- if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
2555
- t5 = [];
2556
- $[2] = t5;
2802
+ const onClick = t8;
2803
+ const t9 = opened && openedClassName !== null;
2804
+ let t10;
2805
+ if ($[2] !== className || $[3] !== opened || $[4] !== openedClassName || $[5] !== t9) {
2806
+ t10 = classNames([styles$b.container, className, {
2807
+ [styles$b.isOpened]: opened,
2808
+ [openedClassName]: t9
2809
+ }]);
2810
+ $[2] = className;
2811
+ $[3] = opened;
2812
+ $[4] = openedClassName;
2813
+ $[5] = t9;
2814
+ $[6] = t10;
2557
2815
  } else {
2558
- t5 = $[2];
2816
+ t10 = $[6];
2559
2817
  }
2560
- useEffect(t4, t5);
2561
- let t6;
2562
- if ($[3] !== className) {
2563
- t6 = classNames([styles$k.container, className]);
2564
- $[3] = className;
2565
- $[4] = t6;
2818
+ let t11;
2819
+ if ($[7] !== topClassName) {
2820
+ t11 = classNames([styles$b.top, topClassName]);
2821
+ $[7] = topClassName;
2822
+ $[8] = t11;
2566
2823
  } else {
2567
- t6 = $[4];
2568
- }
2569
- const t7 = panels.length > 0;
2570
- let t8;
2571
- if ($[5] !== t7) {
2572
- t8 = classNames([styles$k.panels, {
2573
- [styles$k.hasPanels]: t7
2574
- }]);
2575
- $[5] = t7;
2576
- $[6] = t8;
2577
- } else {
2578
- t8 = $[6];
2579
- }
2580
- let t9;
2581
- if ($[7] !== t8) {
2582
- t9 = /*#__PURE__*/jsx("div", {
2583
- className: t8,
2584
- ref: containerRef
2585
- });
2586
- $[7] = t8;
2587
- $[8] = t9;
2588
- } else {
2589
- t9 = $[8];
2590
- }
2591
- let t10;
2592
- if ($[9] !== t6 || $[10] !== t9) {
2593
- t10 = /*#__PURE__*/jsx("div", {
2594
- className: t6,
2595
- children: t9
2596
- });
2597
- $[9] = t6;
2598
- $[10] = t9;
2599
- $[11] = t10;
2600
- } else {
2601
- t10 = $[11];
2602
- }
2603
- return t10;
2604
- }
2605
- var Panels = withPanels(PanelsContainer);
2606
-
2607
- function PanelPortal(t0) {
2608
- const $ = c(7);
2609
- const {
2610
- id: t1,
2611
- data: t2,
2612
- children: t3
2613
- } = t0;
2614
- const id = t1 === undefined ? null : t1;
2615
- const data = t2 === undefined ? null : t2;
2616
- const children = t3 === undefined ? null : t3;
2617
- const {
2618
- panels: t4,
2619
- container,
2620
- register: t5,
2621
- unregister: t6
2622
- } = usePanels();
2623
- const panels = t4 === undefined ? null : t4;
2624
- const register = t5 === undefined ? null : t5;
2625
- const unregister = t6 === undefined ? null : t6;
2626
- if (panels === null) {
2627
- return children;
2628
- }
2629
- let t7;
2630
- if ($[0] !== children || $[1] !== container || $[2] !== data || $[3] !== id || $[4] !== register || $[5] !== unregister) {
2631
- t7 = /*#__PURE__*/jsx(ElementPortal, {
2632
- id: id,
2633
- data: data,
2634
- container: container,
2635
- register: register,
2636
- unregister: unregister,
2637
- children: children
2638
- });
2639
- $[0] = children;
2640
- $[1] = container;
2641
- $[2] = data;
2642
- $[3] = id;
2643
- $[4] = register;
2644
- $[5] = unregister;
2645
- $[6] = t7;
2646
- } else {
2647
- t7 = $[6];
2648
- }
2649
- return t7;
2650
- }
2651
-
2652
- var styles$j = {"container":"micromag-core-panels-panel-container"};
2653
-
2654
- function Panel(t0) {
2655
- const $ = c(11);
2656
- const {
2657
- id: t1,
2658
- children: t2,
2659
- title: t3
2660
- } = t0;
2661
- const id = t1 === undefined ? null : t1;
2662
- const children = t2 === undefined ? null : t2;
2663
- const title = t3 === undefined ? null : t3;
2664
- let t4;
2665
- if ($[0] !== children.type || $[1] !== id) {
2666
- t4 = id || getDisplayName(children.type);
2667
- $[0] = children.type;
2668
- $[1] = id;
2669
- $[2] = t4;
2670
- } else {
2671
- t4 = $[2];
2672
- }
2673
- const finalId = t4;
2674
- let t5;
2675
- if ($[3] !== title) {
2676
- t5 = {
2677
- title
2678
- };
2679
- $[3] = title;
2680
- $[4] = t5;
2681
- } else {
2682
- t5 = $[4];
2683
- }
2684
- const data = t5;
2685
- let t6;
2686
- if ($[5] !== children) {
2687
- t6 = /*#__PURE__*/jsx("div", {
2688
- className: styles$j.container,
2689
- children: children
2690
- });
2691
- $[5] = children;
2692
- $[6] = t6;
2693
- } else {
2694
- t6 = $[6];
2695
- }
2696
- let t7;
2697
- if ($[7] !== data || $[8] !== finalId || $[9] !== t6) {
2698
- t7 = /*#__PURE__*/jsx(PanelPortal, {
2699
- id: finalId,
2700
- data: data,
2701
- children: t6
2702
- });
2703
- $[7] = data;
2704
- $[8] = finalId;
2705
- $[9] = t6;
2706
- $[10] = t7;
2707
- } else {
2708
- t7 = $[10];
2709
- }
2710
- return t7;
2711
- }
2712
-
2713
- var styles$i = {"container":"micromag-core-partials-collapsable-panel-container","top":"micromag-core-partials-collapsable-panel-top","button":"micromag-core-partials-collapsable-panel-button","label":"micromag-core-partials-collapsable-panel-label","content":"micromag-core-partials-collapsable-panel-content","isOpened":"micromag-core-partials-collapsable-panel-isOpened"};
2714
-
2715
- function CollapsablePanel(t0) {
2716
- const $ = c(30);
2717
- const {
2718
- title: t1,
2719
- children: t2,
2720
- className: t3,
2721
- topClassName: t4,
2722
- contentClassName: t5,
2723
- openedClassName: t6,
2724
- buttonClassName: t7
2725
- } = t0;
2726
- const title = t1 === undefined ? null : t1;
2727
- const children = t2 === undefined ? null : t2;
2728
- const className = t3 === undefined ? null : t3;
2729
- const topClassName = t4 === undefined ? null : t4;
2730
- const contentClassName = t5 === undefined ? null : t5;
2731
- const openedClassName = t6 === undefined ? null : t6;
2732
- const buttonClassName = t7 === undefined ? null : t7;
2733
- const [opened, setOpened] = useState(false);
2734
- let t8;
2735
- if ($[0] !== opened) {
2736
- t8 = () => setOpened(!opened);
2737
- $[0] = opened;
2738
- $[1] = t8;
2739
- } else {
2740
- t8 = $[1];
2741
- }
2742
- const onClick = t8;
2743
- const t9 = opened && openedClassName !== null;
2744
- let t10;
2745
- if ($[2] !== className || $[3] !== opened || $[4] !== openedClassName || $[5] !== t9) {
2746
- t10 = classNames([styles$i.container, className, {
2747
- [styles$i.isOpened]: opened,
2748
- [openedClassName]: t9
2749
- }]);
2750
- $[2] = className;
2751
- $[3] = opened;
2752
- $[4] = openedClassName;
2753
- $[5] = t9;
2754
- $[6] = t10;
2755
- } else {
2756
- t10 = $[6];
2757
- }
2758
- let t11;
2759
- if ($[7] !== topClassName) {
2760
- t11 = classNames([styles$i.top, topClassName]);
2761
- $[7] = topClassName;
2762
- $[8] = t11;
2763
- } else {
2764
- t11 = $[8];
2824
+ t11 = $[8];
2765
2825
  }
2766
2826
  let t12;
2767
2827
  if ($[9] !== buttonClassName) {
2768
- t12 = classNames([styles$i.button, buttonClassName]);
2828
+ t12 = classNames([styles$b.button, buttonClassName]);
2769
2829
  $[9] = buttonClassName;
2770
2830
  $[10] = t12;
2771
2831
  } else {
@@ -2776,7 +2836,7 @@ function CollapsablePanel(t0) {
2776
2836
  if ($[11] !== t13) {
2777
2837
  t14 = /*#__PURE__*/jsx(FontAwesomeIcon, {
2778
2838
  icon: t13,
2779
- className: styles$i.icon
2839
+ className: styles$b.icon
2780
2840
  });
2781
2841
  $[11] = t13;
2782
2842
  $[12] = t14;
@@ -2790,7 +2850,7 @@ function CollapsablePanel(t0) {
2790
2850
  className: t12,
2791
2851
  icon: t14,
2792
2852
  iconPosition: "right",
2793
- labelClassName: styles$i.label,
2853
+ labelClassName: styles$b.label,
2794
2854
  onClick: onClick,
2795
2855
  children: title
2796
2856
  });
@@ -2816,7 +2876,7 @@ function CollapsablePanel(t0) {
2816
2876
  }
2817
2877
  let t17;
2818
2878
  if ($[21] !== contentClassName) {
2819
- t17 = classNames([styles$i.content, contentClassName]);
2879
+ t17 = classNames([styles$b.content, contentClassName]);
2820
2880
  $[21] = contentClassName;
2821
2881
  $[22] = t17;
2822
2882
  } else {
@@ -3065,84 +3125,97 @@ function Detector({
3065
3125
  });
3066
3126
  }
3067
3127
 
3068
- var styles$h = {"container":"micromag-core-partials-placeholder-block-container","outline":"micromag-core-partials-placeholder-block-outline","withInvertedColors":"micromag-core-partials-placeholder-block-withInvertedColors","box":"micromag-core-partials-placeholder-block-box"};
3069
-
3070
3128
  function PlaceholderBlock(t0) {
3071
- const $ = c(16);
3129
+ const $ = c(17);
3072
3130
  const {
3073
3131
  width: t1,
3074
3132
  height: t2,
3075
3133
  outline: t3,
3076
3134
  className: t4,
3077
3135
  boxClassName: t5,
3078
- withInvertedColors: t6,
3079
- children: t7
3136
+ children: t6
3080
3137
  } = t0;
3081
3138
  const width = t1 === undefined ? "100%" : t1;
3082
- const height = t2 === undefined ? "3em" : t2;
3139
+ const height = t2 === undefined ? null : t2;
3083
3140
  const outline = t3 === undefined ? false : t3;
3084
3141
  const className = t4 === undefined ? null : t4;
3085
3142
  const boxClassName = t5 === undefined ? null : t5;
3086
- const withInvertedColors = t6 === undefined ? true : t6;
3087
- const children = t7 === undefined ? null : t7;
3088
- let t8;
3089
- if ($[0] !== className || $[1] !== outline || $[2] !== withInvertedColors) {
3090
- t8 = classNames([styles$h.container, className, {
3091
- [styles$h.outline]: outline,
3092
- [styles$h.withInvertedColors]: withInvertedColors
3093
- }]);
3143
+ const children = t6 === undefined ? null : t6;
3144
+ let t7;
3145
+ if ($[0] !== className || $[1] !== outline) {
3146
+ t7 = classNames([{
3147
+ border: outline,
3148
+ "border-2": outline
3149
+ }, className]);
3094
3150
  $[0] = className;
3095
3151
  $[1] = outline;
3096
- $[2] = withInvertedColors;
3152
+ $[2] = t7;
3153
+ } else {
3154
+ t7 = $[2];
3155
+ }
3156
+ let t8;
3157
+ if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
3158
+ t8 = {
3159
+ "--bs-border-color": "currentColor",
3160
+ borderColor: "currentColor"
3161
+ };
3097
3162
  $[3] = t8;
3098
3163
  } else {
3099
3164
  t8 = $[3];
3100
3165
  }
3101
3166
  let t9;
3102
- if ($[4] !== boxClassName) {
3103
- t9 = classNames([styles$h.box, boxClassName]);
3167
+ if ($[4] !== boxClassName || $[5] !== outline) {
3168
+ t9 = classNames([{
3169
+ "d-flex": outline,
3170
+ "align-items-center": outline,
3171
+ "justify-content-center": outline,
3172
+ "w-100": outline,
3173
+ "p-2": outline
3174
+ }, boxClassName]);
3104
3175
  $[4] = boxClassName;
3105
- $[5] = t9;
3176
+ $[5] = outline;
3177
+ $[6] = t9;
3106
3178
  } else {
3107
- t9 = $[5];
3179
+ t9 = $[6];
3108
3180
  }
3109
3181
  let t10;
3110
- if ($[6] !== height || $[7] !== width) {
3182
+ if ($[7] !== height || $[8] !== width) {
3111
3183
  t10 = {
3112
3184
  width,
3113
3185
  height
3114
3186
  };
3115
- $[6] = height;
3116
- $[7] = width;
3117
- $[8] = t10;
3187
+ $[7] = height;
3188
+ $[8] = width;
3189
+ $[9] = t10;
3118
3190
  } else {
3119
- t10 = $[8];
3191
+ t10 = $[9];
3120
3192
  }
3121
3193
  let t11;
3122
- if ($[9] !== children || $[10] !== t10 || $[11] !== t9) {
3194
+ if ($[10] !== children || $[11] !== t10 || $[12] !== t9) {
3123
3195
  t11 = /*#__PURE__*/jsx("div", {
3124
3196
  className: t9,
3125
3197
  style: t10,
3126
3198
  children: children
3127
3199
  });
3128
- $[9] = children;
3129
- $[10] = t10;
3130
- $[11] = t9;
3131
- $[12] = t11;
3200
+ $[10] = children;
3201
+ $[11] = t10;
3202
+ $[12] = t9;
3203
+ $[13] = t11;
3132
3204
  } else {
3133
- t11 = $[12];
3205
+ t11 = $[13];
3134
3206
  }
3135
3207
  let t12;
3136
- if ($[13] !== t11 || $[14] !== t8) {
3208
+ if ($[14] !== t11 || $[15] !== t7) {
3137
3209
  t12 = /*#__PURE__*/jsx("div", {
3138
- className: t8,
3210
+ className: t7,
3211
+ style: t8,
3139
3212
  children: t11
3140
3213
  });
3141
- $[13] = t11;
3142
- $[14] = t8;
3143
- $[15] = t12;
3214
+ $[14] = t11;
3215
+ $[15] = t7;
3216
+ $[16] = t12;
3144
3217
  } else {
3145
- t12 = $[15];
3218
+ t12 = $[16];
3146
3219
  }
3147
3220
  return t12;
3148
3221
  }
@@ -3198,59 +3271,55 @@ function ElementComponent(t0) {
3198
3271
  return t5;
3199
3272
  }
3200
3273
 
3201
- var styles$g = {"container":"micromag-core-partials-empty-container","middle":"micromag-core-partials-empty-middle","withoutBorder":"micromag-core-partials-empty-withoutBorder"};
3274
+ var styles$a = {"container":"micromag-core-partials-empty-container","middle":"micromag-core-partials-empty-middle","withoutBorder":"micromag-core-partials-empty-withoutBorder"};
3202
3275
 
3203
3276
  function Empty(t0) {
3204
- const $ = c(9);
3277
+ const $ = c(8);
3205
3278
  const {
3206
3279
  children: t1,
3207
3280
  withoutBorder: t2,
3208
- light: t3,
3209
- className: t4
3281
+ className: t3
3210
3282
  } = t0;
3211
3283
  const children = t1 === undefined ? null : t1;
3212
3284
  const withoutBorder = t2 === undefined ? false : t2;
3213
- const light = t3 === undefined ? false : t3;
3214
- const className = t4 === undefined ? null : t4;
3215
- let t5;
3216
- if ($[0] !== className || $[1] !== light || $[2] !== withoutBorder) {
3217
- t5 = classNames([styles$g.container, className, {
3218
- [styles$g.withoutBorder]: withoutBorder,
3219
- [styles$g.light]: light
3285
+ const className = t3 === undefined ? null : t3;
3286
+ let t4;
3287
+ if ($[0] !== className || $[1] !== withoutBorder) {
3288
+ t4 = classNames([styles$a.container, className, {
3289
+ [styles$a.withoutBorder]: withoutBorder
3220
3290
  }]);
3221
3291
  $[0] = className;
3222
- $[1] = light;
3223
- $[2] = withoutBorder;
3224
- $[3] = t5;
3292
+ $[1] = withoutBorder;
3293
+ $[2] = t4;
3225
3294
  } else {
3226
- t5 = $[3];
3295
+ t4 = $[2];
3227
3296
  }
3228
- let t6;
3229
- if ($[4] !== children) {
3230
- t6 = /*#__PURE__*/jsx("div", {
3231
- className: styles$g.middle,
3297
+ let t5;
3298
+ if ($[3] !== children) {
3299
+ t5 = /*#__PURE__*/jsx("div", {
3300
+ className: styles$a.middle,
3232
3301
  children: /*#__PURE__*/jsx(Label, {
3233
3302
  children: children
3234
3303
  })
3235
3304
  });
3236
- $[4] = children;
3237
- $[5] = t6;
3305
+ $[3] = children;
3306
+ $[4] = t5;
3238
3307
  } else {
3239
- t6 = $[5];
3308
+ t5 = $[4];
3240
3309
  }
3241
- let t7;
3242
- if ($[6] !== t5 || $[7] !== t6) {
3243
- t7 = /*#__PURE__*/jsx("div", {
3244
- className: t5,
3245
- children: t6
3246
- });
3247
- $[6] = t5;
3310
+ let t6;
3311
+ if ($[5] !== t4 || $[6] !== t5) {
3312
+ t6 = /*#__PURE__*/jsx("div", {
3313
+ className: t4,
3314
+ children: t5
3315
+ });
3316
+ $[5] = t4;
3317
+ $[6] = t5;
3248
3318
  $[7] = t6;
3249
- $[8] = t7;
3250
3319
  } else {
3251
- t7 = $[8];
3320
+ t6 = $[7];
3252
3321
  }
3253
- return t7;
3322
+ return t6;
3254
3323
  }
3255
3324
 
3256
3325
  const emptyArray$1 = [];
@@ -3298,7 +3367,7 @@ function FontFaces(t0) {
3298
3367
  const formats = t2 === undefined ? defaultFormats : t2;
3299
3368
  let t3;
3300
3369
  if ($[0] !== fonts || $[1] !== formats) {
3301
- const fontFaces = (fonts || []).filter(_temp$5).reduce((fontFontFaces, t4) => {
3370
+ const fontFaces = (fonts || []).filter(_temp$6).reduce((fontFontFaces, t4) => {
3302
3371
  const {
3303
3372
  name: t5,
3304
3373
  media: t6,
@@ -3363,11 +3432,11 @@ function FontFaces(t0) {
3363
3432
  function _temp2(it_1) {
3364
3433
  return it_1 !== null;
3365
3434
  }
3366
- function _temp$5(it) {
3435
+ function _temp$6(it) {
3367
3436
  return isObject(it) && it.type === "custom" && (it.media || null) !== null;
3368
3437
  }
3369
3438
 
3370
- var styles$f = {"container":"micromag-core-partials-media-container"};
3439
+ var styles$9 = {"container":"micromag-core-partials-media-container"};
3371
3440
 
3372
3441
  function Media(t0) {
3373
3442
  const $ = c(16);
@@ -3391,7 +3460,7 @@ function Media(t0) {
3391
3460
  const titleClassName = t8 === undefined ? null : t8;
3392
3461
  let t9;
3393
3462
  if ($[0] !== className) {
3394
- t9 = classNames(["card", styles$f.container, className]);
3463
+ t9 = classNames(["card", styles$9.container, className]);
3395
3464
  $[0] = className;
3396
3465
  $[1] = t9;
3397
3466
  } else {
@@ -3402,7 +3471,7 @@ function Media(t0) {
3402
3471
  t10 = typeof thumbnail === "string" ? /*#__PURE__*/jsx("img", {
3403
3472
  src: thumbnail,
3404
3473
  alt: title,
3405
- className: classNames(["me-3", styles$f.thumbnail, thumbnailClassName, {
3474
+ className: classNames(["me-3", styles$9.thumbnail, thumbnailClassName, {
3406
3475
  "align-self-start": thumbnailAlign === "top",
3407
3476
  "align-self-center": thumbnailAlign === "center",
3408
3477
  "align-self-end": thumbnailAlign === "bottom"
@@ -3419,9 +3488,9 @@ function Media(t0) {
3419
3488
  let t11;
3420
3489
  if ($[7] !== bodyClassName || $[8] !== children || $[9] !== title || $[10] !== titleClassName) {
3421
3490
  t11 = title !== null || children !== null ? /*#__PURE__*/jsxs("div", {
3422
- className: classNames(["card-body", styles$f.body, bodyClassName]),
3491
+ className: classNames(["card-body", styles$9.body, bodyClassName]),
3423
3492
  children: [title !== null ? /*#__PURE__*/jsx("h5", {
3424
- className: classNames(["mt-0", "text-truncate", styles$f.title, titleClassName]),
3493
+ className: classNames(["mt-0", "text-truncate", styles$9.title, titleClassName]),
3425
3494
  children: /*#__PURE__*/jsx(Label, {
3426
3495
  children: title
3427
3496
  })
@@ -3770,7 +3839,7 @@ function Meta(t0) {
3770
3839
  }
3771
3840
  let t48;
3772
3841
  if ($[50] !== t47) {
3773
- t48 = t47.map(_temp$4);
3842
+ t48 = t47.map(_temp$5);
3774
3843
  $[50] = t47;
3775
3844
  $[51] = t48;
3776
3845
  } else {
@@ -3809,7 +3878,7 @@ function Meta(t0) {
3809
3878
  }
3810
3879
  return t49;
3811
3880
  }
3812
- function _temp$4(it) {
3881
+ function _temp$5(it) {
3813
3882
  return /*#__PURE__*/jsx("script", {
3814
3883
  type: "application/ld+json",
3815
3884
  id: `${it["@type"]}-${it.identifier}`,
@@ -3818,7 +3887,7 @@ function _temp$4(it) {
3818
3887
  }, `microformat-${it["@type"]}-${it.identifier}`);
3819
3888
  }
3820
3889
 
3821
- var styles$e = {"container":"micromag-core-partials-slideshow-container","items":"micromag-core-partials-slideshow-items","item":"micromag-core-partials-slideshow-item","prev":"micromag-core-partials-slideshow-prev","current":"micromag-core-partials-slideshow-current","next":"micromag-core-partials-slideshow-next"};
3890
+ var styles$8 = {"container":"micromag-core-partials-slideshow-container","items":"micromag-core-partials-slideshow-items","item":"micromag-core-partials-slideshow-item","prev":"micromag-core-partials-slideshow-prev","current":"micromag-core-partials-slideshow-current","next":"micromag-core-partials-slideshow-next"};
3822
3891
 
3823
3892
  const emptyArray = [];
3824
3893
  function Slideshow(t0) {
@@ -3847,7 +3916,7 @@ function Slideshow(t0) {
3847
3916
  if (auto) {
3848
3917
  id = setTimeout(() => {
3849
3918
  if (index < items.length - 1) {
3850
- setIndex(_temp$3);
3919
+ setIndex(_temp$4);
3851
3920
  } else {
3852
3921
  setIndex(0);
3853
3922
  }
@@ -3892,7 +3961,7 @@ function Slideshow(t0) {
3892
3961
  const style = t10;
3893
3962
  let t11;
3894
3963
  if ($[13] !== className) {
3895
- t11 = classNames([styles$e.container, className]);
3964
+ t11 = classNames([styles$8.container, className]);
3896
3965
  $[13] = className;
3897
3966
  $[14] = t11;
3898
3967
  } else {
@@ -3903,10 +3972,10 @@ function Slideshow(t0) {
3903
3972
  let t13;
3904
3973
  if ($[18] !== index) {
3905
3974
  t13 = (it, i_0) => /*#__PURE__*/jsx("div", {
3906
- className: classNames([styles$e.item, {
3907
- [styles$e.prev]: i_0 < index,
3908
- [styles$e.current]: i_0 === index,
3909
- [styles$e.next]: i_0 > index
3975
+ className: classNames([styles$8.item, {
3976
+ [styles$8.prev]: i_0 < index,
3977
+ [styles$8.current]: i_0 === index,
3978
+ [styles$8.next]: i_0 > index
3910
3979
  }]),
3911
3980
  children: it
3912
3981
  }, `slide-${i_0 + 1}`);
@@ -3925,7 +3994,7 @@ function Slideshow(t0) {
3925
3994
  let t13;
3926
3995
  if ($[20] !== t12) {
3927
3996
  t13 = /*#__PURE__*/jsx("div", {
3928
- className: styles$e.items,
3997
+ className: styles$8.items,
3929
3998
  children: t12
3930
3999
  });
3931
4000
  $[20] = t12;
@@ -3950,165 +4019,207 @@ function Slideshow(t0) {
3950
4019
  }
3951
4020
  return t14;
3952
4021
  }
3953
- function _temp$3(i) {
4022
+ function _temp$4(i) {
3954
4023
  return i + 1;
3955
4024
  }
3956
4025
 
3957
- var styles$d = {"icon":"micromag-core-placeholders-icon"};
3958
-
3959
4026
  function AdFrame(t0) {
3960
- const $ = c(5);
3961
- const {
3962
- width,
3963
- height,
3964
- className
3965
- } = t0;
4027
+ const $ = c(10);
4028
+ let height;
4029
+ let props;
4030
+ let width;
4031
+ if ($[0] !== t0) {
4032
+ ({
4033
+ width,
4034
+ height,
4035
+ ...props
4036
+ } = t0);
4037
+ $[0] = t0;
4038
+ $[1] = height;
4039
+ $[2] = props;
4040
+ $[3] = width;
4041
+ } else {
4042
+ height = $[1];
4043
+ props = $[2];
4044
+ width = $[3];
4045
+ }
3966
4046
  let t1;
3967
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
4047
+ if ($[4] !== height || $[5] !== width) {
3968
4048
  t1 = /*#__PURE__*/jsx(FontAwesomeIcon, {
3969
4049
  icon: faAd,
3970
- className: styles$d.icon
4050
+ style: {
4051
+ width,
4052
+ height
4053
+ }
3971
4054
  });
3972
- $[0] = t1;
4055
+ $[4] = height;
4056
+ $[5] = width;
4057
+ $[6] = t1;
3973
4058
  } else {
3974
- t1 = $[0];
4059
+ t1 = $[6];
3975
4060
  }
3976
4061
  let t2;
3977
- if ($[1] !== className || $[2] !== height || $[3] !== width) {
4062
+ if ($[7] !== props || $[8] !== t1) {
3978
4063
  t2 = /*#__PURE__*/jsx(PlaceholderBlock, {
3979
- width: width,
3980
- height: height,
3981
- className: className,
4064
+ ...props,
3982
4065
  children: t1
3983
4066
  });
3984
- $[1] = className;
3985
- $[2] = height;
3986
- $[3] = width;
3987
- $[4] = t2;
4067
+ $[7] = props;
4068
+ $[8] = t1;
4069
+ $[9] = t2;
3988
4070
  } else {
3989
- t2 = $[4];
4071
+ t2 = $[9];
3990
4072
  }
3991
4073
  return t2;
3992
4074
  }
3993
4075
 
3994
4076
  function AdImage(t0) {
3995
- const $ = c(5);
3996
- const {
3997
- width,
3998
- height,
3999
- className
4000
- } = t0;
4077
+ const $ = c(10);
4078
+ let height;
4079
+ let props;
4080
+ let width;
4081
+ if ($[0] !== t0) {
4082
+ ({
4083
+ width,
4084
+ height,
4085
+ ...props
4086
+ } = t0);
4087
+ $[0] = t0;
4088
+ $[1] = height;
4089
+ $[2] = props;
4090
+ $[3] = width;
4091
+ } else {
4092
+ height = $[1];
4093
+ props = $[2];
4094
+ width = $[3];
4095
+ }
4001
4096
  let t1;
4002
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
4097
+ if ($[4] !== height || $[5] !== width) {
4003
4098
  t1 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4004
4099
  icon: faImage,
4005
- className: styles$d.icon
4100
+ style: {
4101
+ width,
4102
+ height
4103
+ }
4006
4104
  });
4007
- $[0] = t1;
4105
+ $[4] = height;
4106
+ $[5] = width;
4107
+ $[6] = t1;
4008
4108
  } else {
4009
- t1 = $[0];
4109
+ t1 = $[6];
4010
4110
  }
4011
4111
  let t2;
4012
- if ($[1] !== className || $[2] !== height || $[3] !== width) {
4112
+ if ($[7] !== props || $[8] !== t1) {
4013
4113
  t2 = /*#__PURE__*/jsx(PlaceholderBlock, {
4014
- width: width,
4015
- height: height,
4016
- className: className,
4114
+ ...props,
4017
4115
  children: t1
4018
4116
  });
4019
- $[1] = className;
4020
- $[2] = height;
4021
- $[3] = width;
4022
- $[4] = t2;
4117
+ $[7] = props;
4118
+ $[8] = t1;
4119
+ $[9] = t2;
4023
4120
  } else {
4024
- t2 = $[4];
4121
+ t2 = $[9];
4025
4122
  }
4026
4123
  return t2;
4027
4124
  }
4028
4125
 
4029
4126
  function Audio(t0) {
4030
- const $ = c(5);
4031
- const {
4032
- width: t1,
4033
- height: t2,
4034
- className
4035
- } = t0;
4036
- const width = t1 === undefined ? "100%" : t1;
4037
- const height = t2 === undefined ? "2em" : t2;
4038
- let t3;
4039
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
4040
- t3 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4127
+ const $ = c(10);
4128
+ let height;
4129
+ let props;
4130
+ let width;
4131
+ if ($[0] !== t0) {
4132
+ ({
4133
+ width,
4134
+ height,
4135
+ ...props
4136
+ } = t0);
4137
+ $[0] = t0;
4138
+ $[1] = height;
4139
+ $[2] = props;
4140
+ $[3] = width;
4141
+ } else {
4142
+ height = $[1];
4143
+ props = $[2];
4144
+ width = $[3];
4145
+ }
4146
+ let t1;
4147
+ if ($[4] !== height || $[5] !== width) {
4148
+ t1 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4041
4149
  icon: faMusic,
4042
- className: styles$d.icon
4150
+ style: {
4151
+ width,
4152
+ height
4153
+ },
4154
+ className: "d-block m-auto"
4043
4155
  });
4044
- $[0] = t3;
4156
+ $[4] = height;
4157
+ $[5] = width;
4158
+ $[6] = t1;
4045
4159
  } else {
4046
- t3 = $[0];
4160
+ t1 = $[6];
4047
4161
  }
4048
- let t4;
4049
- if ($[1] !== className || $[2] !== height || $[3] !== width) {
4050
- t4 = /*#__PURE__*/jsx(PlaceholderBlock, {
4051
- width: width,
4052
- height: height,
4053
- className: className,
4054
- children: t3
4162
+ let t2;
4163
+ if ($[7] !== props || $[8] !== t1) {
4164
+ t2 = /*#__PURE__*/jsx(PlaceholderBlock, {
4165
+ ...props,
4166
+ children: t1
4055
4167
  });
4056
- $[1] = className;
4057
- $[2] = height;
4058
- $[3] = width;
4059
- $[4] = t4;
4168
+ $[7] = props;
4169
+ $[8] = t1;
4170
+ $[9] = t2;
4060
4171
  } else {
4061
- t4 = $[4];
4172
+ t2 = $[9];
4062
4173
  }
4063
- return t4;
4174
+ return t2;
4064
4175
  }
4065
4176
 
4066
- var styles$c = {"container":"micromag-core-partials-placeholder-text-container","withInvertedColors":"micromag-core-partials-placeholder-text-withInvertedColors","line":"micromag-core-partials-placeholder-text-line"};
4067
-
4068
4177
  function PlaceholderText(t0) {
4069
- const $ = c(19);
4178
+ const $ = c(20);
4070
4179
  const {
4071
4180
  lines: t1,
4072
4181
  lineMargin: t2,
4073
4182
  width: t3,
4074
4183
  height: t4,
4075
4184
  fontSize: t5,
4076
- className: t6,
4077
- withInvertedColors: t7
4185
+ className: t6
4078
4186
  } = t0;
4079
4187
  const lines = t1 === undefined ? 1 : t1;
4080
- const lineMargin = t2 === undefined ? 1 : t2;
4188
+ const lineMargin = t2 === undefined ? "0.4em" : t2;
4081
4189
  const width = t3 === undefined ? "100%" : t3;
4082
4190
  const height = t4 === undefined ? null : t4;
4083
4191
  const fontSize = t5 === undefined ? 16 : t5;
4084
4192
  const className = t6 === undefined ? null : t6;
4085
- const withInvertedColors = t7 === undefined ? true : t7;
4086
- let t8;
4193
+ let t7;
4087
4194
  if ($[0] !== fontSize || $[1] !== height) {
4088
- t8 = height !== null && isNumber(height) ? `${Math.round(height * fontSize)}px` : height;
4195
+ t7 = height !== null && isNumber(height) ? `${Math.round(height * fontSize)}px` : height;
4089
4196
  $[0] = fontSize;
4090
4197
  $[1] = height;
4091
- $[2] = t8;
4198
+ $[2] = t7;
4092
4199
  } else {
4093
- t8 = $[2];
4200
+ t7 = $[2];
4094
4201
  }
4095
- const lineHeight = t8;
4096
- let t9;
4202
+ const lineHeight = t7;
4203
+ let t8;
4097
4204
  if ($[3] !== width) {
4098
- t9 = isNumber(width) ? width * 0.9 : "80%";
4205
+ t8 = isNumber(width) ? width * 0.9 : "80%";
4099
4206
  $[3] = width;
4100
- $[4] = t9;
4207
+ $[4] = t8;
4101
4208
  } else {
4102
- t9 = $[4];
4209
+ t8 = $[4];
4103
4210
  }
4104
- const oddWidth = t9;
4105
- let t10;
4106
- if ($[5] !== className || $[6] !== withInvertedColors) {
4107
- t10 = classNames([styles$c.container, className, {
4108
- [styles$c.withInvertedColors]: withInvertedColors
4109
- }]);
4211
+ const oddWidth = t8;
4212
+ let t9;
4213
+ if ($[5] !== className) {
4214
+ t9 = classNames(["w-100", className]);
4110
4215
  $[5] = className;
4111
- $[6] = withInvertedColors;
4216
+ $[6] = t9;
4217
+ } else {
4218
+ t9 = $[6];
4219
+ }
4220
+ let t10;
4221
+ if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
4222
+ t10 = {};
4112
4223
  $[7] = t10;
4113
4224
  } else {
4114
4225
  t10 = $[7];
@@ -4122,80 +4233,94 @@ function PlaceholderText(t0) {
4122
4233
  t11 = $[9];
4123
4234
  }
4124
4235
  let t12;
4125
- if ($[10] !== lineHeight || $[11] !== lineMargin || $[12] !== oddWidth || $[13] !== t11 || $[14] !== width) {
4236
+ if ($[10] !== lineHeight || $[11] !== lineMargin || $[12] !== lines || $[13] !== oddWidth || $[14] !== t11 || $[15] !== width) {
4126
4237
  t12 = t11.map((e, index) => /*#__PURE__*/jsx("div", {
4127
- className: styles$c.line,
4128
4238
  style: {
4129
4239
  width: index % 2 === 0 ? width : oddWidth,
4130
4240
  height: lineHeight,
4131
- marginTop: lineMargin,
4132
- marginBottom: lineMargin
4241
+ marginTop: index > 0 ? lineMargin : null,
4242
+ marginBottom: index < lines - 1 ? lineMargin : null,
4243
+ backgroundColor: "currentcolor"
4133
4244
  }
4134
4245
  }, `line-${index}`));
4135
4246
  $[10] = lineHeight;
4136
4247
  $[11] = lineMargin;
4137
- $[12] = oddWidth;
4138
- $[13] = t11;
4139
- $[14] = width;
4140
- $[15] = t12;
4248
+ $[12] = lines;
4249
+ $[13] = oddWidth;
4250
+ $[14] = t11;
4251
+ $[15] = width;
4252
+ $[16] = t12;
4141
4253
  } else {
4142
- t12 = $[15];
4254
+ t12 = $[16];
4143
4255
  }
4144
4256
  let t13;
4145
- if ($[16] !== t10 || $[17] !== t12) {
4257
+ if ($[17] !== t12 || $[18] !== t9) {
4146
4258
  t13 = /*#__PURE__*/jsx("div", {
4147
- className: t10,
4259
+ className: t9,
4260
+ style: t10,
4148
4261
  children: t12
4149
4262
  });
4150
- $[16] = t10;
4151
4263
  $[17] = t12;
4152
- $[18] = t13;
4264
+ $[18] = t9;
4265
+ $[19] = t13;
4153
4266
  } else {
4154
- t13 = $[18];
4267
+ t13 = $[19];
4155
4268
  }
4156
4269
  return t13;
4157
4270
  }
4158
4271
 
4159
4272
  function Button(t0) {
4160
- const $ = c(5);
4161
- const {
4162
- width: t1,
4163
- height: t2,
4164
- className
4165
- } = t0;
4166
- const width = t1 === undefined ? "75%" : t1;
4167
- const height = t2 === undefined ? "0.4em" : t2;
4168
- let t3;
4169
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
4170
- t3 = /*#__PURE__*/jsx(PlaceholderText, {
4171
- line: 1,
4172
- height: "0.1em"
4273
+ const $ = c(9);
4274
+ let className;
4275
+ let props;
4276
+ if ($[0] !== t0) {
4277
+ ({
4278
+ className,
4279
+ ...props
4280
+ } = t0);
4281
+ $[0] = t0;
4282
+ $[1] = className;
4283
+ $[2] = props;
4284
+ } else {
4285
+ className = $[1];
4286
+ props = $[2];
4287
+ }
4288
+ let t1;
4289
+ if ($[3] !== className) {
4290
+ t1 = classNames(["rounded", className]);
4291
+ $[3] = className;
4292
+ $[4] = t1;
4293
+ } else {
4294
+ t1 = $[4];
4295
+ }
4296
+ let t2;
4297
+ if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
4298
+ t2 = /*#__PURE__*/jsx(PlaceholderText, {
4299
+ height: "0.5em"
4173
4300
  });
4174
- $[0] = t3;
4301
+ $[5] = t2;
4175
4302
  } else {
4176
- t3 = $[0];
4303
+ t2 = $[5];
4177
4304
  }
4178
- let t4;
4179
- if ($[1] !== className || $[2] !== height || $[3] !== width) {
4180
- t4 = /*#__PURE__*/jsx(PlaceholderBlock, {
4305
+ let t3;
4306
+ if ($[6] !== props || $[7] !== t1) {
4307
+ t3 = /*#__PURE__*/jsx(PlaceholderBlock, {
4181
4308
  outline: true,
4182
- width: width,
4183
- height: height,
4184
- className: className,
4185
- children: t3
4309
+ className: t1,
4310
+ ...props,
4311
+ children: t2
4186
4312
  });
4187
- $[1] = className;
4188
- $[2] = height;
4189
- $[3] = width;
4190
- $[4] = t4;
4313
+ $[6] = props;
4314
+ $[7] = t1;
4315
+ $[8] = t3;
4191
4316
  } else {
4192
- t4 = $[4];
4317
+ t3 = $[8];
4193
4318
  }
4194
- return t4;
4319
+ return t3;
4195
4320
  }
4196
4321
 
4197
- function Image(t0) {
4198
- const $ = c(11);
4322
+ function PlaceholderImage(t0) {
4323
+ const $ = c(12);
4199
4324
  let className;
4200
4325
  let height;
4201
4326
  let props;
@@ -4219,40 +4344,45 @@ function Image(t0) {
4219
4344
  width = $[4];
4220
4345
  }
4221
4346
  let t1;
4222
- if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
4347
+ if ($[5] !== height || $[6] !== width) {
4223
4348
  t1 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4224
4349
  icon: faImage,
4225
- className: styles$d.icon
4350
+ className: "d-block m-auto",
4351
+ style: {
4352
+ width,
4353
+ height
4354
+ }
4226
4355
  });
4227
- $[5] = t1;
4356
+ $[5] = height;
4357
+ $[6] = width;
4358
+ $[7] = t1;
4228
4359
  } else {
4229
- t1 = $[5];
4360
+ t1 = $[7];
4230
4361
  }
4231
4362
  let t2;
4232
- if ($[6] !== className || $[7] !== height || $[8] !== props || $[9] !== width) {
4363
+ if ($[8] !== className || $[9] !== props || $[10] !== t1) {
4233
4364
  t2 = /*#__PURE__*/jsx(PlaceholderBlock, {
4234
4365
  ...props,
4235
- width: width,
4236
- height: height,
4237
4366
  className: className,
4238
4367
  children: t1
4239
4368
  });
4240
- $[6] = className;
4241
- $[7] = height;
4242
- $[8] = props;
4243
- $[9] = width;
4244
- $[10] = t2;
4369
+ $[8] = className;
4370
+ $[9] = props;
4371
+ $[10] = t1;
4372
+ $[11] = t2;
4245
4373
  } else {
4246
- t2 = $[10];
4374
+ t2 = $[11];
4247
4375
  }
4248
4376
  return t2;
4249
4377
  }
4250
4378
 
4379
+ var styles$7 = {};
4380
+
4251
4381
  function Line(props) {
4252
4382
  const $ = c(5);
4253
4383
  let t0;
4254
4384
  if ($[0] !== props.className) {
4255
- t0 = classNames([props.className, styles$d.shortText]);
4385
+ t0 = classNames([props.className, styles$7.shortText]);
4256
4386
  $[0] = props.className;
4257
4387
  $[1] = t0;
4258
4388
  } else {
@@ -4275,448 +4405,540 @@ function Line(props) {
4275
4405
  return t1;
4276
4406
  }
4277
4407
 
4278
- var styles$b = {"container":"micromag-core-placeholders-map-container","icon":"micromag-core-placeholders-map-icon"};
4408
+ var styles$6 = {"container":"micromag-core-placeholders-map-container","icon":"micromag-core-placeholders-map-icon"};
4279
4409
 
4280
- function Map(props) {
4410
+ function Map(t0) {
4281
4411
  const $ = c(18);
4282
- const t0 = props.className !== null;
4412
+ let className;
4413
+ let props;
4283
4414
  let t1;
4284
- if ($[0] !== props.className || $[1] !== t0) {
4285
- t1 = classNames([styles$b.container, {
4286
- [props.className]: t0
4287
- }]);
4288
- $[0] = props.className;
4289
- $[1] = t0;
4290
- $[2] = t1;
4415
+ if ($[0] !== t0) {
4416
+ ({
4417
+ withImages: t1,
4418
+ className,
4419
+ ...props
4420
+ } = t0);
4421
+ $[0] = t0;
4422
+ $[1] = className;
4423
+ $[2] = props;
4424
+ $[3] = t1;
4291
4425
  } else {
4292
- t1 = $[2];
4426
+ className = $[1];
4427
+ props = $[2];
4428
+ t1 = $[3];
4429
+ }
4430
+ const withImages = t1 === undefined ? false : t1;
4431
+ const icon = withImages ? faImage : faMapMarkerAlt;
4432
+ let t2;
4433
+ if ($[4] !== className) {
4434
+ t2 = classNames([styles$6.container, className]);
4435
+ $[4] = className;
4436
+ $[5] = t2;
4437
+ } else {
4438
+ t2 = $[5];
4293
4439
  }
4294
- const t2 = props.withImages ? faImage : faMapMarkerAlt;
4295
4440
  let t3;
4296
- if ($[3] !== t2) {
4441
+ let t4;
4442
+ let t5;
4443
+ let t6;
4444
+ if ($[6] !== icon) {
4297
4445
  t3 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4298
- icon: t2,
4299
- className: styles$b.icon
4446
+ icon: icon,
4447
+ className: styles$6.icon
4300
4448
  });
4301
- $[3] = t2;
4302
- $[4] = t3;
4303
- } else {
4304
- t3 = $[4];
4305
- }
4306
- const t4 = props.withImages ? faImage : faMapMarkerAlt;
4307
- let t5;
4308
- if ($[5] !== t4) {
4309
- t5 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4310
- icon: t4,
4311
- className: styles$b.icon
4449
+ t4 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4450
+ icon: icon,
4451
+ className: styles$6.icon
4312
4452
  });
4313
- $[5] = t4;
4314
- $[6] = t5;
4315
- } else {
4316
- t5 = $[6];
4317
- }
4318
- const t6 = props.withImages ? faImage : faMapMarkerAlt;
4319
- let t7;
4320
- if ($[7] !== t6) {
4321
- t7 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4322
- icon: t6,
4323
- className: styles$b.icon
4453
+ t5 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4454
+ icon: icon,
4455
+ className: styles$6.icon
4324
4456
  });
4325
- $[7] = t6;
4326
- $[8] = t7;
4327
- } else {
4328
- t7 = $[8];
4329
- }
4330
- const t8 = props.withImages ? faImage : faMapMarkerAlt;
4331
- let t9;
4332
- if ($[9] !== t8) {
4333
- t9 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4334
- icon: t8,
4335
- className: styles$b.icon
4457
+ t6 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4458
+ icon: icon,
4459
+ className: styles$6.icon
4336
4460
  });
4337
- $[9] = t8;
4338
- $[10] = t9;
4461
+ $[6] = icon;
4462
+ $[7] = t3;
4463
+ $[8] = t4;
4464
+ $[9] = t5;
4465
+ $[10] = t6;
4339
4466
  } else {
4340
- t9 = $[10];
4467
+ t3 = $[7];
4468
+ t4 = $[8];
4469
+ t5 = $[9];
4470
+ t6 = $[10];
4341
4471
  }
4342
- let t10;
4343
- if ($[11] !== props || $[12] !== t1 || $[13] !== t3 || $[14] !== t5 || $[15] !== t7 || $[16] !== t9) {
4344
- t10 = /*#__PURE__*/jsxs(PlaceholderBlock, {
4472
+ let t7;
4473
+ if ($[11] !== props || $[12] !== t2 || $[13] !== t3 || $[14] !== t4 || $[15] !== t5 || $[16] !== t6) {
4474
+ t7 = /*#__PURE__*/jsxs(PlaceholderBlock, {
4475
+ width: null,
4476
+ height: null,
4345
4477
  ...props,
4346
- width: "100%",
4347
- height: "100%",
4348
- className: t1,
4349
- children: [t3, t5, t7, t9]
4478
+ className: t2,
4479
+ children: [t3, t4, t5, t6]
4350
4480
  });
4351
4481
  $[11] = props;
4352
- $[12] = t1;
4482
+ $[12] = t2;
4353
4483
  $[13] = t3;
4354
- $[14] = t5;
4355
- $[15] = t7;
4356
- $[16] = t9;
4357
- $[17] = t10;
4484
+ $[14] = t4;
4485
+ $[15] = t5;
4486
+ $[16] = t6;
4487
+ $[17] = t7;
4358
4488
  } else {
4359
- t10 = $[17];
4489
+ t7 = $[17];
4360
4490
  }
4361
- return t10;
4491
+ return t7;
4362
4492
  }
4363
4493
 
4364
- function MapPath(props) {
4365
- const $ = c(6);
4366
- let t0;
4367
- if ($[0] !== props.className) {
4368
- t0 = classNames([props.className, styles$d.mapPath]);
4369
- $[0] = props.className;
4370
- $[1] = t0;
4494
+ function MapPath(t0) {
4495
+ const $ = c(10);
4496
+ let height;
4497
+ let props;
4498
+ let width;
4499
+ if ($[0] !== t0) {
4500
+ ({
4501
+ width,
4502
+ height,
4503
+ ...props
4504
+ } = t0);
4505
+ $[0] = t0;
4506
+ $[1] = height;
4507
+ $[2] = props;
4508
+ $[3] = width;
4371
4509
  } else {
4372
- t0 = $[1];
4510
+ height = $[1];
4511
+ props = $[2];
4512
+ width = $[3];
4373
4513
  }
4374
4514
  let t1;
4375
- if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
4515
+ if ($[4] !== height || $[5] !== width) {
4376
4516
  t1 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4377
4517
  icon: faMapMarkedAlt,
4378
- size: "lg",
4379
- className: styles$d.icon
4518
+ style: {
4519
+ width,
4520
+ height
4521
+ }
4380
4522
  });
4381
- $[2] = t1;
4523
+ $[4] = height;
4524
+ $[5] = width;
4525
+ $[6] = t1;
4382
4526
  } else {
4383
- t1 = $[2];
4527
+ t1 = $[6];
4384
4528
  }
4385
4529
  let t2;
4386
- if ($[3] !== props || $[4] !== t0) {
4530
+ if ($[7] !== props || $[8] !== t1) {
4387
4531
  t2 = /*#__PURE__*/jsx(PlaceholderBlock, {
4388
4532
  ...props,
4389
- width: "100%",
4390
- height: "70%",
4391
- className: t0,
4392
4533
  children: t1
4393
4534
  });
4394
- $[3] = props;
4395
- $[4] = t0;
4396
- $[5] = t2;
4535
+ $[7] = props;
4536
+ $[8] = t1;
4537
+ $[9] = t2;
4397
4538
  } else {
4398
- t2 = $[5];
4539
+ t2 = $[9];
4399
4540
  }
4400
4541
  return t2;
4401
4542
  }
4402
4543
 
4403
- function Quote(props) {
4404
- const $ = c(5);
4405
- let t0;
4406
- if ($[0] !== props.className) {
4407
- t0 = classNames([props.className, styles$d.subtitle]);
4408
- $[0] = props.className;
4409
- $[1] = t0;
4544
+ function Quote(t0) {
4545
+ const $ = c(8);
4546
+ let props;
4547
+ let t1;
4548
+ let t2;
4549
+ if ($[0] !== t0) {
4550
+ ({
4551
+ height: t1,
4552
+ lines: t2,
4553
+ ...props
4554
+ } = t0);
4555
+ $[0] = t0;
4556
+ $[1] = props;
4557
+ $[2] = t1;
4558
+ $[3] = t2;
4410
4559
  } else {
4411
- t0 = $[1];
4560
+ props = $[1];
4561
+ t1 = $[2];
4562
+ t2 = $[3];
4412
4563
  }
4413
- let t1;
4414
- if ($[2] !== props || $[3] !== t0) {
4415
- t1 = /*#__PURE__*/jsx(PlaceholderText, {
4416
- ...props,
4417
- className: t0,
4418
- height: 0.5,
4419
- lines: 6
4564
+ const height = t1 === undefined ? 1.5 : t1;
4565
+ const lines = t2 === undefined ? 6 : t2;
4566
+ let t3;
4567
+ if ($[4] !== height || $[5] !== lines || $[6] !== props) {
4568
+ t3 = /*#__PURE__*/jsx(PlaceholderText, {
4569
+ height: height,
4570
+ lines: lines,
4571
+ ...props
4420
4572
  });
4421
- $[2] = props;
4422
- $[3] = t0;
4423
- $[4] = t1;
4573
+ $[4] = height;
4574
+ $[5] = lines;
4575
+ $[6] = props;
4576
+ $[7] = t3;
4424
4577
  } else {
4425
- t1 = $[4];
4578
+ t3 = $[7];
4426
4579
  }
4427
- return t1;
4580
+ return t3;
4428
4581
  }
4429
4582
 
4430
- function ShortText(props) {
4431
- const $ = c(5);
4432
- let t0;
4433
- if ($[0] !== props.className) {
4434
- t0 = classNames([props.className, styles$d.shortText]);
4435
- $[0] = props.className;
4436
- $[1] = t0;
4583
+ function ShortText(t0) {
4584
+ const $ = c(8);
4585
+ let props;
4586
+ let t1;
4587
+ let t2;
4588
+ if ($[0] !== t0) {
4589
+ ({
4590
+ height: t1,
4591
+ lines: t2,
4592
+ ...props
4593
+ } = t0);
4594
+ $[0] = t0;
4595
+ $[1] = props;
4596
+ $[2] = t1;
4597
+ $[3] = t2;
4437
4598
  } else {
4438
- t0 = $[1];
4599
+ props = $[1];
4600
+ t1 = $[2];
4601
+ t2 = $[3];
4439
4602
  }
4440
- let t1;
4441
- if ($[2] !== props || $[3] !== t0) {
4442
- t1 = /*#__PURE__*/jsx(PlaceholderText, {
4443
- ...props,
4444
- className: t0,
4445
- height: 0.2,
4446
- lines: 2
4603
+ const height = t1 === undefined ? 0.8 : t1;
4604
+ const lines = t2 === undefined ? 2 : t2;
4605
+ let t3;
4606
+ if ($[4] !== height || $[5] !== lines || $[6] !== props) {
4607
+ t3 = /*#__PURE__*/jsx(PlaceholderText, {
4608
+ height: height,
4609
+ lines: lines,
4610
+ ...props
4447
4611
  });
4448
- $[2] = props;
4449
- $[3] = t0;
4450
- $[4] = t1;
4612
+ $[4] = height;
4613
+ $[5] = lines;
4614
+ $[6] = props;
4615
+ $[7] = t3;
4451
4616
  } else {
4452
- t1 = $[4];
4617
+ t3 = $[7];
4453
4618
  }
4454
- return t1;
4619
+ return t3;
4455
4620
  }
4456
4621
 
4457
- function Subtitle(props) {
4458
- const $ = c(5);
4459
- let t0;
4460
- if ($[0] !== props.className) {
4461
- t0 = classNames([props.className, styles$d.subtitle]);
4462
- $[0] = props.className;
4463
- $[1] = t0;
4622
+ function Subtitle(t0) {
4623
+ const $ = c(8);
4624
+ let props;
4625
+ let t1;
4626
+ let t2;
4627
+ if ($[0] !== t0) {
4628
+ ({
4629
+ height: t1,
4630
+ lines: t2,
4631
+ ...props
4632
+ } = t0);
4633
+ $[0] = t0;
4634
+ $[1] = props;
4635
+ $[2] = t1;
4636
+ $[3] = t2;
4464
4637
  } else {
4465
- t0 = $[1];
4638
+ props = $[1];
4639
+ t1 = $[2];
4640
+ t2 = $[3];
4466
4641
  }
4467
- let t1;
4468
- if ($[2] !== props || $[3] !== t0) {
4469
- t1 = /*#__PURE__*/jsx(PlaceholderText, {
4470
- ...props,
4471
- className: t0,
4472
- height: 0.3,
4473
- lines: 1
4642
+ const height = t1 === undefined ? 1.25 : t1;
4643
+ const lines = t2 === undefined ? 1 : t2;
4644
+ let t3;
4645
+ if ($[4] !== height || $[5] !== lines || $[6] !== props) {
4646
+ t3 = /*#__PURE__*/jsx(PlaceholderText, {
4647
+ height: height,
4648
+ lines: lines,
4649
+ ...props
4474
4650
  });
4475
- $[2] = props;
4476
- $[3] = t0;
4477
- $[4] = t1;
4651
+ $[4] = height;
4652
+ $[5] = lines;
4653
+ $[6] = props;
4654
+ $[7] = t3;
4478
4655
  } else {
4479
- t1 = $[4];
4656
+ t3 = $[7];
4480
4657
  }
4481
- return t1;
4658
+ return t3;
4482
4659
  }
4483
4660
 
4484
- function TextPlaceholder(props) {
4661
+ function TextPlaceholder(t0) {
4485
4662
  const $ = c(8);
4486
- const {
4487
- className: t0,
4488
- height: t1,
4489
- lines: t2,
4490
- lineMargin: t3
4491
- } = props;
4492
- const className = t0 === undefined ? null : t0;
4493
- const height = t1 === undefined ? 0.2 : t1;
4494
- const lines = t2 === undefined ? 4 : t2;
4495
- const lineMargin = t3 === undefined ? 2 : t3;
4496
- let t4;
4497
- if ($[0] !== className) {
4498
- t4 = classNames([className, styles$d.text]);
4499
- $[0] = className;
4500
- $[1] = t4;
4663
+ let props;
4664
+ let t1;
4665
+ let t2;
4666
+ if ($[0] !== t0) {
4667
+ ({
4668
+ height: t1,
4669
+ lines: t2,
4670
+ ...props
4671
+ } = t0);
4672
+ $[0] = t0;
4673
+ $[1] = props;
4674
+ $[2] = t1;
4675
+ $[3] = t2;
4501
4676
  } else {
4502
- t4 = $[1];
4677
+ props = $[1];
4678
+ t1 = $[2];
4679
+ t2 = $[3];
4503
4680
  }
4504
- let t5;
4505
- if ($[2] !== height || $[3] !== lineMargin || $[4] !== lines || $[5] !== props || $[6] !== t4) {
4506
- t5 = /*#__PURE__*/jsx(PlaceholderText, {
4507
- ...props,
4681
+ const height = t1 === undefined ? 1 : t1;
4682
+ const lines = t2 === undefined ? 4 : t2;
4683
+ let t3;
4684
+ if ($[4] !== height || $[5] !== lines || $[6] !== props) {
4685
+ t3 = /*#__PURE__*/jsx(PlaceholderText, {
4508
4686
  height: height,
4509
4687
  lines: lines,
4510
- lineMargin: lineMargin,
4511
- className: t4
4688
+ ...props
4512
4689
  });
4513
- $[2] = height;
4514
- $[3] = lineMargin;
4515
- $[4] = lines;
4516
- $[5] = props;
4517
- $[6] = t4;
4518
- $[7] = t5;
4690
+ $[4] = height;
4691
+ $[5] = lines;
4692
+ $[6] = props;
4693
+ $[7] = t3;
4519
4694
  } else {
4520
- t5 = $[7];
4695
+ t3 = $[7];
4521
4696
  }
4522
- return t5;
4697
+ return t3;
4523
4698
  }
4524
4699
 
4525
4700
  function Timeline(props) {
4526
- const $ = c(5);
4701
+ const $ = c(2);
4527
4702
  let t0;
4528
- if ($[0] !== props.className) {
4529
- t0 = classNames([props.className, styles$d.timeline]);
4530
- $[0] = props.className;
4703
+ if ($[0] !== props) {
4704
+ t0 = /*#__PURE__*/jsx(PlaceholderText, {
4705
+ ...props
4706
+ });
4707
+ $[0] = props;
4531
4708
  $[1] = t0;
4532
4709
  } else {
4533
4710
  t0 = $[1];
4534
4711
  }
4535
- let t1;
4536
- if ($[2] !== props || $[3] !== t0) {
4537
- t1 = /*#__PURE__*/jsx(PlaceholderText, {
4538
- ...props,
4539
- className: t0
4540
- });
4541
- $[2] = props;
4542
- $[3] = t0;
4543
- $[4] = t1;
4544
- } else {
4545
- t1 = $[4];
4546
- }
4547
- return t1;
4712
+ return t0;
4548
4713
  }
4549
4714
 
4550
- function Title$1(props) {
4715
+ function Title(t0) {
4551
4716
  const $ = c(8);
4552
- const {
4553
- height: t0,
4554
- lines: t1,
4555
- lineMargin: t2
4556
- } = props;
4557
- const height = t0 === undefined ? 0.5 : t0;
4558
- const lines = t1 === undefined ? 2 : t1;
4559
- const lineMargin = t2 === undefined ? 2 : t2;
4560
- let t3;
4561
- if ($[0] !== props.className) {
4562
- t3 = classNames([props.className, styles$d.title]);
4563
- $[0] = props.className;
4564
- $[1] = t3;
4717
+ let props;
4718
+ let t1;
4719
+ let t2;
4720
+ if ($[0] !== t0) {
4721
+ ({
4722
+ height: t1,
4723
+ lines: t2,
4724
+ ...props
4725
+ } = t0);
4726
+ $[0] = t0;
4727
+ $[1] = props;
4728
+ $[2] = t1;
4729
+ $[3] = t2;
4565
4730
  } else {
4566
- t3 = $[1];
4731
+ props = $[1];
4732
+ t1 = $[2];
4733
+ t2 = $[3];
4567
4734
  }
4568
- let t4;
4569
- if ($[2] !== height || $[3] !== lineMargin || $[4] !== lines || $[5] !== props || $[6] !== t3) {
4570
- t4 = /*#__PURE__*/jsx(PlaceholderText, {
4571
- ...props,
4572
- className: t3,
4735
+ const height = t1 === undefined ? 1.5 : t1;
4736
+ const lines = t2 === undefined ? 2 : t2;
4737
+ let t3;
4738
+ if ($[4] !== height || $[5] !== lines || $[6] !== props) {
4739
+ t3 = /*#__PURE__*/jsx(PlaceholderText, {
4573
4740
  height: height,
4574
4741
  lines: lines,
4575
- lineMargin: lineMargin
4742
+ ...props
4576
4743
  });
4577
- $[2] = height;
4578
- $[3] = lineMargin;
4579
- $[4] = lines;
4580
- $[5] = props;
4581
- $[6] = t3;
4582
- $[7] = t4;
4744
+ $[4] = height;
4745
+ $[5] = lines;
4746
+ $[6] = props;
4747
+ $[7] = t3;
4583
4748
  } else {
4584
- t4 = $[7];
4749
+ t3 = $[7];
4585
4750
  }
4586
- return t4;
4751
+ return t3;
4587
4752
  }
4588
4753
 
4589
4754
  function Video(t0) {
4590
- const $ = c(5);
4591
- const {
4592
- width,
4593
- height,
4594
- className
4595
- } = t0;
4755
+ const $ = c(10);
4756
+ let height;
4757
+ let props;
4758
+ let width;
4759
+ if ($[0] !== t0) {
4760
+ ({
4761
+ width,
4762
+ height,
4763
+ ...props
4764
+ } = t0);
4765
+ $[0] = t0;
4766
+ $[1] = height;
4767
+ $[2] = props;
4768
+ $[3] = width;
4769
+ } else {
4770
+ height = $[1];
4771
+ props = $[2];
4772
+ width = $[3];
4773
+ }
4596
4774
  let t1;
4597
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
4775
+ if ($[4] !== height || $[5] !== width) {
4598
4776
  t1 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4599
4777
  icon: faVideo,
4600
- className: styles$d.icon
4778
+ style: {
4779
+ width,
4780
+ height
4781
+ },
4782
+ className: "d-block m-auto"
4601
4783
  });
4602
- $[0] = t1;
4784
+ $[4] = height;
4785
+ $[5] = width;
4786
+ $[6] = t1;
4603
4787
  } else {
4604
- t1 = $[0];
4788
+ t1 = $[6];
4605
4789
  }
4606
4790
  let t2;
4607
- if ($[1] !== className || $[2] !== height || $[3] !== width) {
4791
+ if ($[7] !== props || $[8] !== t1) {
4608
4792
  t2 = /*#__PURE__*/jsx(PlaceholderBlock, {
4609
- width: width,
4610
- height: height,
4611
- className: className,
4793
+ ...props,
4612
4794
  children: t1
4613
4795
  });
4614
- $[1] = className;
4615
- $[2] = height;
4616
- $[3] = width;
4617
- $[4] = t2;
4796
+ $[7] = props;
4797
+ $[8] = t1;
4798
+ $[9] = t2;
4618
4799
  } else {
4619
- t2 = $[4];
4800
+ t2 = $[9];
4620
4801
  }
4621
4802
  return t2;
4622
4803
  }
4623
4804
 
4624
- var styles$a = {"container":"micromag-core-placeholders-video-360-container","box":"micromag-core-placeholders-video-360-box","icon":"micromag-core-placeholders-video-360-icon","label":"micromag-core-placeholders-video-360-label"};
4625
-
4626
4805
  function Video360(t0) {
4627
- const $ = c(8);
4628
- const {
4629
- width,
4630
- height,
4631
- className
4632
- } = t0;
4633
- let t1;
4634
- if ($[0] !== className) {
4635
- t1 = classNames([styles$a.container, className]);
4636
- $[0] = className;
4637
- $[1] = t1;
4806
+ const $ = c(13);
4807
+ let className;
4808
+ let height;
4809
+ let props;
4810
+ let width;
4811
+ if ($[0] !== t0) {
4812
+ ({
4813
+ width,
4814
+ height,
4815
+ className,
4816
+ ...props
4817
+ } = t0);
4818
+ $[0] = t0;
4819
+ $[1] = className;
4820
+ $[2] = height;
4821
+ $[3] = props;
4822
+ $[4] = width;
4638
4823
  } else {
4639
- t1 = $[1];
4824
+ className = $[1];
4825
+ height = $[2];
4826
+ props = $[3];
4827
+ width = $[4];
4640
4828
  }
4641
- let t2;
4642
- let t3;
4643
- if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
4644
- t2 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4829
+ let t1;
4830
+ if ($[5] !== height || $[6] !== width) {
4831
+ t1 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4645
4832
  icon: faVideo,
4646
- className: styles$a.icon
4833
+ className: "d-block mb-1",
4834
+ style: {
4835
+ width,
4836
+ height
4837
+ }
4647
4838
  });
4648
- t3 = /*#__PURE__*/jsx("div", {
4649
- className: styles$a.label,
4839
+ $[5] = height;
4840
+ $[6] = width;
4841
+ $[7] = t1;
4842
+ } else {
4843
+ t1 = $[7];
4844
+ }
4845
+ let t2;
4846
+ if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
4847
+ t2 = /*#__PURE__*/jsx("div", {
4848
+ style: {
4849
+ fontSize: "0.75em"
4850
+ },
4650
4851
  children: "360"
4651
4852
  });
4652
- $[2] = t2;
4653
- $[3] = t3;
4853
+ $[8] = t2;
4654
4854
  } else {
4655
- t2 = $[2];
4656
- t3 = $[3];
4855
+ t2 = $[8];
4657
4856
  }
4658
- let t4;
4659
- if ($[4] !== height || $[5] !== t1 || $[6] !== width) {
4660
- t4 = /*#__PURE__*/jsxs(PlaceholderBlock, {
4661
- width: width,
4662
- height: height,
4663
- className: t1,
4664
- boxClassName: styles$a.box,
4665
- children: [t2, t3]
4857
+ let t3;
4858
+ if ($[9] !== className || $[10] !== props || $[11] !== t1) {
4859
+ t3 = /*#__PURE__*/jsxs(PlaceholderBlock, {
4860
+ ...props,
4861
+ className: className,
4862
+ boxClassName: "d-flex flex-column align-items-center justify-content-center",
4863
+ children: [t1, t2]
4666
4864
  });
4667
- $[4] = height;
4668
- $[5] = t1;
4669
- $[6] = width;
4670
- $[7] = t4;
4865
+ $[9] = className;
4866
+ $[10] = props;
4867
+ $[11] = t1;
4868
+ $[12] = t3;
4671
4869
  } else {
4672
- t4 = $[7];
4870
+ t3 = $[12];
4673
4871
  }
4674
- return t4;
4872
+ return t3;
4675
4873
  }
4676
4874
 
4677
4875
  function VideoLoop(t0) {
4678
- const $ = c(6);
4679
- const {
4680
- width,
4681
- height,
4682
- className
4683
- } = t0;
4876
+ const $ = c(14);
4877
+ let height;
4878
+ let props;
4879
+ let width;
4880
+ if ($[0] !== t0) {
4881
+ ({
4882
+ width,
4883
+ height,
4884
+ ...props
4885
+ } = t0);
4886
+ $[0] = t0;
4887
+ $[1] = height;
4888
+ $[2] = props;
4889
+ $[3] = width;
4890
+ } else {
4891
+ height = $[1];
4892
+ props = $[2];
4893
+ width = $[3];
4894
+ }
4684
4895
  let t1;
4685
- let t2;
4686
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
4896
+ if ($[4] !== height || $[5] !== width) {
4687
4897
  t1 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4688
4898
  icon: faPlay,
4689
- className: styles$d.icon
4899
+ style: {
4900
+ width,
4901
+ height
4902
+ }
4690
4903
  });
4904
+ $[4] = height;
4905
+ $[5] = width;
4906
+ $[6] = t1;
4907
+ } else {
4908
+ t1 = $[6];
4909
+ }
4910
+ let t2;
4911
+ if ($[7] !== height || $[8] !== width) {
4691
4912
  t2 = /*#__PURE__*/jsx(FontAwesomeIcon, {
4692
4913
  icon: faRedo,
4693
- className: styles$d.icon
4914
+ style: {
4915
+ width,
4916
+ height
4917
+ }
4694
4918
  });
4695
- $[0] = t1;
4696
- $[1] = t2;
4919
+ $[7] = height;
4920
+ $[8] = width;
4921
+ $[9] = t2;
4697
4922
  } else {
4698
- t1 = $[0];
4699
- t2 = $[1];
4923
+ t2 = $[9];
4700
4924
  }
4701
4925
  let t3;
4702
- if ($[2] !== className || $[3] !== height || $[4] !== width) {
4926
+ if ($[10] !== props || $[11] !== t1 || $[12] !== t2) {
4703
4927
  t3 = /*#__PURE__*/jsxs(PlaceholderBlock, {
4704
- width: width,
4705
- height: height,
4706
- className: className,
4928
+ ...props,
4707
4929
  children: [t1, t2]
4708
- });
4709
- $[2] = className;
4710
- $[3] = height;
4711
- $[4] = width;
4712
- $[5] = t3;
4930
+ });
4931
+ $[10] = props;
4932
+ $[11] = t1;
4933
+ $[12] = t2;
4934
+ $[13] = t3;
4713
4935
  } else {
4714
- t3 = $[5];
4936
+ t3 = $[13];
4715
4937
  }
4716
4938
  return t3;
4717
4939
  }
4718
4940
 
4719
- var styles$9 = {"container":"micromag-core-screens-screen-sizer-container","frame":"micromag-core-screens-screen-sizer-frame","screen":"micromag-core-screens-screen-sizer-screen"};
4941
+ var styles$5 = {"container":"micromag-core-screens-screen-sizer-container","frame":"micromag-core-screens-screen-sizer-frame","screen":"micromag-core-screens-screen-sizer-screen"};
4720
4942
 
4721
4943
  function ScreenSizer(t0) {
4722
4944
  const $ = c(26);
@@ -4817,7 +5039,7 @@ function ScreenSizer(t0) {
4817
5039
  const hasFrameSize = frameWidth !== null && frameHeight !== null;
4818
5040
  let t12;
4819
5041
  if ($[11] !== className) {
4820
- t12 = classNames([styles$9.container, className]);
5042
+ t12 = classNames([styles$5.container, className]);
4821
5043
  $[11] = className;
4822
5044
  $[12] = t12;
4823
5045
  } else {
@@ -4827,13 +5049,13 @@ function ScreenSizer(t0) {
4827
5049
  let t14;
4828
5050
  if ($[13] !== children || $[14] !== frameHeight || $[15] !== frameWidth || $[16] !== hasFrameSize || $[17] !== screenHeight || $[18] !== screenSize || $[19] !== screenTransform || $[20] !== screenWidth) {
4829
5051
  t14 = hasFrameSize ? /*#__PURE__*/jsx("div", {
4830
- className: styles$9.frame,
5052
+ className: styles$5.frame,
4831
5053
  style: {
4832
5054
  width: frameWidth,
4833
5055
  height: frameHeight
4834
5056
  },
4835
5057
  children: /*#__PURE__*/jsx("div", {
4836
- className: styles$9.screen,
5058
+ className: styles$5.screen,
4837
5059
  style: {
4838
5060
  width: screenWidth,
4839
5061
  height: screenHeight,
@@ -4877,7 +5099,7 @@ function ScreenSizer(t0) {
4877
5099
  return t15;
4878
5100
  }
4879
5101
 
4880
- var styles$8 = {"container":"micromag-core-screens-screen-container"};
5102
+ var styles$4 = {"container":"micromag-core-screens-screen-container"};
4881
5103
 
4882
5104
  function Screen(t0) {
4883
5105
  const $ = c(20);
@@ -4931,7 +5153,7 @@ function Screen(t0) {
4931
5153
  let t14;
4932
5154
  if ($[5] !== ScreenComponent || $[6] !== active || $[7] !== className || $[8] !== component || $[9] !== current || $[10] !== index || $[11] !== mediaRef || $[12] !== preload || $[13] !== screen) {
4933
5155
  t14 = ScreenComponent !== null ? /*#__PURE__*/jsx("div", {
4934
- className: classNames([styles$8.container, className]),
5156
+ className: classNames([styles$4.container, className]),
4935
5157
  children: /*#__PURE__*/jsx(ScreenComponent, {
4936
5158
  ...screen,
4937
5159
  index: index,
@@ -4976,7 +5198,7 @@ function Screen(t0) {
4976
5198
  return t15;
4977
5199
  }
4978
5200
 
4979
- var styles$7 = {"screen":"micromag-core-screens-screen-placeholder-screen"};
5201
+ var styles$3 = {"screen":"micromag-core-screens-screen-placeholder-screen"};
4980
5202
 
4981
5203
  function ScreenPlaceholder(t0) {
4982
5204
  const $ = c(24);
@@ -5019,15 +5241,15 @@ function ScreenPlaceholder(t0) {
5019
5241
  t6 = $[8];
5020
5242
  }
5021
5243
  const layout = t1 === undefined ? undefined : t1;
5022
- const screenWidth = t2 === undefined ? 100 : t2;
5023
- const screenHeight = t3 === undefined ? 150 : t3;
5244
+ const screenWidth = t2 === undefined ? 240 : t2;
5245
+ const screenHeight = t3 === undefined ? 360 : t3;
5024
5246
  const screenState = t4 === undefined ? null : t4;
5025
5247
  const withSize = t5 === undefined ? false : t5;
5026
5248
  const className = t6 === undefined ? null : t6;
5027
5249
  const t7 = !withSize;
5028
5250
  let t8;
5029
5251
  if ($[9] !== className || $[10] !== t7) {
5030
- t8 = classNames([styles$7.screen, {
5252
+ t8 = classNames([styles$3.screen, {
5031
5253
  [className]: t7
5032
5254
  }]);
5033
5255
  $[9] = className;
@@ -5076,7 +5298,7 @@ function ScreenPlaceholder(t0) {
5076
5298
  return t10;
5077
5299
  }
5078
5300
 
5079
- var styles$6 = {"screen":"micromag-core-screens-preview-screen"};
5301
+ var styles$2 = {"screen":"micromag-core-screens-preview-screen"};
5080
5302
 
5081
5303
  function ScreenPreview(t0) {
5082
5304
  const $ = c(34);
@@ -5143,7 +5365,7 @@ function ScreenPreview(t0) {
5143
5365
  const t11 = !withSize;
5144
5366
  let t12;
5145
5367
  if ($[12] !== className || $[13] !== t11) {
5146
- t12 = classNames([styles$6.screen, {
5368
+ t12 = classNames([styles$2.screen, {
5147
5369
  [className]: t11
5148
5370
  }]);
5149
5371
  $[12] = className;
@@ -5211,282 +5433,246 @@ function ScreenPreview(t0) {
5211
5433
  return screenWithSize;
5212
5434
  }
5213
5435
 
5214
- var styles$5 = {"container":"micromag-core-placeholders-conversation-container","icon":"micromag-core-placeholders-conversation-icon","message":"micromag-core-placeholders-conversation-message","placeholderMessage0":"micromag-core-placeholders-conversation-placeholderMessage0","placeholderMessage1":"micromag-core-placeholders-conversation-placeholderMessage1","placeholderMessage2":"micromag-core-placeholders-conversation-placeholderMessage2","placeholderMessage3":"micromag-core-placeholders-conversation-placeholderMessage3"};
5215
-
5216
- function Conversation() {
5217
- const $ = c(1);
5218
- let t0;
5219
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
5220
- t0 = /*#__PURE__*/jsxs("div", {
5221
- className: styles$5.container,
5222
- children: [[...Array(4)].map(_temp$2), /*#__PURE__*/jsx(FontAwesomeIcon, {
5223
- icon: faCommentDots,
5224
- className: styles$5.icon
5225
- })]
5436
+ function Conversation(t0) {
5437
+ const $ = c(6);
5438
+ const {
5439
+ className
5440
+ } = t0;
5441
+ let t1;
5442
+ if ($[0] !== className) {
5443
+ t1 = classNames(["d-flex", "flex-column", className]);
5444
+ $[0] = className;
5445
+ $[1] = t1;
5446
+ } else {
5447
+ t1 = $[1];
5448
+ }
5449
+ let t2;
5450
+ let t3;
5451
+ if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
5452
+ t2 = [0.6, 0.5, 0.7, 0.8].map(_temp$3);
5453
+ t3 = /*#__PURE__*/jsx(FontAwesomeIcon, {
5454
+ icon: faCommentDots,
5455
+ className: "d-block ms-auto mt-2 fs-1"
5226
5456
  });
5227
- $[0] = t0;
5457
+ $[2] = t2;
5458
+ $[3] = t3;
5228
5459
  } else {
5229
- t0 = $[0];
5460
+ t2 = $[2];
5461
+ t3 = $[3];
5230
5462
  }
5231
- return t0;
5463
+ let t4;
5464
+ if ($[4] !== t1) {
5465
+ t4 = /*#__PURE__*/jsxs(PlaceholderBlock, {
5466
+ className: t1,
5467
+ children: [t2, t3]
5468
+ });
5469
+ $[4] = t1;
5470
+ $[5] = t4;
5471
+ } else {
5472
+ t4 = $[5];
5473
+ }
5474
+ return t4;
5232
5475
  }
5233
- function _temp$2(e, idx) {
5476
+ function _temp$3(width, idx) {
5234
5477
  return /*#__PURE__*/jsx("div", {
5235
- className: classNames([styles$5.message, styles$5[`placeholderMessage${idx}`]])
5478
+ className: "mb-1 rounded ms-auto",
5479
+ style: {
5480
+ backgroundColor: "currentcolor",
5481
+ height: "1em",
5482
+ width: `${width * 100}%`
5483
+ }
5236
5484
  }, `message-${idx + 1}`);
5237
5485
  }
5238
5486
 
5239
5487
  function InputText(t0) {
5240
- const $ = c(4);
5241
- const {
5242
- width: t1,
5243
- height: t2,
5244
- className
5245
- } = t0;
5246
- const width = t1 === undefined ? "75%" : t1;
5247
- const height = t2 === undefined ? "0.5em" : t2;
5248
- let t3;
5249
- if ($[0] !== className || $[1] !== height || $[2] !== width) {
5250
- t3 = /*#__PURE__*/jsx(PlaceholderBlock, {
5488
+ const $ = c(8);
5489
+ let className;
5490
+ let props;
5491
+ if ($[0] !== t0) {
5492
+ ({
5493
+ className,
5494
+ ...props
5495
+ } = t0);
5496
+ $[0] = t0;
5497
+ $[1] = className;
5498
+ $[2] = props;
5499
+ } else {
5500
+ className = $[1];
5501
+ props = $[2];
5502
+ }
5503
+ let t1;
5504
+ if ($[3] !== className) {
5505
+ t1 = classNames(["rounded", className]);
5506
+ $[3] = className;
5507
+ $[4] = t1;
5508
+ } else {
5509
+ t1 = $[4];
5510
+ }
5511
+ let t2;
5512
+ if ($[5] !== props || $[6] !== t1) {
5513
+ t2 = /*#__PURE__*/jsx(PlaceholderBlock, {
5251
5514
  outline: true,
5252
- width: width,
5253
- height: height,
5254
- className: className
5515
+ height: "1em",
5516
+ className: t1,
5517
+ ...props
5255
5518
  });
5256
- $[0] = className;
5257
- $[1] = height;
5258
- $[2] = width;
5259
- $[3] = t3;
5519
+ $[5] = props;
5520
+ $[6] = t1;
5521
+ $[7] = t2;
5260
5522
  } else {
5261
- t3 = $[3];
5523
+ t2 = $[7];
5262
5524
  }
5263
- return t3;
5525
+ return t2;
5264
5526
  }
5265
5527
 
5266
- var styles$4 = {"container":"micromag-core-placeholders-quiz-answer-container","block":"micromag-core-placeholders-quiz-answer-block","answer":"micromag-core-placeholders-quiz-answer-answer","answerIcon":"micromag-core-placeholders-quiz-answer-answerIcon","good":"micromag-core-placeholders-quiz-answer-good"};
5267
-
5268
5528
  function Answer$1(t0) {
5269
- const $ = c(13);
5529
+ const $ = c(8);
5270
5530
  const {
5271
- width: t1,
5272
- height: t2,
5273
5531
  className,
5274
- good: t3
5532
+ good: t1
5275
5533
  } = t0;
5276
- const width = t1 === undefined ? "75%" : t1;
5277
- const height = t2 === undefined ? "0.3em" : t2;
5278
- const good = t3 === undefined ? true : t3;
5279
- let t4;
5280
- if ($[0] !== className || $[1] !== good) {
5281
- t4 = classNames([styles$4.container, className, {
5282
- [styles$4.good]: good
5283
- }]);
5534
+ const good = t1 === undefined ? true : t1;
5535
+ let t2;
5536
+ if ($[0] !== className) {
5537
+ t2 = classNames(["d-flex", "align-items-center", "mw-75", className]);
5284
5538
  $[0] = className;
5285
- $[1] = good;
5286
- $[2] = t4;
5287
- } else {
5288
- t4 = $[2];
5289
- }
5290
- const t5 = good ? faCheck : faTimes;
5291
- let t6;
5292
- if ($[3] !== t5) {
5293
- t6 = /*#__PURE__*/jsx("div", {
5294
- className: styles$4.answer,
5295
- children: /*#__PURE__*/jsx(FontAwesomeIcon, {
5296
- className: styles$4.answerIcon,
5297
- icon: t5
5298
- })
5299
- });
5300
- $[3] = t5;
5301
- $[4] = t6;
5539
+ $[1] = t2;
5302
5540
  } else {
5303
- t6 = $[4];
5541
+ t2 = $[1];
5304
5542
  }
5305
- let t7;
5306
- if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
5307
- t7 = /*#__PURE__*/jsx(PlaceholderText, {
5308
- line: 1,
5309
- height: "0.2em"
5543
+ const t3 = good ? faCheck : faTimes;
5544
+ let t4;
5545
+ if ($[2] !== t3) {
5546
+ t4 = /*#__PURE__*/jsx(FontAwesomeIcon, {
5547
+ className: "me-2 fs-2",
5548
+ icon: t3
5310
5549
  });
5311
- $[5] = t7;
5550
+ $[2] = t3;
5551
+ $[3] = t4;
5312
5552
  } else {
5313
- t7 = $[5];
5553
+ t4 = $[3];
5314
5554
  }
5315
- let t8;
5316
- if ($[6] !== height || $[7] !== width) {
5317
- t8 = /*#__PURE__*/jsx(PlaceholderBlock, {
5555
+ let t5;
5556
+ if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
5557
+ t5 = /*#__PURE__*/jsx(PlaceholderBlock, {
5318
5558
  outline: true,
5319
- width: width,
5320
- height: height,
5321
- className: styles$4.block,
5322
- children: t7
5559
+ className: "w-100",
5560
+ children: /*#__PURE__*/jsx(PlaceholderText, {
5561
+ lines: 1,
5562
+ height: "1em"
5563
+ })
5323
5564
  });
5324
- $[6] = height;
5325
- $[7] = width;
5326
- $[8] = t8;
5565
+ $[4] = t5;
5327
5566
  } else {
5328
- t8 = $[8];
5567
+ t5 = $[4];
5329
5568
  }
5330
- let t9;
5331
- if ($[9] !== t4 || $[10] !== t6 || $[11] !== t8) {
5332
- t9 = /*#__PURE__*/jsxs("div", {
5333
- className: t4,
5334
- children: [t6, t8]
5569
+ let t6;
5570
+ if ($[5] !== t2 || $[6] !== t4) {
5571
+ t6 = /*#__PURE__*/jsxs("div", {
5572
+ className: t2,
5573
+ children: [t4, t5]
5335
5574
  });
5336
- $[9] = t4;
5337
- $[10] = t6;
5338
- $[11] = t8;
5339
- $[12] = t9;
5575
+ $[5] = t2;
5576
+ $[6] = t4;
5577
+ $[7] = t6;
5340
5578
  } else {
5341
- t9 = $[12];
5579
+ t6 = $[7];
5342
5580
  }
5343
- return t9;
5581
+ return t6;
5344
5582
  }
5345
5583
 
5346
- var styles$3 = {"container":"micromag-core-placeholders-share-options-container","box":"micromag-core-placeholders-share-options-box","icon":"micromag-core-placeholders-share-options-icon","item":"micromag-core-placeholders-share-options-item"};
5347
-
5348
- function Title(props) {
5349
- const $ = c(9);
5350
- const t0 = props.className !== null;
5584
+ function ShareOptions(t0) {
5585
+ const $ = c(5);
5586
+ const {
5587
+ className
5588
+ } = t0;
5351
5589
  let t1;
5352
- if ($[0] !== props.className || $[1] !== t0) {
5353
- t1 = classNames([styles$3.container, {
5354
- [props.className]: t0
5355
- }]);
5356
- $[0] = props.className;
5357
- $[1] = t0;
5358
- $[2] = t1;
5590
+ if ($[0] !== className) {
5591
+ t1 = classNames(["d-flex", "flex-column", "gap-1", className]);
5592
+ $[0] = className;
5593
+ $[1] = t1;
5359
5594
  } else {
5360
- t1 = $[2];
5595
+ t1 = $[1];
5361
5596
  }
5362
5597
  let t2;
5363
- if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
5364
- t2 = /*#__PURE__*/jsx("div", {
5365
- className: styles$3.item,
5366
- children: /*#__PURE__*/jsx(FontAwesomeIcon, {
5367
- icon: faCircle,
5368
- className: styles$3.icon
5369
- })
5370
- });
5371
- $[3] = t2;
5598
+ if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
5599
+ t2 = [0, 1, 2].map(_temp$2);
5600
+ $[2] = t2;
5372
5601
  } else {
5373
- t2 = $[3];
5602
+ t2 = $[2];
5374
5603
  }
5375
5604
  let t3;
5376
- if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
5605
+ if ($[3] !== t1) {
5377
5606
  t3 = /*#__PURE__*/jsx("div", {
5378
- className: styles$3.item,
5379
- children: /*#__PURE__*/jsx(FontAwesomeIcon, {
5380
- icon: faCircle,
5381
- className: styles$3.icon
5382
- })
5607
+ className: t1,
5608
+ children: t2
5383
5609
  });
5610
+ $[3] = t1;
5384
5611
  $[4] = t3;
5385
5612
  } else {
5386
5613
  t3 = $[4];
5387
5614
  }
5388
- let t4;
5389
- if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
5390
- t4 = /*#__PURE__*/jsx("div", {
5391
- className: styles$3.item,
5392
- children: /*#__PURE__*/jsx(FontAwesomeIcon, {
5393
- icon: faCircle,
5394
- className: styles$3.icon
5395
- })
5396
- });
5397
- $[5] = t4;
5398
- } else {
5399
- t4 = $[5];
5400
- }
5401
- let t5;
5402
- if ($[6] !== props || $[7] !== t1) {
5403
- t5 = /*#__PURE__*/jsxs(PlaceholderBlock, {
5404
- ...props,
5405
- width: "100%",
5406
- height: "100%",
5407
- className: t1,
5408
- boxClassName: styles$3.box,
5409
- children: [t2, t3, t4]
5410
- });
5411
- $[6] = props;
5412
- $[7] = t1;
5413
- $[8] = t5;
5414
- } else {
5415
- t5 = $[8];
5416
- }
5417
- return t5;
5615
+ return t3;
5616
+ }
5617
+ function _temp$2(idx) {
5618
+ return /*#__PURE__*/jsx("div", {
5619
+ className: "d-flex w-100 p-1 bg-secondary bg-opacity-25",
5620
+ children: /*#__PURE__*/jsx(FontAwesomeIcon, {
5621
+ icon: faCircle,
5622
+ style: {
5623
+ width: "10px",
5624
+ height: "auto"
5625
+ }
5626
+ })
5627
+ }, `item-${idx}`);
5418
5628
  }
5419
-
5420
- var styles$2 = {"container":"micromag-core-placeholders-survey-answer-container","block":"micromag-core-placeholders-survey-answer-block","percent":"micromag-core-placeholders-survey-answer-percent","percentIcon":"micromag-core-placeholders-survey-answer-percentIcon"};
5421
5629
 
5422
5630
  function Answer(t0) {
5423
- const $ = c(10);
5631
+ const $ = c(6);
5424
5632
  const {
5425
- width: t1,
5426
- height: t2,
5427
5633
  className
5428
5634
  } = t0;
5429
- const width = t1 === undefined ? "75%" : t1;
5430
- const height = t2 === undefined ? "0.3em" : t2;
5431
- let t3;
5635
+ let t1;
5432
5636
  if ($[0] !== className) {
5433
- t3 = classNames([styles$2.container, className]);
5637
+ t1 = classNames(["d-flex", "align-items-center", "mw-75", className]);
5434
5638
  $[0] = className;
5435
- $[1] = t3;
5639
+ $[1] = t1;
5436
5640
  } else {
5437
- t3 = $[1];
5641
+ t1 = $[1];
5438
5642
  }
5439
- let t4;
5643
+ let t2;
5644
+ let t3;
5440
5645
  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
5441
- t4 = /*#__PURE__*/jsx(PlaceholderText, {
5442
- line: 1,
5443
- height: "0.2em"
5444
- });
5445
- $[2] = t4;
5446
- } else {
5447
- t4 = $[2];
5448
- }
5449
- let t5;
5450
- if ($[3] !== height || $[4] !== width) {
5451
- t5 = /*#__PURE__*/jsx(PlaceholderBlock, {
5646
+ t2 = /*#__PURE__*/jsx(PlaceholderBlock, {
5452
5647
  outline: true,
5453
- width: width,
5454
- height: height,
5455
- className: styles$2.block,
5456
- children: t4
5457
- });
5458
- $[3] = height;
5459
- $[4] = width;
5460
- $[5] = t5;
5461
- } else {
5462
- t5 = $[5];
5463
- }
5464
- let t6;
5465
- if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
5466
- t6 = /*#__PURE__*/jsx("div", {
5467
- className: styles$2.percent,
5468
- children: /*#__PURE__*/jsx(FontAwesomeIcon, {
5469
- className: styles$2.percentIcon,
5470
- icon: faPercent
5648
+ className: "w-100 me-2",
5649
+ children: /*#__PURE__*/jsx(PlaceholderText, {
5650
+ lines: 1,
5651
+ height: "1em"
5471
5652
  })
5472
5653
  });
5473
- $[6] = t6;
5654
+ t3 = /*#__PURE__*/jsx(FontAwesomeIcon, {
5655
+ icon: faPercent,
5656
+ className: "fs-2"
5657
+ });
5658
+ $[2] = t2;
5659
+ $[3] = t3;
5474
5660
  } else {
5475
- t6 = $[6];
5661
+ t2 = $[2];
5662
+ t3 = $[3];
5476
5663
  }
5477
- let t7;
5478
- if ($[7] !== t3 || $[8] !== t5) {
5479
- t7 = /*#__PURE__*/jsxs("div", {
5480
- className: t3,
5481
- children: [t5, t6]
5664
+ let t4;
5665
+ if ($[4] !== t1) {
5666
+ t4 = /*#__PURE__*/jsxs("div", {
5667
+ className: t1,
5668
+ children: [t2, t3]
5482
5669
  });
5483
- $[7] = t3;
5484
- $[8] = t5;
5485
- $[9] = t7;
5670
+ $[4] = t1;
5671
+ $[5] = t4;
5486
5672
  } else {
5487
- t7 = $[9];
5673
+ t4 = $[5];
5488
5674
  }
5489
- return t7;
5675
+ return t4;
5490
5676
  }
5491
5677
 
5492
5678
  var Placeholders = /*#__PURE__*/Object.freeze({
@@ -5496,27 +5682,27 @@ var Placeholders = /*#__PURE__*/Object.freeze({
5496
5682
  Audio: Audio,
5497
5683
  Button: Button,
5498
5684
  Conversation: Conversation,
5499
- Image: Image,
5685
+ Image: PlaceholderImage,
5500
5686
  InputText: InputText,
5501
5687
  Line: Line,
5502
5688
  Map: Map,
5503
5689
  MapPath: MapPath,
5504
5690
  QuizAnswer: Answer$1,
5505
5691
  Quote: Quote,
5506
- ShareOptions: Title,
5692
+ ShareOptions: ShareOptions,
5507
5693
  ShortText: ShortText,
5508
5694
  Subtitle: Subtitle,
5509
5695
  SurveyAnswer: Answer,
5510
5696
  Text: TextPlaceholder,
5511
5697
  Timeline: Timeline,
5512
- Title: Title$1,
5698
+ Title: Title,
5513
5699
  Video: Video,
5514
5700
  Video360: Video360,
5515
5701
  VideoLoop: VideoLoop
5516
5702
  });
5517
5703
 
5518
5704
  function ScreenElement(t0) {
5519
- const $ = c(10);
5705
+ const $ = c(11);
5520
5706
  const {
5521
5707
  children: t1,
5522
5708
  placeholder: t2,
@@ -5525,7 +5711,8 @@ function ScreenElement(t0) {
5525
5711
  preview: t5,
5526
5712
  isEmpty: t6,
5527
5713
  placeholderProps: t7,
5528
- emptyClassName: t8
5714
+ emptyClassName: t8,
5715
+ placeholderClassName: t9
5529
5716
  } = t0;
5530
5717
  const children = t1 === undefined ? null : t1;
5531
5718
  const placeholder = t2 === undefined ? null : t2;
@@ -5535,50 +5722,53 @@ function ScreenElement(t0) {
5535
5722
  const isEmpty = t6 === undefined ? false : t6;
5536
5723
  const placeholderProps = t7 === undefined ? null : t7;
5537
5724
  const emptyClassName = t8 === undefined ? null : t8;
5725
+ const placeholderClassName = t9 === undefined ? null : t9;
5538
5726
  const {
5539
5727
  isPlaceholder,
5540
5728
  isEdit,
5541
5729
  isPreview
5542
5730
  } = useScreenRenderContext();
5543
5731
  if (isPlaceholder) {
5544
- let t9;
5732
+ let t10;
5545
5733
  if ($[0] !== placeholder) {
5546
- t9 = isString(placeholder) ? getComponentFromName(placeholder, Placeholders) : null;
5734
+ t10 = isString(placeholder) ? getComponentFromName(placeholder, Placeholders) : null;
5547
5735
  $[0] = placeholder;
5548
- $[1] = t9;
5736
+ $[1] = t10;
5549
5737
  } else {
5550
- t9 = $[1];
5738
+ t10 = $[1];
5551
5739
  }
5552
- const PlaceholderComponent = t9;
5553
- let t10;
5554
- if ($[2] !== PlaceholderComponent || $[3] !== placeholder || $[4] !== placeholderProps) {
5555
- t10 = PlaceholderComponent !== null ? /*#__PURE__*/jsx(PlaceholderComponent, {
5740
+ const PlaceholderComponent = t10;
5741
+ let t11;
5742
+ if ($[2] !== PlaceholderComponent || $[3] !== placeholder || $[4] !== placeholderClassName || $[5] !== placeholderProps) {
5743
+ t11 = PlaceholderComponent !== null ? /*#__PURE__*/jsx(PlaceholderComponent, {
5744
+ className: placeholderClassName,
5556
5745
  ...placeholderProps
5557
5746
  }) : placeholder;
5558
5747
  $[2] = PlaceholderComponent;
5559
5748
  $[3] = placeholder;
5560
- $[4] = placeholderProps;
5561
- $[5] = t10;
5749
+ $[4] = placeholderClassName;
5750
+ $[5] = placeholderProps;
5751
+ $[6] = t11;
5562
5752
  } else {
5563
- t10 = $[5];
5753
+ t11 = $[6];
5564
5754
  }
5565
- return t10;
5755
+ return t11;
5566
5756
  }
5567
5757
  if (isEdit && isEmpty) {
5568
- let t9;
5569
- if ($[6] !== empty || $[7] !== emptyClassName || $[8] !== emptyLabel) {
5570
- t9 = empty !== null ? empty : /*#__PURE__*/jsx(Empty, {
5758
+ let t10;
5759
+ if ($[7] !== empty || $[8] !== emptyClassName || $[9] !== emptyLabel) {
5760
+ t10 = empty !== null ? empty : /*#__PURE__*/jsx(Empty, {
5571
5761
  className: emptyClassName,
5572
5762
  children: emptyLabel
5573
5763
  });
5574
- $[6] = empty;
5575
- $[7] = emptyClassName;
5576
- $[8] = emptyLabel;
5577
- $[9] = t9;
5764
+ $[7] = empty;
5765
+ $[8] = emptyClassName;
5766
+ $[9] = emptyLabel;
5767
+ $[10] = t10;
5578
5768
  } else {
5579
- t9 = $[9];
5769
+ t10 = $[10];
5580
5770
  }
5581
- return t9;
5771
+ return t10;
5582
5772
  }
5583
5773
  if (isPreview && preview !== null) {
5584
5774
  return preview;
@@ -6106,4 +6296,4 @@ function _temp(it) {
6106
6296
  return it !== null;
6107
6297
  }
6108
6298
 
6109
- export { ArrowIcon, BackButton, Breadcrumb, Button$1 as Button, Buttons, Card, ClearButton, Close, CloseIcon, CollapsablePanel, Date$1 as Date, Detector, Dropdown as DropdownMenu, ElementComponent as Element, Empty, FieldForm, FontFaces, Form, FormPanel, FullscreenIcon, HighlightStyle, Label, Link, LinkIcon, LinkStyle, Media, Menu, Meta, Modal, ModalDialog, ModalPortal, Modals, MuteIcon, Navbar, PaginationMenu as Pagination, Panel, PanelPortal, Panels, PauseIcon, AdFrame as PlaceholderAdFrame, AdImage as PlaceholderAdImage, Audio as PlaceholderAudio, Button as PlaceholderButton, Image as PlaceholderImage, Line as PlaceholderLine, Map as PlaceholderMap, MapPath as PlaceholderMapPath, Quote as PlaceholderQuote, ShortText as PlaceholderShortText, Subtitle as PlaceholderSubtitle, TextPlaceholder as PlaceholderText, Timeline as PlaceholderTimeline, Title$1 as PlaceholderTitle, Video as PlaceholderVideo, Video360 as PlaceholderVideo360, VideoLoop as PlaceholderVideoLoop, PlayIcon, Screen, ScreenElement, ScreenPlaceholder, ScreenPreview, ScreenSizer, Screens, Slideshow, Spinner, TabsMenu as Tabs, Transitions, TransitionsStagger, UnmuteIcon };
6299
+ export { ArrowIcon, BackButton, Breadcrumb, Button$1 as Button, Buttons, Card, ClearButton, Close, CloseIcon, CollapsablePanel, Date$1 as Date, Detector, Dropdown as DropdownMenu, ElementComponent as Element, Empty, FieldForm, FontFaces, Form, FormPanel, FullscreenIcon, HighlightStyle, Label, Link, LinkIcon, LinkStyle, Media, Menu, Meta, MuteIcon, Navbar, PaginationMenu as Pagination, Panel, PanelPortal, Panels, PauseIcon, AdFrame as PlaceholderAdFrame, AdImage as PlaceholderAdImage, Audio as PlaceholderAudio, Button as PlaceholderButton, PlaceholderImage, Line as PlaceholderLine, Map as PlaceholderMap, MapPath as PlaceholderMapPath, Quote as PlaceholderQuote, ShortText as PlaceholderShortText, Subtitle as PlaceholderSubtitle, TextPlaceholder as PlaceholderText, Timeline as PlaceholderTimeline, Title as PlaceholderTitle, Video as PlaceholderVideo, Video360 as PlaceholderVideo360, VideoLoop as PlaceholderVideoLoop, PlayIcon, Screen, ScreenElement, ScreenPlaceholder, ScreenPreview, ScreenSizer, Screens, Slideshow, Spinner, TabsMenu as Tabs, Transitions, TransitionsStagger, UnmuteIcon, UploadModal };