fcr-ui-scene 3.1.0 → 3.2.0

package/lib/modules/device-settings/video-settings/camera-select.d.ts

@@ -1,2 +0,0 @@
-import { FC } from 'react';
-export declare const CameraSelect: FC;

package/lib/modules/device-settings/video-settings/index.css

@@ -1,327 +0,0 @@
-.fcr-device-settings-video__header {
-  height: 36px;
-  font-size: 13px;
-  line-height: 1;
-  font-weight: 700;
-  color: var(--fcr_ui_scene_icontext1);
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.fcr-device-settings-mirror-toggle {
-  border-radius: var(--fcr_cornerradius_xs);
-  border: 1px solid var(--fcr_ui_scene_line1);
-  padding: 2px;
-  background: var(--fcr_web_ui_scene_fill2);
-  backdrop-filter: blur(16.7px);
-  cursor: pointer;
-  transition: all 0.2s ease;
-}
-
-.fcr-device-settings-mirror-toggle:hover {
-  background: var(--fcr_web_ui_scene_hover);
-}
-
-.fcr-device-settings-video__beauty-slider {
-  /* width: 260px; */
-  height: 28px;
-  background: var(--fcr_mobile_ui_scene_color_popup_block4);
-  border-radius: 8px;
-  display: flex;
-  position: relative;
-  align-items: center;
-  padding: 10px 12px;
-  flex: 1;
-  max-width: 76%;
-}
-
-.fcr-device-settings-video__beauty-slider-value {
-  color: var(--fcr_ui_scene_icontext1);
-  font-weight: 700;
-  margin-left: 13px;
-  user-select: none;
-}
-
-.fcr-device-settings-video__beauty-slider .fcr-slider {
-  width: 100%;
-}
-
-.fcr-device-settings-video__beauty-reset {
-  z-index: 10;
-  border: none;
-  background: var(--fcr_mobile_ui_scene_color_popup_block4);
-}
-
-.fcr-device-settings-video__video-flip-container {
-  position: absolute;
-  z-index: 10;
-  right: 8px;
-  bottom: 8px;
-  border-radius: var(--fcr_cornerradius_s);
-  background: var(--fcr_mobile_ui_scene_color_popup_block4);
-}
-
-.fcr-device-settings-video__video-flip {
-  background: var(--fcr_mobile_ui_scene_color_popup_block4);
-  border: none;
-}
-
-.fcr-device-settings-video__tab-wrapper {
-  margin-top: 10px;
-}
-
-.fcr-device-settings-video__tab-wrapper .fcr-fashion-tabs {
-  width: 100%;
-}
-
-.fcr-video-settings-basic__basic-form {
-  margin-top: 10px;
-  margin-bottom: 10px;
-  border-radius: var(--fcr_cornerradius_s);
-  width: 100%;
-  padding: 10px;
-  background: var(--fcr_mobile_ui_scene_color_popup_block5);
-}
-
-.fcr-video-settings-basic__basic-form:first-child {
-  margin-top: 12px;
-}
-
-.fcr-video-settings-basic__basic-form .fcr-checkbox {
-  height: 32px;
-}
-
-.fcr-video-settings-basic__basic-form.fcr-video-settings-basic__max-person-form {
-  padding: 5px 10px;
-}
-
-.fcr-video-settings-basic__max-person-label {
-  height: 32px;
-  font-size: 12px;
-  line-height: 32px;
-  font-weight: 300;
-  color: var(--fcr_ui_scene_icontext1);
-}
-.fcr-video-settings-basic__spotlight-label {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.fcr-video-settings-basic__max-person-radio-group {
-  height: 32px;
-  display: flex;
-  column-gap: 30px;
-}
-
-/* 修复没有设备时展示 no device 的样式 */
-.fcr-device-settings-video__device-select-no-device {
-  border-width: 1px;
-  border-style: solid;
-  box-sizing: border-box;
-  cursor: pointer;
-  font-size: 12px;
-  line-height: 1.5;
-  overflow: hidden;
-  user-select: none;
-  font-weight: 400;
-  border-color: transparent;
-  background: var(--fcr_ui_scene_black3);
-  backdrop-filter: blur(25px);
-  color: var(--fcr_ui_scene_white10);
-  padding: 6px 6px 6px 12px;
-  border-radius: var(--fcr_cornerradius_s);
-  display: flex;
-  align-items: center;
-}
-
-.fcr-device-settings-video__device-select-no-device span {
-  flex: 1;
-}
-
-.fcr-device-settings-video__device-select-no-device .icon {
-  flex-shrink: 0;
-}
-
-.fcr-device-settings-video__tab-wrapper {
-  width: 100%;
-  max-height: 296px;
-  min-height: 279px;
-  position: relative;
-}
-
-.fcr-device-settings-video__active-tab-wrapper {
-  width: 100%;
-  max-height: 250px;
-  overflow-y: scroll;
-  padding-bottom: 20px;
-}
-
-.fcr-virtual-background-setting__container {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-}
-
-.fcr-device-settings-video__tips {
-  background-color: var(--fcr_mobile_ui_scene_color_popup_block5);
-  border-radius: var(--fcr_cornerradius_s);
-  height: 32px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.fcr-virtual-background-setting__virtual-list {
-  display: flex;
-  flex-wrap: wrap;
-  row-gap: 14px;
-}
-
-.fcr-virtual-background-setting__virtual-item {
-  width: 88px;
-  height: 62px;
-  padding: 3px;
-  border: 2px solid transparent;
-  position: relative;
-  border-radius: var(--fcr_cornerradius_s);
-  flex: 25%;
-  max-width: 88px;
-  box-sizing: border-box;
-}
-
-.fcr-virtual-background-setting__virtual-none {
-  color: var(--fcr_web_ui_scene_mainicon1);
-}
-.fcr-virtual-background-setting__virtual-item.is-active {
-  border: 2px solid var(--fcr_ui_scene_ramp_brand6);
-}
-.fcr-virtual-background-setting__virtual-item.is-active
-  .fcr-virtual-background-setting__virtual-none {
-  color: var(--fcr_ui_scene_ramp_brand6);
-}
-
-.fcr-virtual-background-setting__virtual-source {
-  width: 100%;
-  height: 100%;
-  border-radius: var(--fcr_cornerradius_s);
-  overflow: hidden;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background-color: var(--fcr_web_ui_scene_fill4_popup);
-  flex-direction: column;
-}
-
-.fcr-virtual-background-setting__virtual-video-source {
-  position: relative;
-  width: 100%;
-  height: 100%;
-}
-
-.fcr-virtual-background-setting__virtual-tag {
-  position: absolute;
-  right: 0;
-  bottom: 0;
-  background-color: var(--fcr_ui_scene_black5);
-  width: 28px;
-  height: 18px;
-  border-radius: 8px 0 8px 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.fcr-virtual-background-setting__virtual-source img,
-.fcr-virtual-background-setting__virtual-source video {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-}
-.fcr-beauty-setting__beauty-options {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: flex-start;
-}
-.fcr-beauty-setting__card {
-  width: 88px;
-  height: 106px;
-  border: 2px solid transparent;
-  border-radius: var(--fcr_cornerradiu_sm);
-  padding: 3px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-
-.fcr-beauty-setting__card-container {
-  box-sizing: border-box;
-
-  background: var(--fcr_web_ui_scene_fill4_popup);
-  border: 1px solid var(--fcr_ui_scene_line1);
-  border-radius: var(--fcr_cornerradius_s);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding: 4px;
-}
-
-.fcr-beauty-setting__card-container__wrapper {
-  height: 56px;
-  display: flex;
-  width: 100%;
-  justify-content: center;
-  align-items: center;
-  align-content: center;
-  border-radius: var(--fcr_cornerradius_xs);
-  background-color: var(--fcr_mobile_ui_scene_color_popup_fill2);
-}
-
-.fcr-beauty-setting__card-container__wrapper-highlight {
-  background-color: var(--fcr_ui_scene_ramp_brand1);
-}
-
-.fcr-beauty-setting__card-title {
-  font-weight: 300;
-  font-size: 12px;
-  line-height: 12px;
-
-  color: var(--fcr_ui_scene_icontext2);
-  padding: 10px 0px 8px;
-}
-
-.fcr-beauty-setting__card-container__wrapper .fcr-switch {
-  transform-origin: center;
-}
-
-.fcr-beauty-setting__card.fcr-beauty-setting__card__content-active {
-  border: 2px solid var(--fcr_ui_scene_ramp_brand6);
-  border-radius: var(--fcr_cornerradius_m);
-}
-
-.fcr-video-settings-basic__device-select .fcr-select.fcr-select--blurred:not(.fcr-select--focused) {
-  background-color: var(--fcr_ui_scene_input2);
-  border: 0.5px solid var(--fcr_web_ui_scene_line4);
-}
-.fcr-video-settings-basic__device-select
-  .fcr-select.fcr-select--blurred:not(.fcr-select--focused)
-  .fcr-select__selected {
-  color: var(--fcr_ui_scene_icontext1);
-}
-
-.fcr-video-settings-basic__device-select-title {
-  color: var(--fcr_ui_scene_icontext1);
-  font-weight: 700;
-  size: 14px;
-  margin-bottom: 7px;
-}
-
-.fcr-video-settings-basic__checkbox-item {
-  gap: 8px;
-  font-size: 12px;
-  line-height: 32px;
-  color: var(--fcr_ui_scene_icontext1);
-  display: flex;
-  align-items: center;
-}

package/lib/modules/device-settings/video-settings/local-video-player.d.ts

@@ -1,3 +0,0 @@
-import { FC } from 'react';
-declare const LocalVideoPlayer: FC;
-export default LocalVideoPlayer;

package/lib/modules/device-settings/video-settings/local-video-player.js

@@ -1,37 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.object.define-property.js");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-var _react = require("react");
-var _useNamespace = require("../common/useNamespace");
-var _context = require("../context");
-var _mobxReact = require("mobx-react");
-var _jsxRuntime = require("react/jsx-runtime");
-var LocalVideoPlayer = (0, _mobxReact.observer)(function () {
-  var ns = (0, _useNamespace.useNamespace)('device-settings-video-player');
-  var _useContext = (0, _react.useContext)(_context.StoreContext),
-    cameraDeviceId = _useContext.cameraDeviceId,
-    cameraEnabled = _useContext.cameraEnabled,
-    startLocalVideo = _useContext.startLocalVideo,
-    stopLocalVideo = _useContext.stopLocalVideo;
-  var elementRef = (0, _react.useRef)(null);
-  (0, _react.useEffect)(function () {
-    if (cameraDeviceId && cameraEnabled && elementRef.current) {
-      startLocalVideo(elementRef.current);
-    }
-    return function () {
-      stopLocalVideo();
-    };
-  }, [cameraDeviceId, cameraEnabled]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: ns.e('frame'),
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: ns.b(),
-      ref: elementRef
-    })
-  });
-});
-var _default = exports["default"] = LocalVideoPlayer;

package/lib/modules/device-settings/video-settings/mirror-toggle.d.ts

@@ -1,2 +0,0 @@
-import { FC } from 'react';
-export declare const MirrorToggle: FC;

package/lib/modules/device-settings/video-settings/mirror-toggle.js

@@ -1,62 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.object.define-property.js");
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.MirrorToggle = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = require("react");
-var _i18n = require("agora-ui-foundation/lib/i18n");
-var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
-var _icon = require("agora-ui-foundation/lib/components/icon");
-var _type = require("agora-ui-foundation/lib/components/icon/type");
-var _useNamespace = require("../common/useNamespace");
-var _context = require("../context");
-var _mobxReact = require("mobx-react");
-var _jsxRuntime = require("react/jsx-runtime");
-var MirrorToggle = exports.MirrorToggle = (0, _mobxReact.observer)(function () {
-  var ns = (0, _useNamespace.useNamespace)('device-settings-mirror-toggle');
-  var t = (0, _i18n.useI18n)();
-  var _useContext = (0, _react.useContext)(_context.StoreContext),
-    isLocalMirrorEnabled = _useContext.isLocalMirrorEnabled,
-    toggleLocalMirror = _useContext.toggleLocalMirror;
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    isIconHovered = _useState2[0],
-    setIsIconHovered = _useState2[1];
-  var iconType = (0, _react.useMemo)(function () {
-    return isLocalMirrorEnabled ? _type.FcrIconType.FCR_MIRRORIMAGE_LEFT : _type.FcrIconType.FCR_MIRRORIMAGE_RIGHT;
-  }, [isLocalMirrorEnabled]);
-  var iconColors = (0, _react.useMemo)(function () {
-    return isIconHovered ? {
-      iconPrimary: 'var(--fcr_web_ui_scene_mainicon2)'
-    } : {
-      iconPrimary: 'var(--fcr_web_ui_scene_mainicon1)'
-    };
-  }, [isIconHovered]);
-  var onMouseEnter = function onMouseEnter() {
-    setIsIconHovered(true);
-  };
-  var onMouseLeave = function onMouseLeave() {
-    setIsIconHovered(false);
-  };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-    trigger: "hover",
-    placement: "top",
-    mouseEnterDelay: 0.2,
-    content: t('mirror'),
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      onMouseEnter: onMouseEnter,
-      onMouseLeave: onMouseLeave,
-      onClick: toggleLocalMirror,
-      className: ns.b(),
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-        type: iconType,
-        colors: iconColors,
-        size: 20
-      })
-    })
-  });
-});

