@megafon/ui-shared 6.4.0 → 7.0.0

package/dist/es/components/AccordionBox/AccordionBox.css

@@ -1,15 +1 @@
-h1,
-h2,
-h3,
-h4,
-h5 {
-  margin: 0;
-}
-.mfui-accordion-box + .mfui-accordion-box {
-  margin-top: 8px;
-}
-@media screen and (min-width: 768px) {
-  .mfui-accordion-box + .mfui-accordion-box {
-    margin-top: 12px;
-  }
-}
+h1,h2,h3,h4,h5{margin:0}.mfui-accordion-box+.mfui-accordion-box{margin-top:8px}@media screen and (min-width:768px){.mfui-accordion-box+.mfui-accordion-box{margin-top:12px}}

package/dist/es/components/AccordionBox/AccordionBox.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { IHeaderProps } from '@megafon/ui-core/dist/lib/components/Header/Header';
-import './AccordionBox.less';
+import './AccordionBox.scss';
 export interface IAccordionBox {
     /** Дополнительные data атрибуты к внутренним элементам */
     dataAttrs?: {
@@ -43,5 +43,5 @@ export interface IAccordionBox {
     /** Обработчик клика */
     onClickAccordion?: (isOpened: boolean) => void;
 }
-declare const AccordionBox: React.FC<IAccordionBox>;
+declare const AccordionBox: React.FC<React.PropsWithChildren<IAccordionBox>>;
 export default AccordionBox;

package/dist/es/components/AccordionBox/AccordionBox.js

@@ -1,36 +1,27 @@
 import _extends from "@babel/runtime/helpers/extends";
-import "core-js/modules/es.array.index-of.js";
 import "core-js/modules/es.symbol.js";
-
+import "core-js/modules/es.array.index-of.js";
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
-
-  for (var p in s) {
-    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  }
-
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
-
 import * as React from 'react';
 import { Grid, GridColumn, Accordion } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
-import * as PropTypes from 'prop-types';
 import "./AccordionBox.css";
 import { getColumnConfig } from "../../helpers/getColumnConfig";
 var testIdPrefix = 'AccordionBox';
 var cn = cnCreate('mfui-accordion-box');
-
 var AccordionBox = function AccordionBox(_a) {
   var _a$hCenterAlignWide = _a.hCenterAlignWide,
-      hCenterAlignWide = _a$hCenterAlignWide === void 0 ? false : _a$hCenterAlignWide,
-      _a$isFullWidth = _a.isFullWidth,
-      isFullWidth = _a$isFullWidth === void 0 ? false : _a$isFullWidth,
-      restProps = __rest(_a, ["hCenterAlignWide", "isFullWidth"]);
-
+    hCenterAlignWide = _a$hCenterAlignWide === void 0 ? false : _a$hCenterAlignWide,
+    _a$isFullWidth = _a.isFullWidth,
+    isFullWidth = _a$isFullWidth === void 0 ? false : _a$isFullWidth,
+    restProps = __rest(_a, ["hCenterAlignWide", "isFullWidth"]);
   return /*#__PURE__*/React.createElement("div", {
     className: cn()
   }, /*#__PURE__*/React.createElement(Grid, {
@@ -48,38 +39,4 @@ var AccordionBox = function AccordionBox(_a) {
     }
   }), /*#__PURE__*/React.createElement(Accordion, restProps))));
 };
