indicator-ui 0.0.180 → 0.0.181

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 (6) hide show
  1. package/dist/index.js +16 -4
  2. package/dist/index.js.map +1 -1
  3. package/dist/types/src/ui/FormBuilder/lib/formBuilder.d.ts +1 -1
  4. package/dist/types/src/ui/MediaViewer/types/MediaViewerTypes.d.ts +1 -1
  5. package/dist/types/src/ui/MediaViewer/ui/MediaViewer.d.ts +1 -1
  6. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -11886,10 +11886,22 @@ __webpack_require__.r(__webpack_exports__);
11886
11886
 
11887
11887
 
11888
11888
 
11889
- function MediaViewer({ media = [], initMediaIndex, nearestElementsOnly = true, onClose }) {
11890
- const [curMediaIndex, setCurMediaIndex] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(initMediaIndex != null && initMediaIndex >= 0 && initMediaIndex < media.length ? initMediaIndex : 0);
11889
+ function MediaViewer({ media = [], mediaIndex, nearestElementsOnly = true, onClose }) {
11890
+ const [curMediaIndex, setCurMediaIndex] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(0);
11891
11891
  const [muted, setMuted] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
11892
11892
  const [play, setPlay] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
11893
+ const getPrevIndex = (curIndex) => {
11894
+ return curIndex > 0 ? curIndex - 1 : undefined;
11895
+ };
11896
+ const getNextIndex = (curIndex) => {
11897
+ return curIndex < media.length - 1 ? curIndex + 1 : undefined;
11898
+ };
11899
+ (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
11900
+ const isValid = mediaIndex != null && mediaIndex >= 0 && mediaIndex < media.length ? mediaIndex : 0;
11901
+ if (mediaIndex !== curMediaIndex && isValid) {
11902
+ setCurMediaIndex(mediaIndex);
11903
+ }
11904
+ }, [mediaIndex]);
11893
11905
  const resetVideo = () => {
11894
11906
  setMuted(false);
11895
11907
  setPlay(false);
@@ -11925,7 +11937,7 @@ function MediaViewer({ media = [], initMediaIndex, nearestElementsOnly = true, o
11925
11937
  return undefined;
11926
11938
  }
11927
11939
  };
11928
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: _ui_MediaViewer_styles__WEBPACK_IMPORTED_MODULE_3__.MediaViewerStyle.MediaViewer, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_4__.Carousel, { activeIndex: curMediaIndex, setActiveIndex: setCurMediaIndex, children: media.map((item, idx) => (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: _ui_MediaViewer_styles__WEBPACK_IMPORTED_MODULE_3__.MediaViewerStyle.content, children: getContent(item, idx) })) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: _ui_MediaViewer_styles__WEBPACK_IMPORTED_MODULE_3__.MediaViewerStyle.control, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components__WEBPACK_IMPORTED_MODULE_2__.ControlBar, { muted: muted, play: play, onPlay: media[curMediaIndex]?.type === 'video' ? _play : undefined, onMute: media[curMediaIndex]?.type === 'video' ? mute : undefined, onNext: next, onClose: onClose, onPrev: prev }) })] }));
11940
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: _ui_MediaViewer_styles__WEBPACK_IMPORTED_MODULE_3__.MediaViewerStyle.MediaViewer, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_4__.Carousel, { activeIndex: curMediaIndex, setActiveIndex: setCurMediaIndex, children: media.map((item, idx) => (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: _ui_MediaViewer_styles__WEBPACK_IMPORTED_MODULE_3__.MediaViewerStyle.content, children: getContent(item, idx) }, idx)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: _ui_MediaViewer_styles__WEBPACK_IMPORTED_MODULE_3__.MediaViewerStyle.control, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components__WEBPACK_IMPORTED_MODULE_2__.ControlBar, { muted: muted, play: play, onPlay: media[curMediaIndex]?.type === 'video' ? _play : undefined, onMute: media[curMediaIndex]?.type === 'video' ? mute : undefined, onNext: getNextIndex(curMediaIndex) ? next : undefined, onPrev: getPrevIndex(curMediaIndex) ? prev : undefined, onClose: onClose }) })] }));
11929
11941
  }
11930
11942
 
11931
11943
 
@@ -11951,7 +11963,7 @@ __webpack_require__.r(__webpack_exports__);
11951
11963
 
11952
11964
 
11953
11965
  function ControlBar({ play, muted, onMute, onPlay, onClose, onPrev, onNext }) {
11954
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: _styles__WEBPACK_IMPORTED_MODULE_3__.ControlBarStyle.controlBar, children: [onMute != null && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: muted ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.VolumeXSVG, {}) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.VolumeMaxSVG, {}), size: 'small', hierarchy: 'secondary-gray', width: 'hug', onClick: onMute }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.ChevronLeftSVG, {}), size: 'large', hierarchy: 'secondary-gray', width: 'hug', onClick: onPrev }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.XCloseSVG, {}), size: 'ultra', hierarchy: 'secondary-gray', width: 'hug', onClick: onClose }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.ChevronRightSVG, {}), size: 'large', hierarchy: 'secondary-gray', width: 'hug', onClick: onNext }), onPlay != null && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: play ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.PauseCircleSVG, {}) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.PlaySVG, {}), size: 'small', hierarchy: 'secondary-gray', width: 'hug', onClick: onPlay })] }));
11966
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: _styles__WEBPACK_IMPORTED_MODULE_3__.ControlBarStyle.controlBar, children: [onMute != null && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: muted ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.VolumeXSVG, {}) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.VolumeMaxSVG, {}), size: 'small', hierarchy: 'secondary-gray', width: 'hug', onClick: onMute }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.ChevronLeftSVG, {}), size: 'large', hierarchy: 'secondary-gray', width: 'hug', disabled: onPrev == null, onClick: onPrev }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.XCloseSVG, {}), size: 'ultra', hierarchy: 'secondary-gray', width: 'hug', disabled: onClose == null, onClick: onClose }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.ChevronRightSVG, {}), size: 'large', hierarchy: 'secondary-gray', width: 'hug', disabled: onNext == null, onClick: onNext }), onPlay != null && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ui__WEBPACK_IMPORTED_MODULE_1__.Button, { iconLeft: play ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.PauseCircleSVG, {}) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_assets__WEBPACK_IMPORTED_MODULE_2__.PlaySVG, {}), size: 'small', hierarchy: 'secondary-gray', width: 'hug', onClick: onPlay })] }));
11955
11967
  }
11956
11968
 
11957
11969