package/lib/modules/device-settings/video-settings/video-settings-basic.d.ts

@@ -1,9 +0,0 @@
-import { FC, PropsWithChildren } from 'react';
-export declare const VideoSettingsBasic: FC<PropsWithChildren<{
-    cameraDeviceId: string;
-    setCameraDevice: (v: string) => void;
-    cameraDeviceList: {
-        text: string;
-        value: string;
-    }[];
-}>>;

package/lib/modules/device-settings/video-settings/video-settings-basic.js

@@ -1,177 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.object.define-property.js");
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.VideoSettingsBasic = void 0;
-require("core-js/modules/es.error.to-string.js");
-require("core-js/modules/es.date.to-string.js");
-require("core-js/modules/es.number.constructor.js");
-require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/es.regexp.to-string.js");
-var _react = require("react");
-var _i18n = require("agora-ui-foundation/lib/i18n");
-var _checkbox = require("agora-ui-foundation/lib/components/checkbox");
-var _radio = require("agora-ui-foundation/lib/components/radio");
-var _useNamespace = require("../common/useNamespace");
-var _mobxReact = require("mobx-react");
-var _context = require("../context");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _cameraSelect = require("../../device-pretest/settings/camera-select");
-var _constant = require("../../../utilities/constant");
-var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
-var _icon = require("agora-ui-foundation/lib/components/icon");
-var _type = require("agora-ui-foundation/lib/components/icon/type");
-var _jsxRuntime = require("react/jsx-runtime");
-var VideoSettingsBasic = exports.VideoSettingsBasic = (0, _mobxReact.observer)(function (_ref) {
-  var cameraDeviceId = _ref.cameraDeviceId,
-    setCameraDevice = _ref.setCameraDevice,
-    cameraDeviceList = _ref.cameraDeviceList;
-  var ns = (0, _useNamespace.useNamespace)('video-settings-basic');
-  var t = (0, _i18n.useI18n)();
-  var _useContext = (0, _react.useContext)(_context.StoreContext),
-    setting = _useContext.setting,
-    setSetting = _useContext.setSetting;
-  console.log('setting', setting);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: ns.b(),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: ns.e('basic-form'),
-      id: _constant.HighlightElement.VIDEO_BASIC,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: ns.e('device-select-title'),
-        children: "Camera"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: ns.e('device-select'),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_cameraSelect.CameraSelect, {
-          cameraDeviceId: cameraDeviceId,
-          setCameraDevice: setCameraDevice,
-          cameraDeviceList: cameraDeviceList
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
-          size: "small",
-          label: '视频高清',
-          checked: setting.videoHD,
-          onChange: function onChange(v) {
-            return setSetting({
-              videoHD: v
-            });
-          }
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
-          size: "small",
-          label: '调整以使用弱光',
-          checked: setting.videoLowLight,
-          onChange: function onChange(v) {
-            return setSetting({
-              videoLowLight: v
-            });
-          }
-        })]
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: ns.e('basic-form'),
-      id: _constant.HighlightElement.VIDEO_BASIC,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
-        size: "small",
-        label: t('video_basic_settings_1'),
-        checked: setting.shouldTurnOffVideo,
-        onChange: function onChange(v) {
-          return setSetting({
-            shouldTurnOffVideo: v
-          });
-        }
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
-        size: "small",
-        label: t('video_basic_settings_2'),
-        checked: setting.shouldDisplayPreviewDialog,
-        onChange: function onChange(v) {
-          return setSetting({
-            shouldDisplayPreviewDialog: v
-          });
-        }
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _classnames["default"])(ns.e('basic-form'), ns.e('max-person-form')),
-      id: _constant.HighlightElement.VIDEO_MAX_PERSON,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: ns.e('max-person-label'),
-        children: t('video_basic_settings_4')
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: ns.e('max-person-radio-group'),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_radio.FcrRadioGroup, {
-          value: setting.displayedMaxAttendees.toString(),
-          onChange: function onChange(v) {
-            return setSetting({
-              displayedMaxAttendees: Number(v)
-            });
-          },
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadio, {
-            value: "16",
-            label: t('attendees_16'),
-            checked: setting.displayedMaxAttendees.toString() === '16'
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadio, {
-            value: "25",
-            label: t('attendees_25'),
-            checked: setting.displayedMaxAttendees.toString() === '25'
-          })]
-        })
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: ns.e('basic-form'),
-      id: _constant.HighlightElement.VIDEO_BASIC,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: ns.e('device-select-title'),
-        children: t('advance_settings')
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
-          size: "small",
-          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-            className: ns.e('checkbox-item'),
-            children: ["\u901A\u8FC7\u964D\u566A\u4F18\u5316\u89C6\u9891\u8D28\u91CF", /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-              mouseEnterDelay: 0,
-              content: "\u52FE\u9009\u540E\uFF0C\u57FA\u4E8E\u8F6F\u4EF6\u7684\u566A\u58F0\u6D88\u9664\u5C06\u4F18\u5316\u89C6\u9891\u753B\u8D28",
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-                  type: _type.FcrIconType.FCR_HELPQUESTION,
-                  size: 14
-                })
-              })
-            })]
-          }),
-          checked: setting.videoNoise,
-          onChange: function onChange(v) {
-            return setSetting({
-              videoNoise: v
-            });
-          }
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
-          size: "small",
-          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-            className: ns.e('checkbox-item'),
-            children: ["\u4E3A\u89C6\u9891\u63A5\u6536\u4F7F\u7528\u786C\u4EF6\u52A0\u901F", /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-              mouseEnterDelay: 0,
-              content: "\u52FE\u9009\u540E\uFF0C\u786C\u4EF6\u7F16\u89E3\u7801\u5668\u5C06\u964D\u4F4E\u89C6\u9891\u7F16\u89E3\u7801\u5BF9CPU\u7684\u6D88\u8017",
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-                  type: _type.FcrIconType.FCR_HELPQUESTION,
-                  size: 14
-                })
-              })
-            })]
-          }),
-          checked: setting.hardwareForReception,
-          onChange: function onChange(v) {
-            return setSetting({
-              hardwareForReception: v
-            });
-          }
-        })
-      })]
-    })]
-  });
-});

package/lib/modules/device-settings/video-settings/video-settings.d.ts

@@ -1,6 +0,0 @@
-import 'agora-ui-foundation/lib/components/local-video-player/index.css';
-import { FC } from 'react';
-import './index.css';
-import 'agora-ui-foundation/lib/components/local-video-player/index.css';
-export declare const VideoSettings: FC;
-export default VideoSettings;