-
-AccordionBox.propTypes = {
-  dataAttrs: PropTypes.shape({
-    root: PropTypes.objectOf(PropTypes.string.isRequired),
-    header: PropTypes.shape({
-      root: PropTypes.objectOf(PropTypes.string.isRequired)
-    }),
-    collapse: PropTypes.shape({
-      root: PropTypes.objectOf(PropTypes.string.isRequired),
-      inner: PropTypes.objectOf(PropTypes.string.isRequired)
-    }),
-    titleWrap: PropTypes.objectOf(PropTypes.string.isRequired),
-    arrowUp: PropTypes.objectOf(PropTypes.string.isRequired),
-    arrowDown: PropTypes.objectOf(PropTypes.string.isRequired)
-  }),
-  rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
-    current: PropTypes.elementType
-  }), PropTypes.any])]),
-  title: PropTypes.string.isRequired,
-  titleTag: PropTypes.oneOf(['h1', 'h2', 'h3', 'h5']),
-  isFullWidth: PropTypes.bool,
-  isOpened: PropTypes.bool,
-  hasMicrodata: PropTypes.bool,
-  hCenterAlignWide: PropTypes.bool,
-  className: PropTypes.string,
-  classes: PropTypes.shape({
-    openedClass: PropTypes.string,
-    root: PropTypes.string,
-    collapse: PropTypes.string,
-    titleWrap: PropTypes.string,
-    title: PropTypes.string
-  }),
-  onClickAccordion: PropTypes.func
-};
 export default AccordionBox;

package/dist/es/components/AudioPlayer/AudioPlayer.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import './style/AudioPlayer.less';
+import * as React from 'react';
+import './style/AudioPlayer.scss';
 export interface IAudioPlayerProps {
     audioSrc: string;
     audioTitle: string;

package/dist/es/components/AudioPlayer/AudioPlayer.js

@@ -1,12 +1,11 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
+import * as React from 'react';
 import { Button } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
 import AudioProgress from "./AudioProgress";
 import AudioVolume from "./AudioVolume";
 import "./style/AudioPlayer.css";
-
 var IconPause = function IconPause(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     viewBox: "0 0 32 32"
@@ -14,7 +13,6 @@ var IconPause = function IconPause(props) {
     d: "M11 10.5v11a.5.5 0 00.5.5h2a.5.5 0 00.5-.5v-11a.5.5 0 00-.5-.5h-2a.5.5 0 00-.5.5zm7 0v11a.5.5 0 00.5.5h2a.5.5 0 00.5-.5v-11a.5.5 0 00-.5-.5h-2a.5.5 0 00-.5.5z"
   }));
 };
-
 var IconPlay = function IconPlay(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     viewBox: "0 0 32 32"
@@ -22,60 +20,47 @@ var IconPlay = function IconPlay(props) {
     d: "M11.5 22.13V9.87a.5.5 0 01.752-.431l10.508 6.13a.5.5 0 010 .863l-10.508 6.13a.5.5 0 01-.752-.433z"
   }));
 };
-
 var cn = cnCreate('mfui-audio-player');
-
 var AudioPlayer = function AudioPlayer(_ref) {
   var audioSrc = _ref.audioSrc,
-      audioTitle = _ref.audioTitle,
-      _ref$position = _ref.position,
-      position = _ref$position === void 0 ? 'center' : _ref$position,
-      isFullWidth = _ref.isFullWidth;
+    audioTitle = _ref.audioTitle,
+    _ref$position = _ref.position,
+    position = _ref$position === void 0 ? 'center' : _ref$position,
+    isFullWidth = _ref.isFullWidth;
   var audioRef = React.useRef(null);
-
   var _React$useState = React.useState(false),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      isPlaying = _React$useState2[0],
-      setIsPlaying = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    isPlaying = _React$useState2[0],
+    setIsPlaying = _React$useState2[1];
   var _React$useState3 = React.useState(false),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      isPause = _React$useState4[0],
-      setIsPause = _React$useState4[1];
-
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    isPause = _React$useState4[0],
+    setIsPause = _React$useState4[1];
   var handlePLay = function handlePLay() {
     var _a;
-
     setIsPlaying(true);
     setIsPause(false);
     (_a = audioRef.current) === null || _a === void 0 ? void 0 : _a.play();
   };
-
   var handlePause = function handlePause() {
     var _a;
-
     setIsPlaying(false);
     setIsPause(true);
     (_a = audioRef.current) === null || _a === void 0 ? void 0 : _a.pause();
   };
-
   var handleChangeAudioCurrentTime = function handleChangeAudioCurrentTime(currentTime) {
     if (!audioRef || !audioRef.current) {
       return;
     }
-
     audioRef.current.currentTime = currentTime;
   };
-
   var handleChangeAudioVolume = function handleChangeAudioVolume(volume) {
     if (!audioRef || !audioRef.current) {
       return;
     }
-
     audioRef.current.volume = volume;
     audioRef.current.muted = !volume;
   };
-
   var playingIconHandleClick = React.useMemo(function () {
     return isPlaying ? handlePause : handlePLay;
   }, [isPlaying]);
@@ -119,5 +104,4 @@ var AudioPlayer = function AudioPlayer(_ref) {
     onChangeAudioVolume: handleChangeAudioVolume
   })));
 };
