@rocket.chat/fuselage 0.32.0-dev.338 → 0.32.0-dev.339
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.
- package/dist/components/AudioPlayer/AudioPlayer.d.ts.map +1 -1
- package/dist/components/Slider/Slider.d.ts +0 -5
- package/dist/components/Slider/Slider.d.ts.map +1 -1
- package/dist/fuselage.development.js +57 -32
- package/dist/fuselage.development.js.map +1 -1
- package/dist/fuselage.production.js +1 -1
- package/package.json +11 -11
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AudioPlayer.d.ts","sourceRoot":"","sources":["../../../src/components/AudioPlayer/AudioPlayer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AudioPlayer.d.ts","sourceRoot":"","sources":["../../../src/components/AudioPlayer/AudioPlayer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAoC5D,eAAO,MAAM,WAAW;SAGf,MAAM;;;;;;;;;;;;0CA4Md,CAAC"}
|
|
@@ -23,11 +23,6 @@ type SliderProps<T extends number | number[]> = AriaAttributes & {
|
|
|
23
23
|
orientation?: 'horizontal' | 'vertical';
|
|
24
24
|
disabled?: boolean;
|
|
25
25
|
defaultValue?: T;
|
|
26
|
-
small?: boolean;
|
|
27
|
-
/**
|
|
28
|
-
* 100% of parent's dimention
|
|
29
|
-
*/
|
|
30
|
-
large?: boolean;
|
|
31
26
|
} & ({
|
|
32
27
|
value: T;
|
|
33
28
|
onChange: (value: T) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAW1D,KAAK,WAAW,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,IAAI,cAAc,GAAG;IAC/D;;OAEG;IACH,aAAa,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,SAAS,MAAM,EAAE,GAAG,IAAI,GAAG,KAAK,CAAC;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAW1D,KAAK,WAAW,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,IAAI,cAAc,GAAG;IAC/D;;OAEG;IACH,aAAa,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,SAAS,MAAM,EAAE,GAAG,IAAI,GAAG,KAAK,CAAC;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,CAAC;CAClB,GAAG,CACE;IACE,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;CAC9B,GACD;IACE,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB,CACJ,CAAC;AAEJ,wBAAgB,MAAM,CAAC,CAAC,SAAS,MAAM,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,CAAC,EAClE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,GACpB,YAAY,CAkGd"}
|
|
@@ -3205,12 +3205,19 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
3205
3205
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
3206
3206
|
/* harmony export */ "AudioPlayer": function() { return /* binding */ AudioPlayer; }
|
|
3207
3207
|
/* harmony export */ });
|
|
3208
|
-
/* harmony import */ var
|
|
3209
|
-
/* harmony import */ var
|
|
3210
|
-
/* harmony import */ var
|
|
3211
|
-
/* harmony import */ var
|
|
3212
|
-
/* harmony import */ var
|
|
3213
|
-
/* harmony import */ var
|
|
3208
|
+
/* harmony import */ var _rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @rocket.chat/css-in-js */ "@rocket.chat/css-in-js");
|
|
3209
|
+
/* harmony import */ var _rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__);
|
|
3210
|
+
/* harmony import */ var _rocket_chat_fuselage_hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @rocket.chat/fuselage-hooks */ "@rocket.chat/fuselage-hooks");
|
|
3211
|
+
/* harmony import */ var _rocket_chat_fuselage_hooks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_rocket_chat_fuselage_hooks__WEBPACK_IMPORTED_MODULE_1__);
|
|
3212
|
+
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ "react");
|
|
3213
|
+
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
|
|
3214
|
+
/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../.. */ "./src/index.ts");
|
|
3215
|
+
/* harmony import */ var _Theme__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../Theme */ "./src/Theme.ts");
|
|
3216
|
+
/* harmony import */ var _Slider__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Slider */ "./src/components/Slider/index.tsx");
|
|
3217
|
+
var __makeTemplateObject = (undefined && undefined.__makeTemplateObject) || function (cooked, raw) {
|
|
3218
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
3219
|
+
return cooked;
|
|
3220
|
+
};
|
|
3214
3221
|
var __read = (undefined && undefined.__read) || function (o, n) {
|
|
3215
3222
|
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
3216
3223
|
if (!m) return o;
|
|
@@ -3231,6 +3238,8 @@ var __read = (undefined && undefined.__read) || function (o, n) {
|
|
|
3231
3238
|
|
|
3232
3239
|
|
|
3233
3240
|
|
|
3241
|
+
|
|
3242
|
+
|
|
3234
3243
|
var getMaskTime = function (durationTime) {
|
|
3235
3244
|
return new Date(durationTime * 1000)
|
|
3236
3245
|
.toISOString()
|
|
@@ -3254,14 +3263,17 @@ function forceDownload(url, fileName) {
|
|
|
3254
3263
|
};
|
|
3255
3264
|
xhr.send();
|
|
3256
3265
|
}
|
|
3257
|
-
var
|
|
3266
|
+
var SpeedControlStyle = (0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n cursor: pointer;\n &:hover {\n background-color: ", ";\n }\n"], ["\n cursor: pointer;\n &:hover {\n background-color: ", ";\n }\n"])), _Theme__WEBPACK_IMPORTED_MODULE_4__.Palette.surface["surface-hover"]);
|
|
3267
|
+
var AudioPlayer = (0,react__WEBPACK_IMPORTED_MODULE_2__.forwardRef)(function (_a, ref) {
|
|
3258
3268
|
var src = _a.src, _b = _a.type, type = _b === void 0 ? 'audio/mpeg' : _b, _c = _a.maxPlaybackSpeed, maxPlaybackSpeed = _c === void 0 ? 2 : _c, _d = _a.minPlaybackSpeed, minPlaybackSpeed = _d === void 0 ? 0.5 : _d, _e = _a.playbackSpeedStep, playbackSpeedStep = _e === void 0 ? 0.5 : _e, _f = _a.download, download = _f === void 0 ? false : _f, _g = _a.playLabel, playLabel = _g === void 0 ? 'Play' : _g, _h = _a.pauseLabel, pauseLabel = _h === void 0 ? 'Pause' : _h, _j = _a.audioPlaybackRangeLabel, audioPlaybackRangeLabel = _j === void 0 ? 'Audio Playback Range' : _j, _k = _a.reducePlaybackSpeedLabel, reducePlaybackSpeedLabel = _k === void 0 ? 'Reduce Playback Speed' : _k, _l = _a.increasePlaybackSpeedLabel, increasePlaybackSpeedLabel = _l === void 0 ? 'Increase Playback Speed' : _l, _m = _a.downloadAudioFileLabel, downloadAudioFileLabel = _m === void 0 ? 'Download Audio File' : _m;
|
|
3259
|
-
var audioRef = (0,
|
|
3260
|
-
var refs = (0,
|
|
3261
|
-
var _o = __read((0,
|
|
3262
|
-
var _p = __read((0,
|
|
3263
|
-
var _q = __read((0,
|
|
3264
|
-
var _r = __read((0,
|
|
3269
|
+
var audioRef = (0,react__WEBPACK_IMPORTED_MODULE_2__.useRef)(null);
|
|
3270
|
+
var refs = (0,_rocket_chat_fuselage_hooks__WEBPACK_IMPORTED_MODULE_1__.useMergedRefs)(ref, audioRef);
|
|
3271
|
+
var _o = __read((0,react__WEBPACK_IMPORTED_MODULE_2__.useState)(false), 2), isPlaying = _o[0], setIsPlaying = _o[1];
|
|
3272
|
+
var _p = __read((0,react__WEBPACK_IMPORTED_MODULE_2__.useState)(0), 2), currentTime = _p[0], setCurrentTime = _p[1];
|
|
3273
|
+
var _q = __read((0,react__WEBPACK_IMPORTED_MODULE_2__.useState)(0), 2), durationTime = _q[0], setDurationTime = _q[1];
|
|
3274
|
+
var _r = __read((0,react__WEBPACK_IMPORTED_MODULE_2__.useState)(1), 2), playbackSpeed = _r[0], setPlaybackSpeed = _r[1];
|
|
3275
|
+
var _s = (0,_rocket_chat_fuselage_hooks__WEBPACK_IMPORTED_MODULE_1__.useResizeObserver)(), containerRef = _s.ref, borderBoxSize = _s.borderBoxSize;
|
|
3276
|
+
var collapseControls = borderBoxSize.inlineSize && borderBoxSize.inlineSize < 240;
|
|
3265
3277
|
var handlePlay = function () {
|
|
3266
3278
|
var _a, _b, _c;
|
|
3267
3279
|
var isPlaying = (_a = audioRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
|
@@ -3274,38 +3286,50 @@ var AudioPlayer = (0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (_a
|
|
|
3274
3286
|
};
|
|
3275
3287
|
var handlePlaybackSpeed = function (mod) {
|
|
3276
3288
|
if (audioRef.current) {
|
|
3277
|
-
audioRef.current.playbackRate
|
|
3289
|
+
audioRef.current.playbackRate += playbackSpeedStep * mod;
|
|
3278
3290
|
}
|
|
3279
3291
|
};
|
|
3280
3292
|
var handleIncreasePlayBackSpeed = function () { return handlePlaybackSpeed(1); };
|
|
3281
3293
|
var handleDecreasePlayBackSpeed = function () { return handlePlaybackSpeed(-1); };
|
|
3282
|
-
|
|
3283
|
-
|
|
3284
|
-
|
|
3285
|
-
|
|
3286
|
-
|
|
3294
|
+
var handlePlaybackSpeedSingleControl = function () {
|
|
3295
|
+
var _a;
|
|
3296
|
+
var reachedMaxPlaybackSpeed = maxPlaybackSpeed === ((_a = audioRef === null || audioRef === void 0 ? void 0 : audioRef.current) === null || _a === void 0 ? void 0 : _a.playbackRate);
|
|
3297
|
+
if (reachedMaxPlaybackSpeed) {
|
|
3298
|
+
audioRef.current.playbackRate = minPlaybackSpeed;
|
|
3299
|
+
return;
|
|
3300
|
+
}
|
|
3301
|
+
handleIncreasePlayBackSpeed();
|
|
3302
|
+
};
|
|
3303
|
+
return (react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.Box, { borderWidth: 'default', bg: 'light', borderColor: 'extra-light', p: 'x8', borderRadius: 'x4', w: '100%', maxWidth: 'x300', ref: containerRef },
|
|
3304
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.Box, { display: 'flex', alignItems: 'center' },
|
|
3305
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.IconButton, { large: true, onClick: handlePlay, "aria-label": isPlaying ? pauseLabel : playLabel, icon: isPlaying ? 'pause-unfilled' : 'play-unfilled' }),
|
|
3306
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.Box, { mi: 'x12', position: 'relative', w: '100%' },
|
|
3307
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_Slider__WEBPACK_IMPORTED_MODULE_5__.Slider, { "aria-label": audioPlaybackRangeLabel, showOutput: false, value: currentTime, maxValue: durationTime, onChange: function (value) {
|
|
3287
3308
|
if (audioRef.current) {
|
|
3288
3309
|
audioRef.current.currentTime = value;
|
|
3289
3310
|
}
|
|
3290
3311
|
} }),
|
|
3291
|
-
|
|
3312
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.Box, { display: 'flex', alignItems: 'center', justifyContent: 'space-between', color: 'secondary-info', fontScale: 'micro', position: 'absolute', width: '100%', mb: 'neg-x8' },
|
|
3292
3313
|
getMaskTime(currentTime),
|
|
3293
|
-
|
|
3294
|
-
|
|
3295
|
-
|
|
3296
|
-
|
|
3314
|
+
collapseControls ? (react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.Box, { width: '100%', display: 'flex', justifyContent: 'space-around' },
|
|
3315
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.Box, { p: 'x4', onClick: handlePlaybackSpeedSingleControl, borderRadius: 'x4', className: SpeedControlStyle },
|
|
3316
|
+
playbackSpeed.toFixed(1),
|
|
3317
|
+
"x"))) : (react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.Box, { fontScale: 'micro', display: 'flex', justifyContent: 'space-around', id: 'controllers' },
|
|
3318
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.Box, { mi: 'x8', display: 'flex', alignItems: 'center', justifyContent: 'space-between' },
|
|
3319
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.IconButton, { "aria-label": reducePlaybackSpeedLabel, disabled: playbackSpeed <= minPlaybackSpeed, icon: 'h-bar', mini: true, onClick: handleDecreasePlayBackSpeed }),
|
|
3320
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.Box, { mi: 'x8' },
|
|
3297
3321
|
playbackSpeed.toFixed(1),
|
|
3298
3322
|
"x"),
|
|
3299
|
-
|
|
3323
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.IconButton, { "aria-label": increasePlaybackSpeedLabel, disabled: playbackSpeed >= maxPlaybackSpeed, icon: 'plus', mini: true, onClick: handleIncreasePlayBackSpeed })))),
|
|
3300
3324
|
getMaskTime(durationTime))),
|
|
3301
|
-
download && (
|
|
3325
|
+
download && (react__WEBPACK_IMPORTED_MODULE_2___default().createElement(___WEBPACK_IMPORTED_MODULE_3__.IconButton, { "aria-label": downloadAudioFileLabel, is: 'a', href: src, download: true, icon: 'download', large: true, onClick: function (e) {
|
|
3302
3326
|
var host = new URL(src).host;
|
|
3303
3327
|
if (host !== window.location.host) {
|
|
3304
3328
|
e.preventDefault();
|
|
3305
3329
|
forceDownload(src);
|
|
3306
3330
|
}
|
|
3307
3331
|
} }))),
|
|
3308
|
-
|
|
3332
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement("audio", { style: { display: 'none' }, onTimeUpdate: function (e) {
|
|
3309
3333
|
setCurrentTime(e.target.currentTime);
|
|
3310
3334
|
}, onLoadedData: function (e) {
|
|
3311
3335
|
setDurationTime(e.target.duration);
|
|
@@ -3316,8 +3340,9 @@ var AudioPlayer = (0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (_a
|
|
|
3316
3340
|
}, onPause: function () {
|
|
3317
3341
|
setIsPlaying(false);
|
|
3318
3342
|
}, controls: true },
|
|
3319
|
-
|
|
3343
|
+
react__WEBPACK_IMPORTED_MODULE_2___default().createElement("source", { src: src, type: type }))));
|
|
3320
3344
|
});
|
|
3345
|
+
var templateObject_1;
|
|
3321
3346
|
|
|
3322
3347
|
|
|
3323
3348
|
/***/ }),
|
|
@@ -13087,7 +13112,7 @@ var __assign = (undefined && undefined.__assign) || function () {
|
|
|
13087
13112
|
|
|
13088
13113
|
|
|
13089
13114
|
function Slider(props) {
|
|
13090
|
-
var label = props.label, formatOptions = props.formatOptions, _a = props.showOutput, showOutput = _a === void 0 ? true : _a, multiThumb = props.multiThumb, maxValue = props.maxValue, minValue = props.minValue
|
|
13115
|
+
var label = props.label, formatOptions = props.formatOptions, _a = props.showOutput, showOutput = _a === void 0 ? true : _a, multiThumb = props.multiThumb, maxValue = props.maxValue, minValue = props.minValue;
|
|
13091
13116
|
// Get a defaultValue in the range for multiThumb
|
|
13092
13117
|
var getMultiThumbDefaultValue = function () {
|
|
13093
13118
|
if (multiThumb && !defaultValue) {
|
|
@@ -13112,7 +13137,7 @@ function Slider(props) {
|
|
|
13112
13137
|
var _c = (0,react_aria__WEBPACK_IMPORTED_MODULE_2__.useSlider)(sliderProps, sliderState, trackRef), groupProps = _c.groupProps, trackProps = _c.trackProps, labelProps = _c.labelProps, outputProps = _c.outputProps;
|
|
13113
13138
|
var isHorizontal = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () { return sliderState.orientation === 'horizontal'; }, [sliderState.orientation]);
|
|
13114
13139
|
var isVertical = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () { return sliderState.orientation === 'vertical'; }, [sliderState.orientation]);
|
|
13115
|
-
var slider = (0,_hooks_useStyle__WEBPACK_IMPORTED_MODULE_4__.useStyle)((0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n ", ";\n ", "\n "], ["\n display: flex;\n ", ";\n ", "\n "])), isHorizontal && (0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n flex-direction: column;\n width:
|
|
13140
|
+
var slider = (0,_hooks_useStyle__WEBPACK_IMPORTED_MODULE_4__.useStyle)((0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n ", ";\n ", "\n "], ["\n display: flex;\n ", ";\n ", "\n "])), isHorizontal && (0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n flex-direction: column;\n width: 100%;\n "], ["\n flex-direction: column;\n width: 100%;\n "]))), isVertical && (0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n flex-direction: row-reverse;\n height: 100%;\n "], ["\n flex-direction: row-reverse;\n height: 100%;\n "])))), sliderState);
|
|
13116
13141
|
return (react__WEBPACK_IMPORTED_MODULE_1___default().createElement("div", __assign({}, groupProps, { className: slider }),
|
|
13117
13142
|
react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_SliderHead__WEBPACK_IMPORTED_MODULE_5__.SliderHead, { labelProps: labelProps, outputProps: outputProps, state: sliderState, showOutput: showOutput, label: label, multiThumb: multiThumb }),
|
|
13118
13143
|
react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_SliderTrack__WEBPACK_IMPORTED_MODULE_7__.SliderTrack, { state: sliderState, trackProps: trackProps, trackRef: trackRef, multiThumb: multiThumb },
|
|
@@ -13281,7 +13306,7 @@ var SliderTrack = function (_a) {
|
|
|
13281
13306
|
var getTrackGradient = function () {
|
|
13282
13307
|
if (isHorizontal) {
|
|
13283
13308
|
return multiThumb
|
|
13284
|
-
? "to right, ".concat(light, "
|
|
13309
|
+
? "to right, ".concat(light, " ").concat(getThumbPosition(state.values[0]), "%, ").concat(highlight, " 0, ").concat(highlight, " ").concat(getThumbPosition(state.values[1]), "%, ").concat(light, " 0")
|
|
13285
13310
|
: "to right, ".concat(highlight, " ").concat(getThumbPosition(state.values[0]), "%, ").concat(light, " 0%");
|
|
13286
13311
|
}
|
|
13287
13312
|
if (isVertical) {
|
|
@@ -13291,7 +13316,7 @@ var SliderTrack = function (_a) {
|
|
|
13291
13316
|
}
|
|
13292
13317
|
return undefined;
|
|
13293
13318
|
};
|
|
13294
|
-
var track = (0,_hooks_useStyle__WEBPACK_IMPORTED_MODULE_3__.useStyle)((0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n &::before {\n position: absolute;\n display: block;\n content: attr(x);\n\n background: linear-gradient(", ");\n transform: translateX(-50%);\n border-radius: 1rem;\n }\n ", ";\n ", ";\n ", ";\n "], ["\n &::before {\n position: absolute;\n display: block;\n content: attr(x);\n\n background: linear-gradient(", ");\n transform: translateX(-50%);\n border-radius: 1rem;\n }\n ", ";\n ", ";\n ", ";\n "])), getTrackGradient(), isHorizontal && (0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 100%;\n height: 30px;\n &::before {\n top: 50%;\n width: 100%;\n height: 4px;\n transform: translateY(-50%);\n }\n "], ["\n width: 100%;\n height: 30px;\n &::before {\n top: 50%;\n width: 100%;\n height: 4px;\n transform: translateY(-50%);\n }\n "]))), isVertical && (0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n width: 30px;\n height: 100%;\n &::before {\n left: 50%;\n width:
|
|
13319
|
+
var track = (0,_hooks_useStyle__WEBPACK_IMPORTED_MODULE_3__.useStyle)((0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n &::before {\n position: absolute;\n display: block;\n content: attr(x);\n\n background: linear-gradient(", ");\n transform: translateX(-50%);\n border-radius: 1rem;\n }\n ", ";\n ", ";\n ", ";\n "], ["\n &::before {\n position: absolute;\n display: block;\n content: attr(x);\n\n background: linear-gradient(", ");\n transform: translateX(-50%);\n border-radius: 1rem;\n }\n ", ";\n ", ";\n ", ";\n "])), getTrackGradient(), isHorizontal && (0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 100%;\n height: 30px;\n &::before {\n top: 50%;\n width: 100%;\n height: 4px;\n transform: translateY(-50%);\n }\n "], ["\n width: 100%;\n height: 30px;\n &::before {\n top: 50%;\n width: 100%;\n height: 4px;\n transform: translateY(-50%);\n }\n "]))), isVertical && (0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n width: 30px;\n height: 100%;\n &::before {\n left: 50%;\n width: 4px;\n height: 100%;\n }\n "], ["\n width: 30px;\n height: 100%;\n &::before {\n left: 50%;\n width: 4px;\n height: 100%;\n }\n "]))), state.isDisabled && (0,_rocket_chat_css_in_js__WEBPACK_IMPORTED_MODULE_0__.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n cursor: not-allowed;\n opacity: 0.4;\n "], ["\n cursor: not-allowed;\n opacity: 0.4;\n "])))), state);
|
|
13295
13320
|
return (react__WEBPACK_IMPORTED_MODULE_1___default().createElement("div", __assign({}, trackProps, { ref: trackRef, className: track }), children));
|
|
13296
13321
|
};
|
|
13297
13322
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|