-
 export default AudioPlayer;

package/dist/es/components/AudioPlayer/AudioProgress.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import './style/AudioProgress.less';
+import './style/AudioProgress.scss';
 export declare const INTERVAL_DELAY = 1000;
 export interface IAudioProgressProps {
     audioRef: React.MutableRefObject<HTMLAudioElement | null>;

package/dist/es/components/AudioPlayer/AudioProgress.js

@@ -1,6 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import "core-js/modules/web.timers.js";
 import "core-js/modules/es.number.constructor.js";
+import "core-js/modules/web.timers.js";
 import React from 'react';
 import { cnCreate } from '@megafon/ui-helpers';
 import AudioRange from "./AudioRange";
@@ -9,22 +9,19 @@ import timerFormat from "./timerFormatUtil";
 import "./style/AudioProgress.css";
 export var INTERVAL_DELAY = 1000;
 var cn = cnCreate('mfui-audio-progress');
-
 var AudioProgress = function AudioProgress(_ref) {
   var audioRef = _ref.audioRef,
-      audioTitle = _ref.audioTitle,
-      isPlaying = _ref.isPlaying,
-      isPause = _ref.isPause,
-      onChangeAudioCurrentTime = _ref.onChangeAudioCurrentTime,
-      onPlay = _ref.onPlay,
-      onSetIsPlaying = _ref.onSetIsPlaying;
+    audioTitle = _ref.audioTitle,
+    isPlaying = _ref.isPlaying,
+    isPause = _ref.isPause,
+    onChangeAudioCurrentTime = _ref.onChangeAudioCurrentTime,
+    onPlay = _ref.onPlay,
+    onSetIsPlaying = _ref.onSetIsPlaying;
   var intervalId = React.useRef(null);
-
   var _React$useState = React.useState(0),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      trackProgress = _React$useState2[0],
-      setTrackProgress = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    trackProgress = _React$useState2[0],
+    setTrackProgress = _React$useState2[1];
   var trackDuration = useTrackDuration(audioRef);
   var progressColorPercent = React.useMemo(function () {
     return trackProgress / trackDuration * 100;
@@ -36,41 +33,33 @@ var AudioProgress = function AudioProgress(_ref) {
     intervalId.current && clearInterval(intervalId.current);
     intervalId.current = setInterval(function () {
       var _a, _b, _c;
-
       if ((_a = audioRef.current) === null || _a === void 0 ? void 0 : _a.ended) {
         onSetIsPlaying === null || onSetIsPlaying === void 0 ? void 0 : onSetIsPlaying(false);
         setTrackProgress(Math.floor(((_b = audioRef.current) === null || _b === void 0 ? void 0 : _b.duration) || 0));
         return;
       }
-
       setTrackProgress(Math.floor(((_c = audioRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) || 0));
     }, INTERVAL_DELAY);
   }, [audioRef, onSetIsPlaying]);
-
   var handleScrubProgress = function handleScrubProgress(e) {
     var currentTime = Number(e.target.value);
     setTrackProgress(currentTime);
     onChangeAudioCurrentTime === null || onChangeAudioCurrentTime === void 0 ? void 0 : onChangeAudioCurrentTime(currentTime);
   };
-
   var handleScrubEndProgress = function handleScrubEndProgress() {
     if (!isPlaying) {
       onPlay === null || onPlay === void 0 ? void 0 : onPlay();
     }
-
     handleStartTimer();
   };
-
   React.useEffect(function () {
     var _a;
-
     setTrackProgress(Math.floor(((_a = audioRef === null || audioRef === void 0 ? void 0 : audioRef.current) === null || _a === void 0 ? void 0 : _a.currentTime) || 0));
   }, [audioRef]);
   React.useEffect(function () {
     if (isPlaying) {
       handleStartTimer();
     }
-
     if (isPause) {
       intervalId.current && clearInterval(intervalId.current);
     }
@@ -104,5 +93,4 @@ var AudioProgress = function AudioProgress(_ref) {
     }
   })));
 };
-
 export default AudioProgress;

package/dist/es/components/AudioPlayer/AudioRange.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import './style/AudioRange.less';
+import './style/AudioRange.scss';
 export interface IAudioRangeProps {
     className?: string;
     maxValue: number | string;

package/dist/es/components/AudioPlayer/AudioRange.js

@@ -3,17 +3,16 @@ import React from 'react';
 import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
 import "./style/AudioRange.css";
 var cn = cnCreate('mfui-audio-range');
-
 var AudioRange = function AudioRange(_ref) {
   var className = _ref.className,
-      maxValue = _ref.maxValue,
-      value = _ref.value,
-      step = _ref.step,
-      colorPercent = _ref.colorPercent,
-      onChange = _ref.onChange,
-      onMouseUp = _ref.onMouseUp,
-      onTouchEnd = _ref.onTouchEnd,
-      dataAttrs = _ref.dataAttrs;
+    maxValue = _ref.maxValue,
+    value = _ref.value,
+    step = _ref.step,
+    colorPercent = _ref.colorPercent,
+    onChange = _ref.onChange,
+    onMouseUp = _ref.onMouseUp,
+    onTouchEnd = _ref.onTouchEnd,
+    dataAttrs = _ref.dataAttrs;
   return /*#__PURE__*/React.createElement("input", _extends({
     className: cn([className]),
     style: {
@@ -29,5 +28,4 @@ var AudioRange = function AudioRange(_ref) {
     onTouchEnd: onTouchEnd
   }, filterDataAttrs(dataAttrs)));
 };
-
 export default AudioRange;

package/dist/es/components/AudioPlayer/AudioVolume.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import './style/AudioVolume.less';
+import './style/AudioVolume.scss';
 export interface IAudioVolumeProps {
     onChangeAudioVolume?: (volume: number) => void;
 }

package/dist/es/components/AudioPlayer/AudioVolume.js

@@ -6,7 +6,6 @@ import { Tooltip } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
 import AudioRange from "./AudioRange";
 import "./style/AudioVolume.css";
-
 var NoVolumeIcon = function NoVolumeIcon(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     viewBox: "0 0 24 24"
@@ -16,7 +15,6 @@ var NoVolumeIcon = function NoVolumeIcon(props) {
     d: "M16.094 10.174c.261.56.406 1.177.406 1.826 0 1.426-.7 2.701-1.8 3.548-.3.23-.7-.004-.7-.382v-3.152l2.094-1.84zm-1.225-1.586L14 9.35v-.517c0-.378.4-.613.7-.382.058.044.114.09.169.136zm1.923-1.69a6.998 6.998 0 00-2.438-1.491.525.525 0 01-.354-.489V3.849c0-.32.299-.559.606-.466a8.994 8.994 0 013.694 2.19l-1.508 1.325zM12 11.108V5.36a.5.5 0 00-.342-.474l-.822-.274a.5.5 0 00-.553.167L7.15 8.807A.5.5 0 016.756 9H3.707a.5.5 0 00-.353.146l-.207.208A.5.5 0 003 9.707v4.586a.5.5 0 00.147.353l.207.208a.5.5 0 00.353.146h3.049a.5.5 0 01.394.193l.082.105L12 11.108zM8.462 16.88l1.82 2.34a.5.5 0 00.554.168l.822-.274A.5.5 0 0012 18.64v-4.87l-3.538 3.11zm-5.488 3.563a.5.5 0 01.046-.705L21.497 3.503a.5.5 0 11.66.751L3.68 20.49a.5.5 0 01-.706-.046z"
   }));
 };
-
 var VolumeIcon = function VolumeIcon(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     viewBox: "0 0 24 24"
@@ -26,28 +24,22 @@ var VolumeIcon = function VolumeIcon(props) {
     d: "M16.5 12c0 1.426-.7 2.701-1.8 3.548-.3.23-.7-.004-.7-.382V8.834c0-.378.4-.613.7-.382 1.1.847 1.8 2.122 1.8 3.548z"
   }));
 };
-
 var cn = cnCreate('mfui-audio-volume');
-
 var AudioVolume = function AudioVolume(_ref) {
   var onChangeAudioVolume = _ref.onChangeAudioVolume;
   var tooltipTrigger = React.useRef(null);
-
   var _React$useState = React.useState(0.3),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      trackVolume = _React$useState2[0],
-      setTrackVolume = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    trackVolume = _React$useState2[0],
+    setTrackVolume = _React$useState2[1];
   var volumeColorPercent = React.useMemo(function () {
     return trackVolume * 100;
   }, [trackVolume]);
-
   var handleScrubVolume = function handleScrubVolume(e) {
     var currentVolume = Number(e.target.value);
     setTrackVolume(currentVolume);
     onChangeAudioVolume === null || onChangeAudioVolume === void 0 ? void 0 : onChangeAudioVolume(currentVolume);
   };
-
   return /*#__PURE__*/React.createElement("div", {
     className: cn()
   }, /*#__PURE__*/React.createElement("div", {
@@ -82,5 +74,4 @@ var AudioVolume = function AudioVolume(_ref) {
     }
   })));
 };
-
 export default AudioVolume;

package/dist/es/components/AudioPlayer/hooks/useTrackDuration.js

@@ -1,22 +1,17 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React from 'react';
-
 var useTrackDuration = function useTrackDuration(audioRef) {
   var _React$useState = React.useState(0),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      trackDuration = _React$useState2[0],
-      setTrackDuration = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    trackDuration = _React$useState2[0],
+    setTrackDuration = _React$useState2[1];
   React.useEffect(function () {
     var audioNode = audioRef.current;
-
     if (!audioNode) {
       return;
     }
-
     var readyState = audioNode.readyState,
-        duration = audioNode.duration;
-
+      duration = audioNode.duration;
     if (readyState > 0) {
       setTrackDuration(Math.round(duration));
     } else {
@@ -28,5 +23,4 @@ var useTrackDuration = function useTrackDuration(audioRef) {
   }, [audioRef]);
   return trackDuration;
 };
-
 export default useTrackDuration;

package/dist/es/components/AudioPlayer/style/AudioPlayer.css

@@ -1,58 +1 @@
-h1,
-h2,
-h3,
-h4,
-h5 {
-  margin: 0;
-}
-.mfui-audio-player {
-  margin-top: 24px;
-}
-.mfui-audio-player__player {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-pack: justify;
-      -ms-flex-pack: justify;
-          justify-content: space-between;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  padding: 16px;
-  border-radius: 12px;
-  background: var(--spbSky0);
-}
-@media screen and (min-width: 768px) and (max-width: 1023px) {
-  .mfui-audio-player__player {
-    max-width: 530px;
-  }
-}
-@media screen and (min-width: 1024px) {
-  .mfui-audio-player__player {
-    max-width: 550px;
-  }
-}
-.mfui-audio-player__playing-controls {
-  margin-right: 16px;
-}
-.mfui-audio-player_position_center .mfui-audio-player__player {
-  margin: 0 auto;
-}
-.mfui-audio-player_position_left .mfui-audio-player__player {
-  margin-right: auto;
-}
-.mfui-audio-player_position_right .mfui-audio-player__player {
-  margin-left: auto;
-}
-@media screen and (min-width: 768px) and (max-width: 1023px) {
-  .mfui-audio-player_full-width .mfui-audio-player__player {
-    max-width: 100%;
-  }
-}
-@media screen and (min-width: 1024px) {
-  .mfui-audio-player_full-width .mfui-audio-player__player {
-    max-width: 100%;
-  }
-}
+h1,h2,h3,h4,h5{margin:0}.mfui-audio-player{margin-top:24px}.mfui-audio-player__player{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;background:var(--spbSky0);border-radius:12px;-webkit-box-sizing:border-box;box-sizing:border-box;justify-content:space-between;padding:16px}@media screen and (min-width:768px) and (max-width:1023px){.mfui-audio-player__player{max-width:530px}}@media screen and (min-width:1024px){.mfui-audio-player__player{max-width:550px}}.mfui-audio-player__playing-controls{margin-right:16px}.mfui-audio-player_position_center .mfui-audio-player__player{margin:0 auto}.mfui-audio-player_position_left .mfui-audio-player__player{margin-right:auto}.mfui-audio-player_position_right .mfui-audio-player__player{margin-left:auto}@media screen and (min-width:768px) and (max-width:1023px){.mfui-audio-player_full-width .mfui-audio-player__player{max-width:100%}}@media screen and (min-width:1024px){.mfui-audio-player_full-width .mfui-audio-player__player{max-width:100%}}

package/dist/es/components/AudioPlayer/style/AudioProgress.css

@@ -1,35 +1 @@
-h1,
-h2,
-h3,
-h4,
-h5 {
-  margin: 0;
-}
-.mfui-audio-progress {
-  width: 100%;
-  margin-right: 16px;
-}
-.mfui-audio-progress__info {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-pack: justify;
-      -ms-flex-pack: justify;
-          justify-content: space-between;
-}
-.mfui-audio-progress__value {
-  color: var(-spbSky3);
-  font-size: 12px;
-  line-height: 18px;
-}
-.mfui-audio-progress__range-wrapper {
-  margin-top: -2px;
-}
-.mfui-audio-progress__title {
-  color: var(--stcBlack);
-  font-size: 12px;
-  line-height: 18px;
-}
+h1,h2,h3,h4,h5{margin:0}.mfui-audio-progress{margin-right:16px;width:100%}.mfui-audio-progress__info{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.mfui-audio-progress__value{color:var(-spbSky3);font-size:12px;line-height:18px}.mfui-audio-progress__range-wrapper{margin-top:-2px}.mfui-audio-progress__title{color:var(--stcBlack);font-size:12px;line-height:18px}

package/dist/es/components/AudioPlayer/style/AudioRange.css

@@ -1,68 +1 @@
-h1,
-h2,
-h3,
-h4,
-h5 {
-  margin: 0;
-}
-.mfui-audio-range {
-  width: 100%;
-  height: 4px;
-  border-radius: 2px;
-  background: var(--spbSky2);
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#00B956), to(#00B956));
-  background-image: linear-gradient(#00B956, #00B956);
-  background-repeat: no-repeat;
-  cursor: pointer;
-  -webkit-appearance: none;
-}
-.mfui-audio-range:focus {
-  outline: none;
-}
-.mfui-audio-range::-webkit-slider-thumb {
-  width: 16px;
-  height: 16px;
-  border: none;
-  border-radius: 50%;
-  background: var(--stcWhite);
-  -webkit-box-shadow: 0 2px 9px rgba(0, 0, 0, 0.15);
-          box-shadow: 0 2px 9px rgba(0, 0, 0, 0.15);
-  -webkit-appearance: none;
-}
-.mfui-audio-range::-moz-range-thumb {
-  width: 16px;
-  height: 16px;
-  border: none;
-  border-radius: 50%;
-  background: var(--stcWhite);
-  box-shadow: 0 2px 9px rgba(0, 0, 0, 0.15);
-  -webkit-appearance: none;
-}
-.mfui-audio-range::-ms-thumb {
-  width: 16px;
-  height: 16px;
-  border: none;
-  border-radius: 50%;
-  background: var(--stcWhite);
-  box-shadow: 0 2px 9px rgba(0, 0, 0, 0.15);
-  -webkit-appearance: none;
-}
-.mfui-audio-range::-webkit-slider-runnable-track {
-  border: none;
-  background: transparent;
-  -webkit-box-shadow: none;
-          box-shadow: none;
-  -webkit-appearance: none;
-}
-.mfui-audio-range::-moz-range-track {
-  border: none;
-  background: transparent;
-  box-shadow: none;
-  -webkit-appearance: none;
-}
-.mfui-audio-range::-ms-track {
-  border: none;
-  background: transparent;
-  box-shadow: none;
-  -webkit-appearance: none;
-}
+h1,h2,h3,h4,h5{margin:0}.mfui-audio-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--spbSky2);background-image:-webkit-gradient(linear,left top,left bottom,from(#00b956),to(#00b956));background-image:linear-gradient(#00b956,#00b956);background-repeat:no-repeat;border-radius:2px;cursor:pointer;height:4px;width:100%}.mfui-audio-range:focus{outline:none}.mfui-audio-range::-webkit-slider-thumb{-webkit-appearance:none;background:var(--stcWhite);border:none;border-radius:50%;-webkit-box-shadow:0 2px 9px fade(#000,15%);box-shadow:0 2px 9px fade(#000,15%);height:16px;width:16px}.mfui-audio-range::-moz-range-thumb{-webkit-appearance:none;background:var(--stcWhite);border:none;border-radius:50%;box-shadow:0 2px 9px fade(#000,15%);height:16px;width:16px}.mfui-audio-range::-ms-thumb{-webkit-appearance:none;background:var(--stcWhite);border:none;border-radius:50%;box-shadow:0 2px 9px fade(#000,15%);height:16px;width:16px}.mfui-audio-range::-webkit-slider-runnable-track{-webkit-appearance:none;background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none}.mfui-audio-range::-moz-range-track{-webkit-appearance:none;background:transparent;border:none;box-shadow:none}.mfui-audio-range::-ms-track{-webkit-appearance:none;background:transparent;border:none;box-shadow:none}

package/dist/es/components/AudioPlayer/style/AudioVolume.css

@@ -1,34 +1 @@
-h1,
-h2,
-h3,
-h4,
-h5 {
-  margin: 0;
-}
-.mfui-audio-volume {
-  width: 24px;
-}
-.mfui-audio-volume__tooltip-content {
-  padding: 7px 16px 14px;
-  border-radius: 12px;
-}
-.mfui-audio-volume__tooltip-content-shadow {
-  border-radius: 12px;
-}
-.mfui-audio-volume__icon {
-  display: none;
-  width: 24px;
-  min-width: 24px;
-  height: 24px;
-  cursor: pointer;
-  fill: var(--brandGreen);
-}
-.mfui-audio-volume__icon_visible {
-  display: block;
-}
-.mfui-audio-volume__icon:hover {
-  fill: var(--buttonHoverGreen);
-}
-.mfui-audio-volume__range {
-  max-width: 128px;
-}
+h1,h2,h3,h4,h5{margin:0}.mfui-audio-volume{width:24px}.mfui-audio-volume__tooltip-content{border-radius:12px;padding:7px 16px 14px}.mfui-audio-volume__tooltip-content-shadow{border-radius:12px}.mfui-audio-volume__icon{cursor:pointer;display:none;height:24px;min-width:24px;width:24px;fill:var(--brandGreen)}.mfui-audio-volume__icon_visible{display:block}.mfui-audio-volume__icon:hover{fill:var(--buttonHoverGreen)}.mfui-audio-volume__range{max-width:128px}