@lumiastream/ui 0.8.6 → 0.8.8
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/ChatMessageItem.js +1 -1
- package/dist/ChatboxPanel.js +11 -7
- package/dist/EventList.js +1 -1
- package/dist/EventListItem.js +1 -1
- package/dist/GoalsList.js +1 -1
- package/dist/LSButton.js +1 -1
- package/dist/LSCheckbox.js +1 -1
- package/dist/LSColorPicker.js +1 -1
- package/dist/LSDatePicker.js +1 -1
- package/dist/LSFontPicker.js +1 -1
- package/dist/LSInput.js +1 -1
- package/dist/LSMultiSelect.js +11 -7
- package/dist/LSRadio.js +1 -1
- package/dist/LSSelect.js +11 -7
- package/dist/LSSlider.d.ts +12 -0
- package/dist/LSSlider.js +36 -0
- package/dist/LSSliderInput.d.ts +22 -10
- package/dist/LSSliderInput.js +289 -160
- package/dist/LSSwitch.js +1 -1
- package/dist/LSTextField.js +1 -1
- package/dist/LSVariableInputField.js +1 -1
- package/dist/ModActivityLog.js +1 -1
- package/dist/ModQueueItem.js +1 -1
- package/dist/ModQueueList.js +1 -1
- package/dist/ModalChrome.js +1 -1
- package/dist/PlatformIcon.js +1 -1
- package/dist/ShortcutDockGrid.js +1 -1
- package/dist/SongRequestList.js +1 -1
- package/dist/StreamStatusPanel.js +1 -1
- package/dist/ViewersList.js +1 -1
- package/dist/WidgetChrome.js +1 -1
- package/dist/components.d.ts +3 -1
- package/dist/components.js +659 -525
- package/dist/index.d.ts +3 -1
- package/dist/index.js +841 -707
- package/dist/se-import.js +848 -712
- package/package.json +7 -3
package/dist/se-import.js
CHANGED
|
@@ -5026,11 +5026,48 @@ var LSInput = forwardRef(
|
|
|
5026
5026
|
);
|
|
5027
5027
|
LSInput.displayName = "LSInput";
|
|
5028
5028
|
|
|
5029
|
-
//
|
|
5029
|
+
// #style-inject:#style-inject
|
|
5030
|
+
function styleInject(css, { insertAt } = {}) {
|
|
5031
|
+
if (!css || typeof document === "undefined") return;
|
|
5032
|
+
const head = document.head || document.getElementsByTagName("head")[0];
|
|
5033
|
+
const style = document.createElement("style");
|
|
5034
|
+
style.type = "text/css";
|
|
5035
|
+
if (insertAt === "top") {
|
|
5036
|
+
if (head.firstChild) {
|
|
5037
|
+
head.insertBefore(style, head.firstChild);
|
|
5038
|
+
} else {
|
|
5039
|
+
head.appendChild(style);
|
|
5040
|
+
}
|
|
5041
|
+
} else {
|
|
5042
|
+
head.appendChild(style);
|
|
5043
|
+
}
|
|
5044
|
+
if (style.styleSheet) {
|
|
5045
|
+
style.styleSheet.cssText = css;
|
|
5046
|
+
} else {
|
|
5047
|
+
style.appendChild(document.createTextNode(css));
|
|
5048
|
+
}
|
|
5049
|
+
}
|
|
5050
|
+
|
|
5051
|
+
// src/lumia-ui.css
|
|
5052
|
+
styleInject(".ls-color-picker,\n.ls-color-picker *,\n.mui-multi-select,\n.mui-multi-select *,\n.ls-multi-select-value,\n.ls-multi-select-value *,\n.ls-variable-picker,\n.ls-variable-picker *,\n.ls-variable-token,\n.ls-variable-token *,\n.ls-font-picker,\n.ls-font-picker *,\n.mui-ls-input,\n.mui-ls-input * {\n box-sizing: border-box;\n}\n.ls-color-picker button,\n.mui-multi-select button {\n font: inherit;\n letter-spacing: inherit;\n color: inherit;\n margin: 0;\n}\n.ls-color-picker__preview {\n appearance: none;\n -webkit-appearance: none;\n background-color: transparent;\n background-image: none;\n cursor: pointer;\n text-transform: uppercase;\n user-select: none;\n}\n.mui-ls-button.Mui-disabled {\n color: var(--neutralLight2, var(--white2, #cac9d5));\n opacity: 0.45;\n background-color: var(--separator, #0a0821);\n cursor: not-allowed;\n}\n.mui-ls-button {\n border-radius: var(--radius, 1rem);\n padding: 0.375rem 1.5rem;\n text-transform: uppercase;\n}\n.mui-ls-button.MuiButton-sizeSmall {\n padding: 0.25rem 1rem;\n}\n.mui-ls-button.MuiButton-sizeLarge {\n padding: 0.625rem 2rem;\n}\n.mui-ls-button--extended {\n padding-inline: 3rem;\n}\n.mui-ls-button.MuiButton-containedPrimary,\n.mui-ls-button.Mui-disabled.MuiButton-containedPrimary {\n background: var(--primary, #ff4076);\n color: var(--alwayswhite, #fff) !important;\n}\n.mui-ls-button.MuiButton-containedSecondary {\n background-color: var(--secondary, #535395);\n color: var(--alwayswhite, #fff) !important;\n}\n.mui-ls-button.Mui-disabled.MuiButton-containedSecondary {\n background-color: var(--secondary, #535395);\n color: var(--neutralLight2, var(--white2, #cac9d5));\n opacity: 0.4;\n}\n.mui-ls-button.MuiButton-outlinedPrimary {\n color: var(--primary, #ff4076);\n border-color: var(--primary, #ff4076);\n}\n.mui-ls-button.MuiButton-outlinedPrimary:hover {\n border-color: var(--primary, #ff4076);\n background-color: color-mix(in srgb, var(--primary, #ff4076) 12%, transparent);\n}\n.mui-ls-button.MuiButton-outlinedSecondary {\n color: var(--neutralLight1, var(--white, #fff));\n border-color: var(--secondary, #535395);\n}\n.mui-ls-button.MuiButton-outlinedSecondary.Mui-disabled {\n color: var(--neutralLight2, var(--white2, #cac9d5));\n border-color: var(--neutralDark4, var(--cardborder, #393853));\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n opacity: 0.5;\n}\n.mui-ls-button.MuiButton-outlinedSecondary:hover {\n border-color: var(--secondary, #535395);\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n}\n.mui-ls-button.MuiButton-containedError {\n color: var(--alwayswhite, #fff) !important;\n}\n.mui-ls-button.MuiButton-outlinedError {\n color: var(--error, #fd5454);\n border-color: var(--error, #fd5454);\n}\n.mui-ls-button.MuiButton-outlinedError:hover {\n border-color: var(--error, #fd5454);\n background-color: color-mix(in srgb, var(--error, #fd5454) 12%, transparent);\n}\n.mui-ls-button--neutral.mui-ls-button--contained {\n background-color: var(--neutralDark4, var(--cardborder, #393853));\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.mui-ls-button--neutral.mui-ls-button--contained:hover {\n background-color: color-mix(in srgb, var(--neutralDark4, var(--cardborder, #393853)) 82%, var(--neutralLight1, #fff));\n}\n.mui-ls-button--neutral.mui-ls-button--outlined {\n color: var(--neutralLight1, var(--white, #fff));\n border-color: var(--neutralDark4, var(--cardborder, #393853));\n background-color: transparent;\n}\n.mui-ls-button--neutral.mui-ls-button--outlined:hover {\n border-color: var(--neutralLight3, var(--grey, #9392a1));\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n}\n.mui-ls-button--neutral.mui-ls-button--text {\n color: var(--neutralLight1, var(--white, #fff));\n}\n.mui-ls-button--neutral.mui-ls-button--text:hover {\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n}\n.mui-ls-button svg {\n max-height: 24px;\n max-width: 24px;\n}\n.mui-ls-input,\n.mui-ls-select-form-control,\n.ls-font-picker,\n.ls-color-picker__input {\n width: 100%;\n}\n.MuiFormControl-root.mui-ls-input,\n.MuiFormControl-root.mui-ls-select-form-control,\n.MuiFormControl-root.mui-ls-slider-input-root {\n margin-top: 0.875rem;\n padding-top: 0;\n}\n.MuiFormControl-root.mui-ls-select-form-control {\n min-width: 100px;\n margin-bottom: 0.3rem;\n}\n.mui-ls-slider-input-root .MuiFormControl-root.mui-ls-input,\n.mui-ls-slider-input-style .MuiFormControl-root.mui-ls-input,\n.MuiFormControl-root.mui-ls-slider-input-value.mui-ls-input {\n margin-top: 0;\n padding-top: 0;\n}\n.mui-ls-input,\n.mui-ls-select-form-control,\n.mui-multi-select,\n.ls-font-picker,\n.mui-ls-slider-input-root {\n --ls-control-height: 55px;\n}\n.mui-ls-input .MuiTextField-root {\n width: 100%;\n margin: 0;\n}\n.mui-ls-input .MuiOutlinedInput-root,\n.mui-ls-input .MuiInputBase-root,\n.mui-ls-input .MuiOutlinedInput-notchedOutline,\n.mui-ls-select.MuiOutlinedInput-root,\n.mui-ls-select .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control.MuiOutlinedInput-root,\n.mui-ls-slider-input-control .MuiOutlinedInput-notchedOutline,\n.mui-multi-select .mui-ls-select.MuiOutlinedInput-root,\n.mui-multi-select .mui-ls-select .MuiOutlinedInput-notchedOutline,\n.ls-font-picker .MuiOutlinedInput-root,\n.ls-font-picker .MuiInputBase-root,\n.ls-font-picker .MuiOutlinedInput-notchedOutline,\n.ls-color-picker__input .MuiOutlinedInput-root,\n.ls-color-picker__input .MuiInputBase-root,\n.ls-color-picker__input .MuiOutlinedInput-notchedOutline {\n border-radius: var(--radius) !important;\n}\n.mui-ls-input .MuiOutlinedInput-notchedOutline,\n.mui-ls-select .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control .MuiOutlinedInput-notchedOutline {\n border: 2px solid var(--cardborder, var(--neutralDark4, #393853));\n}\n.mui-ls-input .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline,\n.mui-ls-select:hover .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {\n border-color: var(--primary, #ff4076) !important;\n}\n.mui-ls-input .MuiInputBase-root,\n.mui-ls-select.MuiInputBase-root,\n.mui-multi-select .mui-ls-select.MuiInputBase-root,\n.ls-font-picker .MuiInputBase-root {\n background-color: var(--background, var(--neutralDark1, #18162f));\n color: var(--white, var(--neutralLight1, #fff));\n min-height: var(--ls-control-height);\n}\n.mui-ls-slider-input-control.MuiInputBase-root {\n background-color: transparent;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.mui-ls-input.small .MuiInputBase-root {\n min-height: 25px;\n}\n.mui-ls-input.medium .MuiInputBase-root {\n min-height: 35px;\n}\n.mui-ls-input.noMinHeight .MuiInputBase-root {\n min-height: unset;\n}\n.mui-ls-date-picker input[type=datetime-local]::-webkit-calendar-picker-indicator {\n cursor: pointer;\n opacity: 0.9;\n filter: invert(1);\n}\n.mui-ls-select .MuiSelect-select,\n.mui-multi-select .MuiSelect-select {\n display: flex;\n min-height: calc(var(--ls-control-height) - 2px);\n align-items: center;\n box-sizing: border-box;\n background-color: var(--background, var(--neutralDark1, #18162f));\n color: var(--white, var(--neutralLight1, #fff));\n border-radius: var(--radius);\n}\n.mui-multi-select .MuiSelect-select {\n min-width: 0;\n}\n.MuiSvgIcon-root svg {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.mui-ls-input .MuiSvgIcon-root svg path {\n fill: currentcolor;\n stroke: currentcolor;\n}\n.mui-ls-input .MuiInputLabel-root,\n.mui-ls-select-form-control .MuiInputLabel-root,\n.mui-ls-slider-input-root .MuiInputLabel-root {\n display: inline-flex;\n align-items: center;\n gap: 0.35rem;\n transform: translate(14px, -10px) scale(0.875);\n font-size: 1rem;\n line-height: 1.4375em;\n color: var(--white, var(--neutralLight1, #fff)) !important;\n}\n.mui-ls-input .MuiOutlinedInput-notchedOutline legend,\n.mui-ls-select-form-control .MuiOutlinedInput-notchedOutline legend,\n.mui-ls-slider-input-control .MuiOutlinedInput-notchedOutline legend {\n font-size: 0.875rem;\n}\n.mui-ls-input legend,\n.mui-ls-select-form-control legend,\n.mui-ls-slider-input-root legend {\n max-width: unset !important;\n}\n.mui-ls-input .MuiInputLabel-root svg,\n.mui-ls-select-form-control .MuiInputLabel-root svg,\n.mui-ls-slider-input-root .MuiInputLabel-root svg {\n display: block;\n flex: 0 0 auto;\n}\n.mui-ls-select .MuiSvgIcon-root {\n color: var(--white, var(--neutralLight1, #fff));\n}\n.mui-autocomplete-select button {\n box-shadow: none;\n}\n.mui-autocomplete-select .MuiSvgIcon-root {\n color: var(--white, var(--neutralLight1, #fff));\n}\n.mui-ls-input input::placeholder,\n.mui-ls-input textarea::placeholder {\n color: var(--neutralLight3, var(--grey, #9392a1));\n opacity: 0.55;\n font-style: italic;\n}\n.mui-ls-input .MuiInputBase-input,\n.mui-ls-input .MuiInputAdornment-root,\n.mui-ls-input .MuiSvgIcon-root,\n.mui-ls-input .MuiFormHelperText-root {\n color: var(--neutralLight1, var(--white, #fff));\n opacity: 1;\n}\n.mui-ls-input .Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-input .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-select.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-select-form-control .Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-select-form-control .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-root .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {\n border-color: var(--primary, #ff4076) !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-paper,\n.ls-variable-autocomplete-paper {\n border: 1px solid var(--neutralDark4, var(--cardborder, #393853)) !important;\n border-radius: var(--radius, 1rem) !important;\n background: var(--neutralDark2, var(--cardbackground, #211f45)) !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n box-shadow: 0 16px 32px rgba(0, 0, 0, 0.32) !important;\n overflow: hidden !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-listbox,\n.ls-variable-autocomplete-listbox {\n padding: 0.25rem 0 !important;\n background: var(--neutralDark2, var(--cardbackground, #211f45)) !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-groupLabel,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-groupLabel {\n position: sticky;\n top: 0;\n z-index: 1;\n min-height: 32px;\n padding: 0.45rem 1rem 0.25rem !important;\n background: var(--neutralDark1, var(--background, #18162f)) !important;\n color: var(--neutralLight3, var(--grey, #9392a1)) !important;\n font-size: 0.75rem !important;\n font-weight: 700 !important;\n letter-spacing: 0 !important;\n line-height: 1.2 !important;\n text-transform: uppercase;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-groupUl,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-groupUl {\n padding: 0 !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-option,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option {\n display: flex !important;\n min-height: 44px !important;\n align-items: center !important;\n padding: 0.625rem 1rem !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n font-size: 1rem !important;\n line-height: 1.35 !important;\n cursor: pointer !important;\n transition: background-color 120ms ease, color 120ms ease !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-option > *,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option > * {\n min-width: 0;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-option:hover,\n.ls-variable-autocomplete-popper .MuiAutocomplete-option.Mui-focused,\n.ls-variable-autocomplete-popper .MuiAutocomplete-option[data-focus=true],\n.ls-variable-autocomplete-popper .MuiAutocomplete-option[aria-selected=true],\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option:hover,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option.Mui-focused,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option[data-focus=true],\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option[aria-selected=true] {\n background: var(--cardHover, var(--transwhite, rgba(255, 255, 255, 0.05))) !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-option {\n gap: 0.75rem;\n}\n.ls-variable-option__thumb {\n width: 40px;\n height: 40px;\n flex: 0 0 40px;\n border-radius: var(--radius, 1rem);\n object-fit: cover;\n}\n.ls-variable-option__thumb--placeholder {\n background: var(--neutralDark4, var(--cardborder, #393853));\n}\n.ls-variable-option__body {\n min-width: 0;\n}\n.ls-variable-option__label {\n color: var(--neutralLight1, var(--white, #fff));\n font-weight: 500;\n line-height: 1.25;\n}\n.ls-variable-option__helper {\n margin-top: 0.125rem;\n color: var(--neutralLight3, var(--grey, #9392a1));\n font-size: 0.875rem;\n line-height: 1.25;\n}\n.ls-variable-autocomplete-popup-indicator,\n.ls-variable-autocomplete-popup-indicator.MuiIconButton-root,\n.ls-variable-autocomplete-popup-indicator svg {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-autocomplete-popup-indicator svg path {\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-color-picker .MuiInputLabel-root .MuiSvgIcon-root,\n.ls-color-picker .MuiInputLabel-root svg,\n.ls-color-picker .MuiInputLabel-root svg path,\n.ls-color-picker__gradient button,\n.ls-color-picker__gradient button svg,\n.ls-color-picker__gradient button svg path,\n.ls-color-picker__gradient button svg line,\n.ls-color-picker__gradient button svg polyline,\n.ls-color-picker__gradient button svg polygon,\n.ls-color-picker__gradient button svg circle,\n.ls-color-picker__gradient button svg rect {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-color-picker__gradient button[aria-pressed=true] svg,\n.ls-color-picker__gradient button[aria-selected=true] svg,\n.ls-color-picker__gradient button[data-active=true] svg,\n.ls-color-picker__gradient button[aria-pressed=true] svg *,\n.ls-color-picker__gradient button[aria-selected=true] svg *,\n.ls-color-picker__gradient button[data-active=true] svg * {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-color-picker__picker--inline {\n max-height: none !important;\n}\n.ls-color-picker__gradient {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-input-adornment,\n.ls-variable-input-adornment.MuiInputAdornment-root {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: 24px;\n width: 24px;\n min-width: 24px;\n margin-left: 0.35rem;\n border-radius: var(--radius, 1rem);\n background: var(--primary, #ff4076) !important;\n color: var(--alwayswhite, var(--white, #fff)) !important;\n font-weight: 800;\n line-height: 1;\n letter-spacing: 0;\n cursor: pointer;\n user-select: none;\n}\n.ls-variable-input-adornment svg,\n.ls-variable-input-adornment path {\n color: currentcolor !important;\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-variable-input-adornment:hover,\n.ls-variable-input-adornment.MuiInputAdornment-root:hover {\n filter: brightness(1.08);\n}\n.ls-variable-input-adornment:active,\n.ls-variable-input-adornment.MuiInputAdornment-root:active {\n filter: brightness(0.96);\n}\n.mui-ls-slider-input-root {\n width: 100%;\n}\n.mui-ls-slider-input-control.MuiOutlinedInput-root {\n height: var(--ls-control-height);\n min-height: var(--ls-control-height);\n padding: 0 1rem;\n}\n.mui-ls-slider-input-control > .mui-ls-slider-input-content {\n box-sizing: border-box;\n display: flex;\n flex: 1 1 auto;\n width: 100%;\n height: 100%;\n min-width: 0;\n align-items: center;\n padding: 0 !important;\n}\n.mui-ls-slider-input-control > .mui-ls-slider-input-content:focus {\n outline: none;\n}\n.mui-ls-slider-input-row {\n display: flex;\n min-width: 0;\n min-height: calc(var(--ls-control-height) - 14px);\n align-items: center;\n gap: 1rem;\n}\n.mui-ls-slider-input-row--slider {\n flex-wrap: nowrap;\n}\n.mui-ls-slider-input-row--input {\n justify-content: stretch;\n}\n.mui-ls-slider-input-row .MuiSlider-root {\n height: 3px;\n padding: 8px 0;\n}\n.mui-ls-slider-input-row .MuiSlider-track,\n.mui-ls-slider-input-row .MuiSlider-rail {\n height: 3px;\n border: 0;\n}\n.mui-ls-slider-input-row .MuiSlider-thumb {\n width: 18px;\n height: 18px;\n}\n.mui-ls-slider-input-style input::-webkit-outer-spin-button,\n.mui-ls-slider-input-style input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n.mui-ls-slider-input-style input {\n max-width: 100px;\n padding: 0.25rem 0.5rem;\n}\n.mui-ls-slider-input-style.noMargin .MuiTextField-root {\n margin-top: 0;\n margin-bottom: 0;\n}\n.mui-ls-slider-input-content .mui-ls-slider-input-style {\n position: relative;\n z-index: 1;\n display: grid;\n flex: 1 1 auto;\n width: 100%;\n grid-template-columns: minmax(0, 1fr) auto auto;\n align-items: center;\n gap: 0.5rem;\n height: 100%;\n min-width: 0;\n transform: none !important;\n}\n.mui-ls-slider-input-info {\n position: relative;\n z-index: 2;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--neutralLight2, var(--white2, #cac9d5));\n line-height: 1;\n}\n.mui-ls-slider-input-info svg {\n display: block;\n width: 14px;\n height: 14px;\n}\n.mui-ls-slider-input-content .mui-ls-slider-input-style--input-only {\n grid-template-columns: minmax(0, 1fr) auto;\n}\n.mui-ls-slider-input-track {\n display: flex;\n width: 100%;\n min-width: 0;\n height: 2rem;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n padding-left: 1rem;\n padding-right: 1rem;\n border-radius: 9999px;\n}\n.mui-ls-slider-input-track--popout {\n padding-right: 0;\n}\n.mui-ls-slider-input-track--start-icon {\n gap: 0.5rem;\n padding-left: 0;\n}\n.mui-ls-slider-input-track--end-icon {\n gap: 0.5rem;\n padding-right: 0;\n}\n.mui-ls-slider-input-style .MuiSlider-root {\n width: 100%;\n min-width: 0;\n height: 3px;\n padding: 8px 0;\n}\n.mui-ls-slider-input-style .MuiSlider-track,\n.mui-ls-slider-input-style .MuiSlider-rail {\n height: 3px;\n border: 0;\n}\n.mui-ls-slider-input-style .MuiSlider-thumb {\n width: 18px;\n height: 18px;\n}\n.mui-ls-slider-input-style .MuiSlider-valueLabel {\n z-index: 3;\n}\n.mui-ls-slider-input-style .ls-slider-input-icon {\n display: inline-flex;\n width: 20px;\n min-width: 20px;\n height: 20px;\n min-height: 20px;\n align-items: center;\n justify-content: center;\n}\n.mui-ls-slider-input-style .ls-slider-input-icon svg {\n width: 20px;\n min-width: 20px;\n height: 20px;\n min-height: 20px;\n}\n.mui-ls-slider-input-style .ls-custom-range-input,\n.ls-custom-range-input {\n -webkit-appearance: none;\n appearance: none;\n width: 100%;\n height: 6px;\n border-radius: 15px;\n background: var(--cardborder, var(--neutralDark4, #393853));\n cursor: pointer;\n outline: none;\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-webkit-slider-thumb,\n.ls-custom-range-input::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 24px;\n height: 24px;\n border: none;\n border-radius: 50%;\n background-color: var(--white, #fff);\n transition: 0.2s ease-in-out;\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-moz-range-thumb,\n.ls-custom-range-input::-moz-range-thumb {\n width: 24px;\n height: 24px;\n border: none;\n border-radius: 50%;\n background-color: var(--white, #fff);\n transition: 0.2s ease-in-out;\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-webkit-slider-thumb:hover,\n.ls-custom-range-input::-webkit-slider-thumb:hover {\n box-shadow: 0 0 0 10px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-custom-range-input:active::-webkit-slider-thumb,\n.mui-ls-slider-input-style .ls-custom-range-input:focus::-webkit-slider-thumb,\n.ls-custom-range-input:active::-webkit-slider-thumb,\n.ls-custom-range-input:focus::-webkit-slider-thumb {\n box-shadow: 0 0 0 13px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-moz-range-thumb:hover,\n.ls-custom-range-input::-moz-range-thumb:hover {\n box-shadow: 0 0 0 10px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-custom-range-input:active::-moz-range-thumb,\n.mui-ls-slider-input-style .ls-custom-range-input:focus::-moz-range-thumb,\n.ls-custom-range-input:active::-moz-range-thumb,\n.ls-custom-range-input:focus::-moz-range-thumb {\n box-shadow: 0 0 0 13px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-slider-value-input {\n width: 96px !important;\n height: 36px !important;\n min-height: 36px !important;\n}\n.mui-ls-slider-input-style .ls-slider-value-input .MuiInputBase-root {\n height: 36px !important;\n max-width: 96px !important;\n min-height: 36px !important;\n border-radius: 15px !important;\n}\n.mui-ls-slider-input-style .ls-slider-value-input .MuiOutlinedInput-notchedOutline {\n border-radius: 15px !important;\n}\n.mui-ls-slider-input-style .ls-slider-value-input input {\n max-width: none;\n padding: 0.35rem 0.75rem;\n text-align: left;\n}\n.mui-ls-slider-input-adornment {\n justify-self: center;\n color: var(--white, var(--neutralLight1, #fff));\n white-space: nowrap;\n}\n.mui-ls-slider-input-style .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {\n border-color: var(--primary, #ff4076) !important;\n}\n.mui-ls-slider-input-value.mui-ls-input {\n margin: 0;\n}\n.mui-ls-slider-input-value.mui-ls-input .MuiFormControl-root,\n.mui-ls-slider-input-value.mui-ls-input .MuiTextField-root {\n margin: 0;\n}\n.mui-ls-slider-input-value.mui-ls-input .MuiInputBase-root {\n min-height: 36px;\n}\n.mui-ls-slider-input-value.mui-ls-input .MuiOutlinedInput-notchedOutline {\n border-color: var(--neutralDark4, var(--cardborder, #393853));\n}\n.mui-ls-slider-input-helper {\n display: block;\n margin-top: 0.25rem;\n color: var(--neutralLight3, var(--grey, #9392a1));\n font-size: 0.75rem;\n line-height: 1.25;\n}\n.ls-multi-select-value {\n display: flex;\n width: 100%;\n min-width: 0;\n flex-wrap: nowrap;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n overflow: hidden;\n white-space: nowrap;\n}\n.ls-multi-select-value__label {\n min-width: 0;\n flex: 1 1 0%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ls-multi-select-value__count {\n flex-shrink: 0;\n white-space: nowrap;\n}\n.ls-color-picker__preview {\n position: relative;\n display: inline-block;\n width: 1.5rem;\n height: 1.5rem;\n flex-shrink: 0;\n padding: 0;\n border: 1px solid color-mix(in srgb, #fff 25%, transparent);\n border-radius: var(--radius, 1rem);\n background-size: cover;\n background-position: center;\n background-repeat: no-repeat;\n box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);\n color: transparent;\n line-height: 0;\n}\n.ls-color-picker__preview:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.ls-color-picker__preview:focus {\n outline: none;\n}\n.ls-color-picker__preview:focus-visible {\n box-shadow:\n 0 0 0 2px var(--primary, #ff4076),\n 0 0 0 4px var(--neutralDark1, #1b1a28),\n 0 0 0 1px rgba(0, 0, 0, 0.25);\n}\n.ls-color-picker__gradient circle,\n.ls-color-picker__gradient polyline {\n stroke: #fff !important;\n}\n.ls-variable-picker {\n --variable-custom-color: var(--customVariables, #69ffd2);\n --variable-function-color: var(--functionVariables, var(--semanticPurple, #b489ff));\n --variable-normal-color: var(--normalVariables, var(--semanticBlue, #65b8ff));\n display: flex;\n width: 92vw;\n max-width: 1100px;\n min-height: 50vh;\n max-height: 55vh;\n flex-direction: column;\n overflow: hidden;\n padding: 1rem;\n}\n.ls-variable-picker__field {\n margin: 0 0 0.75rem;\n border: 1px solid color-mix(in srgb, var(--primary, #ff4076) 42%, var(--neutralDark4, #393853));\n border-radius: var(--radius, 1rem);\n padding: 0.5rem;\n}\n.ls-variable-picker__legend {\n padding-inline: 0.375rem;\n color: var(--primary, #ff4076);\n font-size: 0.75rem;\n font-weight: 700;\n}\n.ls-variable-picker__intro {\n margin-bottom: 1rem;\n color: var(--neutralLight2, #cac9d5);\n}\n.ls-variable-picker__header,\n.ls-variable-picker__row {\n display: grid;\n grid-template-columns: minmax(300px, 1.5fr) 1fr 1fr;\n gap: 2rem;\n}\n.ls-variable-picker__header {\n margin-bottom: 0.25rem;\n padding-inline: 0.25rem;\n padding-right: 1.7rem;\n color: var(--neutralLight3, #9392a1);\n}\n.ls-variable-picker__list {\n height: 100%;\n overflow: auto;\n padding-right: 1rem;\n}\n.ls-variable-picker__row {\n cursor: pointer;\n align-items: start;\n border-bottom: 1px solid color-mix(in srgb, var(--neutralDark4, #393853) 70%, transparent);\n padding: 1rem 0.25rem;\n}\n.ls-variable-picker__row--no-border {\n border-bottom: 0;\n}\n.ls-variable-picker__token-cell {\n display: flex;\n min-width: 0;\n align-items: center;\n gap: 0.375rem;\n}\n.ls-variable-picker__expand-toggle,\n.ls-variable-picker__expand-spacer {\n width: 24px;\n height: 24px;\n flex: 0 0 24px;\n}\n.ls-variable-picker__expand-toggle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border: 1px solid color-mix(in srgb, var(--neutralDark4, #393853) 75%, transparent);\n border-radius: var(--radius, 1rem);\n padding: 0;\n background: var(--neutralDark3, var(--containerbackground, #1f1f3a));\n color: var(--neutralLight2, #cac9d5);\n transition:\n background-color 140ms ease,\n border-color 140ms ease,\n color 140ms ease,\n transform 140ms ease;\n}\n.ls-variable-picker__expand-toggle:hover {\n border-color: var(--primary, #ff4076);\n background: color-mix(in srgb, var(--primary, #ff4076) 16%, var(--neutralDark3, #1f1f3a));\n color: var(--neutralLight1, #fff);\n}\n.ls-variable-picker__expand-toggle svg {\n transform: rotate(-90deg);\n transition: transform 140ms ease;\n}\n.ls-variable-picker__expand-toggle--expanded svg {\n transform: rotate(0deg);\n}\n.ls-variable-picker__row:active {\n opacity: 0.8;\n}\n.ls-variable-picker__description {\n max-width: 600px;\n overflow-wrap: break-word;\n line-height: 1.25;\n word-break: break-all;\n}\n.ls-variable-picker__row.ls-variable-picker__example-description {\n display: block;\n cursor: default;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n color: var(--neutralLight2, #cac9d5);\n overflow-wrap: break-word;\n line-height: 1.35;\n}\n.ls-variable-picker__row.ls-variable-picker__example-description:active {\n opacity: 1;\n}\n.ls-variable-picker__value {\n min-width: 0;\n}\n.ls-variable-picker__value-input {\n width: 100%;\n min-width: 0;\n cursor: text;\n overflow: hidden;\n border: 0;\n background: transparent;\n color: var(--neutralLight1, var(--white, #fff));\n caret-color: transparent;\n font: inherit;\n font-size: 1rem;\n line-height: 1.25;\n outline: 0;\n padding: 0;\n text-overflow: ellipsis;\n}\n.ls-variable-picker__value-input:focus {\n outline: 0;\n}\n.ls-variable-picker__value-input::selection {\n background: color-mix(in srgb, var(--primary, #ff4076) 45%, transparent);\n color: var(--alwayswhite, var(--white, #fff));\n}\n.ls-variable-token {\n display: flex;\n min-width: 0;\n align-items: center;\n}\n.ls-variable-token--suggested {\n color: var(--suggestedVariables, #ffb469);\n}\n.ls-variable-token--custom {\n color: var(--customVariables, #69ffd2);\n}\n.ls-variable-token--function {\n color: var(--functionVariables, var(--semanticPurple, #b489ff));\n}\n.ls-variable-token--system {\n color: var(--normalVariables, var(--semanticBlue, #65b8ff));\n}\n.ls-variable-highlight__layer {\n position: absolute;\n margin: 0;\n border: 0;\n box-sizing: border-box;\n overflow: hidden;\n pointer-events: none;\n background: transparent;\n color: inherit;\n white-space: pre-wrap;\n overflow-wrap: break-word;\n z-index: 0;\n}\n.ls-variable-highlight__token {\n border-radius: 4px;\n}\n.ls-variable-highlight__token--custom {\n color: var(--customVariables, #69ffd2);\n background: color-mix(in srgb, var(--customVariables, #69ffd2) 16%, transparent);\n}\n.ls-variable-highlight__token--suggested {\n color: var(--suggestedVariables, #ffb469);\n background: color-mix(in srgb, var(--suggestedVariables, #ffb469) 16%, transparent);\n}\n.ls-variable-highlight__token--function {\n color: var(--functionVariables, var(--semanticPurple, #b489ff));\n background: color-mix(in srgb, var(--functionVariables, var(--semanticPurple, #b489ff)) 16%, transparent);\n}\n.ls-variable-highlight__token--system {\n color: var(--normalVariables, var(--semanticBlue, #65b8ff));\n background: color-mix(in srgb, var(--normalVariables, var(--semanticBlue, #65b8ff)) 16%, transparent);\n}\n.ls-variable-highlight__tooltip {\n position: fixed;\n z-index: 2000;\n transform: translate(-50%, -100%);\n margin-top: -8px;\n max-width: 320px;\n padding: 6px 10px;\n border-radius: 8px;\n background: var(--neutralDark1, #171628);\n border: 1px solid var(--neutralDark4, #393853);\n color: var(--neutralLight2, #cac9d5);\n font-size: 0.75rem;\n line-height: 1.3;\n pointer-events: none;\n box-shadow: 0 4px 14px rgb(0 0 0 / 40%);\n}\n.ls-variable-token__name {\n min-width: 0;\n word-break: break-all;\n}\n.ls-variable-token__badge {\n display: inline-flex;\n margin-left: 0.5rem;\n flex-shrink: 0;\n align-items: center;\n border: 1px solid currentcolor;\n border-radius: var(--radius, 1rem);\n padding-inline: 0.25rem;\n padding-block: 0;\n font-size: 10px;\n font-weight: 600;\n line-height: 1;\n text-transform: uppercase;\n}\n.ls-chat-message {\n position: relative;\n font-size: 0.95em;\n line-height: 1.4;\n color: var(--white, var(--neutralLight1, #fff));\n overflow-wrap: break-word;\n word-break: break-word;\n}\n.ls-chat-message img {\n display: inline-block;\n}\n.ls-chat-message__reply {\n display: block;\n margin-bottom: 0.15em;\n font-size: 0.82em;\n color: var(--white2, var(--neutralLight3, #9392a1));\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ls-chat-message__avatar-prefix {\n vertical-align: middle;\n}\n.ls-chat-message__avatar {\n width: 1.3em;\n height: 1.3em;\n border-radius: 9999px;\n vertical-align: middle;\n margin-right: 0.35em;\n}\n.ls-chat-message__site {\n display: inline-block;\n vertical-align: middle;\n margin-right: 0.35em;\n}\n.ls-chat-message__site img,\n.ls-chat-message__site svg {\n width: 1.2em;\n height: 1.2em;\n vertical-align: middle;\n}\n.ls-chat-message__time {\n margin-right: 0.35em;\n font-weight: 700;\n vertical-align: middle;\n}\n.ls-chat-message__badges {\n vertical-align: middle;\n}\n.ls-chat-message__badges img {\n height: 1.05em;\n vertical-align: middle;\n margin-right: 0.25em;\n}\n.ls-chat-message__username {\n font-weight: 700;\n vertical-align: middle;\n}\n.ls-chat-message__username--clickable {\n cursor: pointer;\n background: none;\n border: 0;\n padding: 0;\n font: inherit;\n}\n.ls-chat-message__username--clickable:hover {\n text-decoration: underline;\n}\n.ls-viewerslist__username--clickable,\n.ls-eventlist-item__username--clickable {\n cursor: pointer;\n}\n.ls-viewerslist__username--clickable:hover,\n.ls-eventlist-item__username--clickable:hover {\n text-decoration: underline;\n}\n.ls-chat-message__text {\n vertical-align: middle;\n}\n.ls-chat-message__text img {\n vertical-align: middle;\n}\n.ls-chat-message__actions {\n position: absolute;\n top: 0;\n right: 0;\n}\n.ls-chat-message__modbar {\n display: flex;\n overflow: hidden;\n border-radius: 0.75rem;\n background-color: var(--separator, #0a0821);\n transition-duration: 300ms;\n}\n.ls-chat-message__modbtn {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0.5rem;\n cursor: pointer;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition-duration: 300ms;\n}\n.ls-chat-message__modbtn:hover {\n background-color: var(--cardborder, var(--neutralDark4, #393853));\n}\n.ls-chat-message__modbtn--danger:hover {\n color: var(--error, #fd5454);\n}\n.ls-chat-message__menu-icon {\n display: flex;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-eventlist-item {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-items: center;\n gap: 1em;\n border: 1px solid var(--cardborder, var(--neutralDark4, #393853));\n border-left: 4px solid var(--primary, #ff4076);\n border-radius: 1em;\n background-color: var(--cardbackground, var(--neutralDark2, #211d3e));\n color: var(--white, var(--neutralLight1, #fff));\n padding: 1em;\n line-height: 1.35;\n}\n.ls-eventlist-item__main {\n display: flex;\n flex-direction: column;\n gap: 0.2em;\n min-width: 0;\n}\n.ls-eventlist-item__identity {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n column-gap: 0.75em;\n row-gap: 0.35em;\n min-width: 0;\n}\n.ls-eventlist-item__avatar,\n.ls-eventlist-item__icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 1.5em;\n min-width: 1.5em;\n height: 1.5em;\n overflow: hidden;\n}\n.ls-eventlist-item__avatar {\n border-radius: 1em;\n background-color: var(--background, transparent);\n}\n.ls-eventlist-item__avatar img,\n.ls-eventlist-item__icon img,\n.ls-eventlist-item__icon svg {\n width: 100%;\n height: 100%;\n object-fit: contain;\n}\n.ls-eventlist-item__username {\n min-width: 0;\n font-weight: 700;\n font-size: 0.875em;\n word-break: break-all;\n}\n.ls-eventlist-item__amount {\n flex-shrink: 0;\n padding: 0.05em 0.5em;\n border-radius: 1em;\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n font-weight: 700;\n font-size: 0.75em;\n white-space: nowrap;\n}\n.ls-eventlist-item__body {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n column-gap: 0.75em;\n row-gap: 0.35em;\n min-width: 0;\n}\n.ls-eventlist-item__message {\n min-width: 0;\n word-break: break-all;\n}\n.ls-eventlist-item__usermessage {\n min-width: 0;\n font-style: italic;\n color: var(--white2, var(--neutralLight2, #cac9d5));\n word-break: break-all;\n}\n.ls-eventlist-item__time {\n flex-shrink: 0;\n color: var(--grey, var(--neutralLight3, #9392a1));\n font-size: 0.875em;\n white-space: nowrap;\n}\n.ls-eventlist-item__actions {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n align-self: center;\n gap: 0.5em;\n flex-shrink: 0;\n}\n.ls-modqueue-item {\n display: flex;\n align-items: stretch;\n gap: 0.5rem;\n border-radius: 1rem;\n background-color: color-mix(in srgb, var(--secondary, #535395) 20%, transparent);\n padding: 0.5rem;\n}\n.ls-modqueue-item__preview {\n display: flex;\n height: 4rem;\n width: 4rem;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n border-radius: 1rem;\n background-color: var(--separator, #0a0821);\n color: var(--primary, #ff4076);\n font-size: 1.75rem;\n line-height: 1;\n}\n.ls-modqueue-item__preview > * {\n display: flex;\n max-height: 100%;\n max-width: 100%;\n align-items: center;\n justify-content: center;\n line-height: 1;\n}\n.ls-modqueue-item__preview img,\n.ls-modqueue-item__preview svg {\n max-height: 100%;\n max-width: 100%;\n object-fit: contain;\n}\n.ls-modqueue-item__body {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.25rem;\n justify-content: flex-start;\n padding-top: 0.25rem;\n}\n.ls-modqueue-item__head {\n display: flex;\n align-items: center;\n gap: 0.375rem;\n flex-wrap: wrap;\n}\n.ls-modqueue-item__avatar {\n height: 1.5rem;\n width: 1.5rem;\n border-radius: 9999px;\n border: 1px solid var(--separator, #322c52);\n}\n.ls-modqueue-item__username {\n font-weight: 700;\n color: var(--white, var(--neutralLight1, #fff));\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 12rem;\n}\n.ls-modqueue-item__command {\n display: inline-flex;\n align-items: center;\n border-radius: 1rem;\n background-color: var(--separator, #0a0821);\n padding: 0.05rem 0.5rem;\n font-size: 0.8125rem;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-modqueue-item__message {\n font-size: 0.875rem;\n font-style: italic;\n color: var(--white2, var(--neutralLight2, #cac9d5));\n word-break: break-all;\n}\n.ls-modqueue-item__actions {\n display: flex;\n flex-shrink: 0;\n align-items: flex-start;\n gap: 0.5rem;\n padding-top: 0.25rem;\n}\n.ls-modqueue-item .ls-modqueue-item__iconbtn {\n padding: 0;\n border-radius: 0.5rem;\n transition: opacity 300ms ease;\n}\n.ls-modqueue-item .ls-modqueue-item__iconbtn:hover {\n background-color: transparent;\n opacity: 0.7;\n}\n.ls-modqueue-item__action-icon {\n height: 1.5rem;\n width: 1.5rem;\n flex-shrink: 0;\n}\n.ls-modlog {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.5rem;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-modlog__toolbar {\n display: flex;\n justify-content: flex-end;\n}\n.ls-modlog__clear {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n border: 0;\n border-radius: 0.75rem;\n background: transparent;\n padding: 0.25rem 0.625rem;\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n cursor: pointer;\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-modlog__clear:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 8%, transparent);\n color: var(--white, #fff);\n}\n.ls-modlog__empty {\n display: flex;\n height: 100%;\n flex: 1;\n align-items: center;\n justify-content: center;\n border-radius: 1rem;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-modlog__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.375rem;\n overflow: auto;\n}\n.ls-modlog__row {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n border-radius: 0.625rem;\n border-left: 3px solid var(--ls-modlog-accent, var(--primary, #ff4076));\n padding: 0.5rem 0.625rem;\n font-size: 0.8125rem;\n background-color: var(--separator, var(--neutralDark2, #1b1834));\n background-image: linear-gradient(var(--ls-modlog-bar, transparent), var(--ls-modlog-bar, transparent));\n}\n.ls-modlog__head {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n.ls-modlog__avatar {\n height: 1.25rem;\n width: 1.25rem;\n border-radius: 9999px;\n}\n.ls-modlog__title {\n display: inline-flex;\n align-items: center;\n border-radius: 0.375rem;\n padding: 0.05rem 0.4rem;\n font-size: 0.625rem;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n color: var(--ls-modlog-accent, var(--primary, #ff4076));\n background-color: color-mix(in srgb, var(--ls-modlog-accent, #ff4076) 18%, transparent);\n}\n.ls-modlog__time {\n margin-left: auto;\n flex-shrink: 0;\n color: var(--grey, var(--neutralLight3, #9392a1));\n font-size: 0.6875rem;\n font-variant-numeric: tabular-nums;\n}\n.ls-modlog__message {\n word-break: break-word;\n overflow-wrap: anywhere;\n line-height: 1.35;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-songreq {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.75rem;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-songreq--empty {\n align-items: center;\n justify-content: center;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__addbar {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n}\n.ls-songreq__addbar .ls-songreq__addinput {\n flex: 1;\n}\n.ls-songreq__empty {\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: center;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__now {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.75rem;\n background-color: var(--separator, var(--neutralDark2, #1b1834));\n}\n.ls-songreq__art {\n height: 3.5rem;\n width: 3.5rem;\n flex-shrink: 0;\n border-radius: 0.75rem;\n object-fit: cover;\n}\n.ls-songreq__nowbody {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.1rem;\n}\n.ls-songreq__title {\n overflow: hidden;\n font-size: 0.875rem;\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-songreq__artist {\n overflow: hidden;\n font-size: 0.75rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__requester {\n overflow: hidden;\n font-size: 0.6875rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__progress {\n margin-top: 0.375rem;\n height: 0.375rem;\n width: 100%;\n overflow: hidden;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n}\n.ls-songreq__progressbar {\n height: 100%;\n border-radius: 9999px;\n background-color: var(--success, #1db954);\n transition: width 1000ms linear;\n}\n.ls-songreq__controls {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.375rem;\n}\n.ls-songreq__btn {\n display: inline-flex;\n height: 2rem;\n width: 2rem;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n border-radius: 0.625rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background: transparent;\n font-size: 0.875rem;\n line-height: 1;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: background-color 120ms ease, color 120ms ease;\n}\n.ls-songreq__btn:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-songreq__queue {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n}\n.ls-songreq__queuehead {\n margin-bottom: 0.25rem;\n padding: 0 0.25rem;\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__queuelist {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.25rem;\n overflow: auto;\n}\n.ls-songreq__queueempty {\n padding: 0.5rem 0.25rem;\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__item {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n border-radius: 0.75rem;\n padding: 0.375rem 0.5rem;\n transition: background-color 120ms ease;\n}\n.ls-songreq__item:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 4%, transparent);\n}\n.ls-songreq__itemart {\n height: 2.25rem;\n width: 2.25rem;\n flex-shrink: 0;\n border-radius: 0.5rem;\n object-fit: cover;\n}\n.ls-songreq__itembody {\n min-width: 0;\n flex: 1;\n}\n.ls-songreq__itemtitle {\n overflow: hidden;\n font-size: 0.875rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-songreq__itemmeta {\n overflow: hidden;\n font-size: 0.75rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__remove {\n flex-shrink: 0;\n cursor: pointer;\n border: 0;\n background: transparent;\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: color 120ms ease;\n}\n.ls-songreq__remove:hover {\n color: var(--error, #fd5454);\n}\n.ls-modqueue {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.5rem;\n overflow: hidden;\n}\n.ls-modqueue__search-icon {\n height: 1rem;\n width: 1rem;\n flex-shrink: 0;\n margin-right: 0.5rem;\n color: var(--white2, var(--neutralLight2, #cac9d5));\n}\n.ls-modqueue__empty {\n display: flex;\n height: 100%;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-modqueue__empty-icon {\n font-size: 1.875rem;\n}\n.ls-modqueue__bulk {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: flex-end;\n gap: 0.5rem;\n}\n.ls-modqueue .ls-modqueue__bulk-btn {\n display: inline-flex;\n align-items: center;\n gap: 0.25rem;\n cursor: pointer;\n border-radius: 0.5rem;\n border: 1px solid currentcolor;\n background: transparent;\n padding: 0.25rem 0.5rem;\n font-size: 0.75rem;\n font-weight: 600;\n transition: opacity 120ms ease;\n}\n.ls-modqueue .ls-modqueue__bulk-btn:hover {\n opacity: 0.7;\n}\n.ls-modqueue .ls-modqueue__bulk-btn--deny {\n color: var(--error, #fd5454);\n}\n.ls-modqueue .ls-modqueue__bulk-btn--approve {\n color: var(--success, #7ed187);\n}\n.ls-modqueue__bulk-icon {\n height: 1rem;\n width: 1rem;\n flex-shrink: 0;\n}\n.ls-modqueue__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.5rem;\n overflow: auto;\n}\n.ls-modqueue__readonly {\n font-size: 0.625rem;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-modqueue__search-slot {\n flex-shrink: 0;\n}\n.ls-chatbox {\n display: flex;\n height: 100%;\n flex-direction: column;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-chatbox__viewport {\n position: relative;\n flex: 1;\n min-height: 0;\n overflow: hidden;\n}\n.ls-chatbox__list {\n display: flex;\n height: 100%;\n flex-direction: column;\n overflow-y: auto;\n padding: 0.75rem;\n}\n.ls-chatbox__jump {\n position: absolute;\n bottom: 0.75rem;\n right: 0.75rem;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n cursor: pointer;\n border-radius: 9999px;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: color-mix(in srgb, var(--white, #fff) 5%, transparent);\n padding: 0.5rem 0.75rem;\n font-size: 0.75rem;\n color: color-mix(in srgb, var(--white, #fff) 80%, transparent);\n box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n backdrop-filter: blur(4px);\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-chatbox__jump:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-chatbox__jump-arrow {\n height: 0.875rem;\n width: 0.875rem;\n}\n.ls-chatbox__jump-arrow--up {\n transform: rotate(180deg);\n}\n.ls-chatbox__jump-badge {\n margin-left: 0.25rem;\n border-radius: 9999px;\n background-color: var(--primary, #ff4076);\n padding: 0.125rem 0.5rem;\n font-size: 0.625rem;\n font-weight: 600;\n color: var(--alwayswhite, #fff);\n}\n.ls-chatbox__sendbar {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n padding: 0 0.75rem 0.75rem;\n}\n.ls-chatbox__sendbar .ls-chatbox__input {\n flex: 2 1 0%;\n min-width: 100px;\n width: 100%;\n}\n.ls-chatbox__sendbar .ls-chatbox__platform {\n flex: 1 1 0%;\n min-width: 7.5rem;\n height: 55px;\n}\n.ls-chatbox__sendbar .ls-chatbox__chatas {\n flex: 0 1 auto;\n min-width: 5.5rem;\n height: 55px;\n}\n.ls-chatbox__sendbar .ls-chatbox__send {\n height: 55px;\n flex-shrink: 0;\n}\n.ls-panel {\n --ls-panel-padding: 0.75rem;\n display: flex;\n flex-direction: column;\n border-radius: 1rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: var(--ls-panel-bg, #1b1834);\n box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.55);\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-panel__clickaway {\n position: fixed;\n inset: 0;\n z-index: 20;\n}\n.ls-panel__header {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n padding: var(--ls-panel-padding) var(--ls-panel-padding) 0.5rem;\n}\n.ls-panel__title {\n min-width: 0;\n font-size: 1rem;\n font-weight: 700;\n color: var(--white, #fff);\n}\n.ls-panel__title--label {\n font-size: 0.75rem;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-panel__header-actions {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-panel__close {\n display: flex;\n height: 1.5rem;\n width: 1.5rem;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n border: 0;\n border-radius: 0.5rem;\n background: transparent;\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-panel__close:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-panel__body {\n min-height: 0;\n flex: 1;\n overflow: auto;\n padding: 0 var(--ls-panel-padding) var(--ls-panel-padding);\n}\n.ls-panel--no-header .ls-panel__body {\n padding-top: var(--ls-panel-padding);\n}\n.ls-panel__footer {\n flex-shrink: 0;\n padding: 0.5rem var(--ls-panel-padding) var(--ls-panel-padding);\n}\n.ls-modal {\n position: fixed;\n inset: 0;\n z-index: 2000;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1rem;\n}\n.ls-modal--absolute {\n position: absolute;\n}\n.ls-modal__backdrop {\n position: absolute;\n inset: 0;\n background-color: color-mix(in srgb, var(--ls-modal-backdrop, var(--separator, #0a0821)) 75%, transparent);\n backdrop-filter: blur(4px);\n}\n.ls-modal__card {\n position: relative;\n width: 100%;\n max-width: var(--ls-modal-max-width, min(560px, 92vw));\n max-height: 85vh;\n}\n.ls-modal__card--fit {\n width: auto;\n}\n.ls-modal__card--center .ls-panel__body {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n.ls-dialog {\n margin-top: 0.5rem;\n display: flex;\n height: 100%;\n width: 100%;\n align-items: center;\n justify-content: center;\n}\n.ls-dialog__card {\n position: relative;\n z-index: 10;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n overflow: hidden;\n border-radius: 1rem;\n outline: none;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-dialog__card--pad {\n padding: 1rem;\n}\n.ls-dialog__card--full {\n border-radius: 0;\n}\n.ls-dialog__top {\n display: flex;\n width: 100%;\n align-items: flex-start;\n justify-content: space-between;\n}\n.ls-dialog__top--full {\n margin-top: 2rem;\n}\n.ls-dialog__top-side {\n flex: 1;\n}\n.ls-dialog__title {\n font-size: 1.25rem;\n color: var(--white, #fff);\n}\n.ls-dialog__close {\n display: flex;\n flex: 1;\n justify-content: flex-end;\n user-select: none;\n font-weight: 700;\n color: var(--white, #fff);\n}\n.ls-dialog__close-btn {\n display: flex;\n cursor: pointer;\n align-items: center;\n gap: 0.5rem;\n}\n.ls-dialog__close-label {\n cursor: pointer;\n font-size: 1rem;\n font-weight: 700;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-dialog__body {\n display: flex;\n width: 100%;\n flex: 1;\n min-height: 0;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n overflow: auto;\n}\n.ls-dialog__bottom {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n padding-bottom: 1rem;\n}\n.ls-eventlist {\n display: flex;\n height: 100%;\n min-height: 0;\n flex-direction: column;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n line-height: 1.35;\n}\n.ls-eventlist__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.5em;\n overflow-y: auto;\n}\n.ls-eventlist__row {\n flex-shrink: 0;\n animation: ls-eventlist-enter 250ms ease;\n}\n.ls-eventlist__empty {\n display: flex;\n height: 100%;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.75em;\n border-radius: 1em;\n padding: 1em;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-eventlist__empty-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: 1.875em;\n}\n.ls-eventlist__empty-icon img,\n.ls-eventlist__empty-icon svg {\n width: 1.6em;\n height: 1.6em;\n}\n@keyframes ls-eventlist-enter {\n from {\n opacity: 0;\n transform: translateX(-1.5em);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n.ls-streamstatus {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.75rem;\n overflow: auto;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-streamstatus--empty {\n align-items: center;\n justify-content: center;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__status {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.625rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__indicator {\n position: relative;\n display: inline-flex;\n height: 0.75rem;\n width: 0.75rem;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n}\n.ls-streamstatus__indicator-ping {\n position: absolute;\n height: 100%;\n width: 100%;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--success, #7ed187) 60%, transparent);\n animation: ls-streamstatus-ping 1.2s cubic-bezier(0, 0, 0.2, 1) infinite;\n}\n@keyframes ls-streamstatus-ping {\n 75%, 100% {\n transform: scale(2);\n opacity: 0;\n }\n}\n.ls-streamstatus__indicator-dot {\n position: relative;\n height: 0.75rem;\n width: 0.75rem;\n border-radius: 9999px;\n background-color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__indicator-dot--online {\n background-color: var(--success, #7ed187);\n}\n.ls-streamstatus__status-body {\n display: flex;\n min-width: 0;\n flex-direction: column;\n}\n.ls-streamstatus__status-label {\n overflow: hidden;\n font-size: 0.875rem;\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-streamstatus__status-sublabel {\n overflow: hidden;\n font-size: 0.75rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__overview {\n display: flex;\n flex-shrink: 0;\n align-items: stretch;\n gap: 0.5rem;\n}\n.ls-streamstatus__total {\n display: flex;\n flex-shrink: 0;\n flex-direction: column;\n justify-content: center;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.5rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__total-value {\n font-size: 1.875rem;\n font-weight: 700;\n line-height: 1;\n color: var(--primary, #ff4076);\n}\n.ls-streamstatus__total-label {\n margin-top: 0.25rem;\n font-size: 0.6875rem;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__platforms {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n justify-content: center;\n gap: 0.25rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.5rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__platforms-empty {\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__platform {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n}\n.ls-streamstatus__platform-info {\n display: inline-flex;\n min-width: 0;\n align-items: center;\n gap: 0.375rem;\n font-size: 0.75rem;\n color: color-mix(in srgb, var(--white, #fff) 80%, transparent);\n}\n.ls-streamstatus__platform-icon {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n}\n.ls-streamstatus__platform-icon img,\n.ls-streamstatus__platform-icon svg {\n height: 0.875rem;\n width: 0.875rem;\n}\n.ls-streamstatus__platform-dot {\n height: 0.5rem;\n width: 0.5rem;\n flex-shrink: 0;\n border-radius: 9999px;\n background-color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__platform-label {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ls-streamstatus__platform-value {\n flex-shrink: 0;\n font-size: 0.75rem;\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n color: var(--white, #fff);\n}\n.ls-streamstatus__stats {\n display: grid;\n flex-shrink: 0;\n grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));\n gap: 0.5rem;\n}\n.ls-streamstatus__stat {\n display: flex;\n min-width: 0;\n flex-direction: column;\n gap: 0.125rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.5rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__stat-head {\n display: flex;\n align-items: center;\n gap: 0.375rem;\n}\n.ls-streamstatus__stat-icon {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n}\n.ls-streamstatus__stat-icon img,\n.ls-streamstatus__stat-icon svg {\n height: 1rem;\n width: 1rem;\n}\n.ls-streamstatus__stat-actions {\n display: inline-flex;\n margin-left: auto;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-streamstatus__stat-value {\n overflow: hidden;\n font-size: 1.125rem;\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-streamstatus__stat-trendrow {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-streamstatus__stat-trendrow svg {\n width: 10px;\n flex-shrink: 0;\n}\n.ls-streamstatus__stat-label {\n min-width: 0;\n overflow: hidden;\n font-size: 0.6875rem;\n letter-spacing: 0.05em;\n text-overflow: ellipsis;\n text-transform: uppercase;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__stat-sub {\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.5rem;\n overflow: hidden;\n}\n.ls-viewerslist__head {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n}\n.ls-viewerslist__count {\n flex-shrink: 0;\n font-size: 0.875rem;\n font-weight: 700;\n color: var(--white, #fff);\n}\n.ls-viewerslist__search {\n min-width: 0;\n flex: 1;\n border-radius: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: color-mix(in srgb, var(--black, #000) 20%, transparent);\n padding: 0.375rem 0.75rem;\n font-size: 0.8125rem;\n color: var(--white, #fff);\n outline: none;\n}\n.ls-viewerslist__search:focus {\n border-color: var(--primary, #ff4076);\n}\n.ls-viewerslist__search::placeholder {\n color: color-mix(in srgb, var(--grey, var(--neutralLight3, #9392a1)) 60%, transparent);\n}\n.ls-viewerslist__search-slot {\n min-width: 0;\n flex: 1;\n}\n.ls-viewerslist__hint {\n flex-shrink: 0;\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__empty {\n display: flex;\n height: 100%;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__empty-icon {\n font-size: 1.875rem;\n}\n.ls-viewerslist__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.125rem;\n overflow: auto;\n}\n.ls-viewerslist__group {\n margin-top: 0.375rem;\n flex-shrink: 0;\n padding: 0 0.25rem;\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__group:first-child {\n margin-top: 0;\n}\n.ls-viewerslist__viewer {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n border-radius: 0.5rem;\n padding: 0.25rem 0.375rem;\n transition: background-color 120ms ease;\n}\n.ls-viewerslist__viewer:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 4%, transparent);\n}\n.ls-viewerslist__avatar {\n height: 1.5rem;\n width: 1.5rem;\n flex-shrink: 0;\n border-radius: 9999px;\n object-fit: cover;\n}\n.ls-viewerslist__platform {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__platform img,\n.ls-viewerslist__platform svg {\n height: 0.875rem;\n width: 0.875rem;\n}\n.ls-viewerslist__username {\n min-width: 0;\n flex: 1;\n overflow: hidden;\n font-size: 0.875rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: color-mix(in srgb, var(--white, #fff) 90%, transparent);\n}\n.ls-viewerslist__badges {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-viewerslist__actions {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-shortcutdock,\n.ls-shortcutdock * {\n box-sizing: border-box;\n}\n.ls-shortcutdock {\n display: grid;\n width: 100%;\n align-content: start;\n gap: 0.5rem;\n overflow: auto;\n}\n.ls-shortcutdock--disabled {\n opacity: 0.55;\n}\n.ls-shortcutdock__empty {\n grid-column: 1 / -1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1rem;\n text-align: center;\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-shortcutdock__cell {\n position: relative;\n min-width: 0;\n}\n.ls-shortcutdock__btn {\n display: flex;\n height: 100%;\n width: 100%;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.25rem;\n cursor: pointer;\n border-radius: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 12%, transparent);\n background-color: transparent;\n padding: 0.25rem;\n font: inherit;\n color: var(--white, #fff);\n box-shadow: inset 0 -2px 0 var(--ls-shortcutdock-accent-soft, transparent) !important;\n transition:\n background-color 150ms ease,\n border-color 150ms ease,\n opacity 150ms ease;\n}\n.ls-shortcutdock__btn:hover {\n border-color: color-mix(in srgb, var(--white, #fff) 20%, transparent);\n background-color: color-mix(in srgb, var(--white, #fff) 7%, transparent);\n}\n.ls-shortcutdock__btn--selected,\n.ls-shortcutdock__btn--selected:hover {\n border-color: var(--primary, #ff4076);\n}\n.ls-shortcutdock__btn:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.ls-shortcutdock--readonly .ls-shortcutdock__btn {\n cursor: default;\n}\n.ls-shortcutdock--readonly .ls-shortcutdock__btn:hover {\n border-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-shortcutdock__icon {\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.15rem;\n line-height: 1;\n}\n.ls-shortcutdock__btn--lg .ls-shortcutdock__icon {\n font-size: 1.5rem;\n}\n.ls-shortcutdock__btn-image {\n width: 1.5rem;\n height: 1.5rem;\n flex-shrink: 0;\n border-radius: 0.375rem;\n object-fit: cover;\n}\n.ls-shortcutdock__btn--lg .ls-shortcutdock__btn-image {\n width: 2rem;\n height: 2rem;\n}\n.ls-shortcutdock__btn--icon-only .ls-shortcutdock__btn-image {\n width: 60%;\n height: 60%;\n border-radius: 0.5rem;\n}\n.ls-shortcutdock__label {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n padding-inline: 0.125rem;\n text-align: center;\n font-size: 0.625rem;\n font-weight: 600;\n line-height: 1.2;\n color: color-mix(in srgb, var(--white, #fff) 90%, transparent);\n}\n.ls-shortcutdock__btn--icon-only {\n font-size: clamp(1rem, 1.4vw, 1.5rem);\n font-weight: 700;\n}\n.ls-shortcutdock__btn--icon-only .ls-shortcutdock__icon {\n width: 100%;\n height: 100%;\n font-size: inherit;\n}\n.ls-shortcutdock__btn--icon-only .ls-shortcutdock__icon svg {\n width: 60%;\n height: 60%;\n}\n.ls-shortcutdock__remove {\n position: absolute;\n top: -0.375rem;\n right: -0.375rem;\n z-index: 1;\n display: flex;\n height: 1.25rem;\n width: 1.25rem;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n border-radius: 9999px;\n background-color: var(--error, #fd5454);\n padding: 0;\n font: inherit;\n font-size: 0.75rem;\n line-height: 1;\n color: var(--white, #fff);\n box-shadow: 0 1px 3px color-mix(in srgb, var(--black, #000) 30%, transparent);\n transition: opacity 120ms ease;\n}\n.ls-shortcutdock__remove:hover {\n opacity: 0.8;\n}\n.ls-shortcutdock__add {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 0.75rem;\n border: 1px dashed color-mix(in srgb, var(--white, #fff) 20%, transparent);\n background: transparent;\n padding: 0.25rem;\n font: inherit;\n font-size: 1.5rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: border-color 150ms ease, color 150ms ease;\n}\n.ls-shortcutdock__add:hover {\n border-color: color-mix(in srgb, var(--white, #fff) 40%, transparent);\n color: var(--white, #fff);\n}\n.ls-goals,\n.ls-goals * {\n box-sizing: border-box;\n}\n.ls-goals {\n display: flex;\n width: 100%;\n flex-direction: column;\n gap: 1rem;\n}\n.ls-goals__empty {\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-goals__head {\n display: flex;\n align-items: baseline;\n gap: 0.375rem;\n font-size: 0.875rem;\n}\n.ls-goals__icon {\n display: flex;\n align-self: center;\n align-items: center;\n line-height: 1;\n}\n.ls-goals__label {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n font-weight: 600;\n color: var(--white, #fff);\n}\n.ls-goals__value {\n flex-shrink: 0;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-goals__target {\n opacity: 0.6;\n}\n.ls-goals__bar {\n margin-top: 0.375rem;\n height: 0.625rem;\n width: 100%;\n overflow: hidden;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n}\n.ls-goals__fill {\n height: 100%;\n border-radius: 9999px;\n background-image:\n linear-gradient(\n 90deg,\n color-mix(in srgb, var(--ls-goals-accent, var(--primary, #ff4076)) 80%, transparent),\n var(--ls-goals-accent, var(--primary, #ff4076)));\n transition: width 700ms ease-out;\n}\n.ls-goals__percent {\n flex-shrink: 0;\n min-width: 2.75rem;\n text-align: right;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n color: var(--ls-goals-accent, var(--primary, #ff4076));\n}\n.ls-platform-icon {\n display: inline-block;\n height: 1.15em;\n width: auto;\n max-width: 1.5em;\n vertical-align: middle;\n object-fit: contain;\n}\n.ls-chatbox__platform-option {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n min-width: 0;\n}\n.ls-shortcutdock__btn--colored {\n border-color: color-mix(in srgb, var(--ls-shortcutdock-accent, var(--white, #fff)) 70%, transparent);\n box-shadow: inset 0 -2px 0 var(--ls-shortcutdock-accent-soft, transparent);\n}\n.ls-shortcutdock__btn--colored:hover {\n border-color: var(--ls-shortcutdock-accent, var(--white, #fff));\n background-color: color-mix(in srgb, var(--ls-shortcutdock-accent, var(--white, #fff)) 12%, transparent);\n}\n.ls-widget {\n position: relative;\n display: flex;\n height: 100%;\n flex-direction: column;\n overflow: hidden;\n border-radius: var(--radius, 1rem);\n border: 1px solid color-mix(in srgb, var(--cardborder, #393853) 50%, transparent);\n background-image: var(--gradientBg, linear-gradient(180deg, #1b1834 0%, #151230 100%));\n background-color: var(--background, #151230);\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-widget__header {\n position: relative;\n display: flex;\n min-height: 2.75rem;\n width: 100%;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n border-bottom: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n padding-inline: 0.5rem;\n}\n.ls-widget__side {\n display: flex;\n z-index: 10;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-widget__side--right {\n margin-left: auto;\n}\n.ls-widget__title {\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n pointer-events: none;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n font-size: 0.875rem;\n font-weight: 600;\n letter-spacing: 0.025em;\n white-space: nowrap;\n}\n.ls-widget__btn {\n display: flex;\n height: 2rem;\n width: 2rem;\n flex-shrink: 0;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n border: 0;\n border-radius: 0.375rem;\n background-color: color-mix(in srgb, var(--white, #fff) 5%, transparent);\n color: color-mix(in srgb, var(--white, #fff) 70%, transparent);\n font: inherit;\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-widget__btn:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-widget__btn--active {\n background-color: color-mix(in srgb, var(--primary, #ff4076) 20%, transparent);\n color: var(--primary, #ff4076);\n}\n.ls-widget__btn--active:hover {\n background-color: color-mix(in srgb, var(--primary, #ff4076) 30%, transparent);\n color: var(--primary, #ff4076);\n}\n.ls-widget__btn svg {\n height: 1rem;\n width: 1rem;\n}\n.ls-widget__body {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n overflow: auto;\n}\n");
|
|
5053
|
+
|
|
5054
|
+
// src/components/LSSlider/LSSlider.tsx
|
|
5030
5055
|
import Slider from "@mui/material/Slider";
|
|
5031
|
-
import
|
|
5032
|
-
|
|
5033
|
-
|
|
5056
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
5057
|
+
var LSSlider = ({ color, sx, ...props }) => {
|
|
5058
|
+
const validColor = color && ["primary", "secondary", "error", "info", "success", "warning"].includes(color) ? color : void 0;
|
|
5059
|
+
const resolvedSx = [{ color: "var(--white, #fff)" }, ...Array.isArray(sx) ? sx : sx ? [sx] : []];
|
|
5060
|
+
return /* @__PURE__ */ jsx3(Slider, { ...props, color: validColor, sx: resolvedSx });
|
|
5061
|
+
};
|
|
5062
|
+
|
|
5063
|
+
// src/components/LSSliderInput/LSSliderInput.tsx
|
|
5064
|
+
import FormControl2 from "@mui/material/FormControl";
|
|
5065
|
+
import FormHelperText from "@mui/material/FormHelperText";
|
|
5066
|
+
import InputLabel from "@mui/material/InputLabel";
|
|
5067
|
+
import OutlinedInput from "@mui/material/OutlinedInput";
|
|
5068
|
+
import Tooltip from "@mui/material/Tooltip";
|
|
5069
|
+
import { forwardRef as forwardRef2, useCallback, useEffect, useMemo, useState } from "react";
|
|
5070
|
+
import { jsx as jsx4, jsxs } from "react/jsx-runtime";
|
|
5034
5071
|
var normalizeSliderValue = (rawValue) => {
|
|
5035
5072
|
if (typeof rawValue === "number") {
|
|
5036
5073
|
return Number.isFinite(rawValue) ? rawValue : 0;
|
|
@@ -5045,173 +5082,290 @@ var normalizeSliderValue = (rawValue) => {
|
|
|
5045
5082
|
}
|
|
5046
5083
|
return 0;
|
|
5047
5084
|
};
|
|
5048
|
-
var
|
|
5049
|
-
|
|
5050
|
-
|
|
5051
|
-
|
|
5052
|
-
|
|
5053
|
-
|
|
5054
|
-
|
|
5055
|
-
|
|
5056
|
-
|
|
5057
|
-
|
|
5058
|
-
|
|
5059
|
-
|
|
5060
|
-
|
|
5061
|
-
|
|
5062
|
-
|
|
5063
|
-
|
|
5064
|
-
|
|
5065
|
-
|
|
5066
|
-
|
|
5067
|
-
|
|
5068
|
-
|
|
5069
|
-
|
|
5070
|
-
|
|
5071
|
-
|
|
5072
|
-
|
|
5073
|
-
|
|
5074
|
-
|
|
5075
|
-
|
|
5076
|
-
|
|
5077
|
-
|
|
5078
|
-
|
|
5079
|
-
|
|
5080
|
-
|
|
5081
|
-
|
|
5082
|
-
|
|
5083
|
-
|
|
5084
|
-
|
|
5085
|
-
|
|
5086
|
-
|
|
5087
|
-
|
|
5088
|
-
|
|
5089
|
-
|
|
5090
|
-
|
|
5091
|
-
|
|
5092
|
-
|
|
5093
|
-
|
|
5094
|
-
|
|
5095
|
-
|
|
5096
|
-
|
|
5097
|
-
|
|
5098
|
-
|
|
5099
|
-
|
|
5100
|
-
|
|
5101
|
-
|
|
5102
|
-
|
|
5103
|
-
|
|
5104
|
-
|
|
5105
|
-
|
|
5106
|
-
|
|
5107
|
-
|
|
5108
|
-
|
|
5109
|
-
|
|
5110
|
-
|
|
5111
|
-
|
|
5112
|
-
|
|
5113
|
-
|
|
5114
|
-
|
|
5115
|
-
|
|
5116
|
-
if (inputValue === "" || inputValue === null) {
|
|
5117
|
-
if (typeof onChange === "function") {
|
|
5118
|
-
onChange(void 0);
|
|
5085
|
+
var getDecimalPlaces = (stepValue) => {
|
|
5086
|
+
if (!stepValue || stepValue >= 1) {
|
|
5087
|
+
return 0;
|
|
5088
|
+
}
|
|
5089
|
+
const stepString = stepValue.toString();
|
|
5090
|
+
const decimalIndex = stepString.indexOf(".");
|
|
5091
|
+
return decimalIndex === -1 ? 0 : stepString.length - decimalIndex - 1;
|
|
5092
|
+
};
|
|
5093
|
+
var InfoIcon = () => /* @__PURE__ */ jsx4("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx4(
|
|
5094
|
+
"path",
|
|
5095
|
+
{
|
|
5096
|
+
d: "M7 0C3.1402 0 0 3.1402 0 7C0 10.8598 3.1402 14 7 14C10.8598 14 14 10.8598 14 7C14 3.1402 10.8598 0 7 0ZM7.7 11.2H6.3V9.8H7.7V11.2ZM8.3832 7.7805C8.246 7.8911 8.1137 7.9968 8.0087 8.1018C7.7231 8.3867 7.7007 8.6457 7.7 8.6569V8.75H6.3V8.6331C6.3 8.5505 6.3203 7.8092 7.0182 7.1113C7.1547 6.9748 7.3241 6.8362 7.5019 6.692C8.0157 6.2755 8.3531 5.9717 8.3531 5.5531C8.34497 5.19947 8.19875 4.86308 7.94574 4.61588C7.69273 4.36869 7.35303 4.23034 6.99931 4.23043C6.64559 4.23052 6.30595 4.36905 6.05307 4.61637C5.80019 4.8637 5.65415 5.20017 5.6462 5.5538H4.2462C4.2462 4.0355 5.4817 2.8 7 2.8C8.5183 2.8 9.7538 4.0355 9.7538 5.5538C9.7538 6.6717 8.9285 7.3388 8.3832 7.7805Z",
|
|
5097
|
+
fill: "currentColor"
|
|
5098
|
+
}
|
|
5099
|
+
) });
|
|
5100
|
+
var SliderInputContent = forwardRef2(
|
|
5101
|
+
({ className, children, ownerState, inputRef, value, defaultValue, ...props }, ref) => {
|
|
5102
|
+
const resolvedRef = ref ?? inputRef;
|
|
5103
|
+
return /* @__PURE__ */ jsx4("div", { ...props, ref: resolvedRef, className: `${className ?? ""} mui-ls-slider-input-content`.trim(), role: "group", children });
|
|
5104
|
+
}
|
|
5105
|
+
);
|
|
5106
|
+
SliderInputContent.displayName = "SliderInputContent";
|
|
5107
|
+
var LSSliderInput = forwardRef2(
|
|
5108
|
+
({
|
|
5109
|
+
name,
|
|
5110
|
+
value,
|
|
5111
|
+
defaultValue,
|
|
5112
|
+
isFloat,
|
|
5113
|
+
isMiliseconds,
|
|
5114
|
+
isFloatMiliseconds,
|
|
5115
|
+
label,
|
|
5116
|
+
helperText,
|
|
5117
|
+
info,
|
|
5118
|
+
hasInfo,
|
|
5119
|
+
infoOpen,
|
|
5120
|
+
infoClose,
|
|
5121
|
+
max = Number.MAX_SAFE_INTEGER,
|
|
5122
|
+
min = 0,
|
|
5123
|
+
sliderMin,
|
|
5124
|
+
sliderMax,
|
|
5125
|
+
step = 1,
|
|
5126
|
+
allowAnyDecimal,
|
|
5127
|
+
type = "number",
|
|
5128
|
+
inputAfterText,
|
|
5129
|
+
endAdornment,
|
|
5130
|
+
onChange,
|
|
5131
|
+
sliderProps = {},
|
|
5132
|
+
inputProps = {},
|
|
5133
|
+
color,
|
|
5134
|
+
startIcon,
|
|
5135
|
+
endIcon,
|
|
5136
|
+
inPopout,
|
|
5137
|
+
hideInput = false,
|
|
5138
|
+
hideSlider = false,
|
|
5139
|
+
fullWidth = false,
|
|
5140
|
+
valueLabelDisplay = "auto",
|
|
5141
|
+
valueLabelFormat,
|
|
5142
|
+
...rest
|
|
5143
|
+
}, ref) => {
|
|
5144
|
+
const isValueFloat = Boolean(isFloat || isFloatMiliseconds || isMiliseconds);
|
|
5145
|
+
const rangeUnit = typeof (endAdornment ?? inputAfterText) === "string" && String(endAdornment ?? inputAfterText).trim().length ? ` ${endAdornment ?? inputAfterText}` : "";
|
|
5146
|
+
const actualSliderMin = sliderMin ?? min;
|
|
5147
|
+
const actualSliderMax = sliderMax ?? max;
|
|
5148
|
+
const actualToDisplay = useCallback(
|
|
5149
|
+
(input) => {
|
|
5150
|
+
const numericValue = normalizeSliderValue(input);
|
|
5151
|
+
if (allowAnyDecimal) {
|
|
5152
|
+
return numericValue;
|
|
5119
5153
|
}
|
|
5120
|
-
|
|
5121
|
-
|
|
5122
|
-
|
|
5123
|
-
|
|
5124
|
-
|
|
5125
|
-
|
|
5126
|
-
|
|
5127
|
-
|
|
5128
|
-
|
|
5129
|
-
|
|
5130
|
-
|
|
5131
|
-
|
|
5132
|
-
|
|
5154
|
+
if (isFloatMiliseconds) {
|
|
5155
|
+
const decimalPlaces2 = getDecimalPlaces(step);
|
|
5156
|
+
return Number((numericValue / 1e3).toFixed(Math.max(1, decimalPlaces2)));
|
|
5157
|
+
}
|
|
5158
|
+
const decimalPlaces = getDecimalPlaces(step);
|
|
5159
|
+
if (decimalPlaces > 0) {
|
|
5160
|
+
return Number(numericValue.toFixed(decimalPlaces));
|
|
5161
|
+
}
|
|
5162
|
+
return isValueFloat ? Number(numericValue.toFixed(1)) : numericValue;
|
|
5163
|
+
},
|
|
5164
|
+
[allowAnyDecimal, isFloatMiliseconds, isValueFloat, step]
|
|
5165
|
+
);
|
|
5166
|
+
const resolvedDefaultValue = defaultValue ?? 0;
|
|
5167
|
+
const [actualValue, setActualValue] = useState(() => normalizeSliderValue(value ?? resolvedDefaultValue));
|
|
5168
|
+
const [displayValue, setDisplayValue] = useState(() => actualToDisplay(value ?? resolvedDefaultValue));
|
|
5169
|
+
const [rangeError, setRangeError] = useState(null);
|
|
5170
|
+
const displayStep = useMemo(() => actualToDisplay(step), [actualToDisplay, step]);
|
|
5171
|
+
const displayMaximum = useMemo(() => actualToDisplay(max), [actualToDisplay, max]);
|
|
5172
|
+
const displayMinimum = useMemo(() => actualToDisplay(min), [actualToDisplay, min]);
|
|
5173
|
+
const inputStep = allowAnyDecimal ? "any" : displayStep;
|
|
5174
|
+
const sliderColor = color === "secondary" ? "secondary" : "primary";
|
|
5175
|
+
useEffect(() => {
|
|
5176
|
+
if (value !== void 0) {
|
|
5177
|
+
const normalizedValue = normalizeSliderValue(value);
|
|
5178
|
+
setActualValue(normalizedValue);
|
|
5179
|
+
setDisplayValue(actualToDisplay(normalizedValue));
|
|
5180
|
+
setRangeError(null);
|
|
5133
5181
|
}
|
|
5134
|
-
},
|
|
5135
|
-
|
|
5136
|
-
|
|
5137
|
-
|
|
5138
|
-
|
|
5139
|
-
|
|
5140
|
-
|
|
5141
|
-
|
|
5142
|
-
|
|
5182
|
+
}, [actualToDisplay, value]);
|
|
5183
|
+
const buildRangeError = useCallback(
|
|
5184
|
+
(updatedValue) => {
|
|
5185
|
+
if (Number.isNaN(updatedValue)) {
|
|
5186
|
+
return null;
|
|
5187
|
+
}
|
|
5188
|
+
if (updatedValue < min) {
|
|
5189
|
+
return `Min ${displayMinimum}${rangeUnit}`;
|
|
5190
|
+
}
|
|
5191
|
+
if (updatedValue > max) {
|
|
5192
|
+
return `Max ${displayMaximum}${rangeUnit}`;
|
|
5193
|
+
}
|
|
5194
|
+
return null;
|
|
5195
|
+
},
|
|
5196
|
+
[displayMaximum, displayMinimum, max, min, rangeUnit]
|
|
5197
|
+
);
|
|
5198
|
+
const handleInputChange = useCallback(
|
|
5199
|
+
(event, nextValue) => {
|
|
5200
|
+
const inputValue = nextValue ?? event?.target?.value ?? "";
|
|
5201
|
+
setDisplayValue(inputValue);
|
|
5202
|
+
if (inputValue === "" || inputValue === null || inputValue === void 0) {
|
|
5203
|
+
setRangeError(null);
|
|
5204
|
+
return;
|
|
5205
|
+
}
|
|
5206
|
+
const rawValue = Number(inputValue);
|
|
5207
|
+
if (Number.isNaN(rawValue)) {
|
|
5208
|
+
setRangeError(null);
|
|
5209
|
+
return;
|
|
5210
|
+
}
|
|
5211
|
+
const updatedValue = Number(isFloatMiliseconds ? rawValue * 1e3 : rawValue);
|
|
5212
|
+
const nextRangeError = buildRangeError(updatedValue);
|
|
5213
|
+
setRangeError(nextRangeError);
|
|
5214
|
+
if (!nextRangeError) {
|
|
5215
|
+
setActualValue(updatedValue);
|
|
5216
|
+
onChange?.(updatedValue);
|
|
5217
|
+
}
|
|
5218
|
+
},
|
|
5219
|
+
[buildRangeError, isFloatMiliseconds, onChange]
|
|
5220
|
+
);
|
|
5221
|
+
const handleSliderChanging = useCallback((_, sliderInputValue) => {
|
|
5222
|
+
const nextValue = normalizeSliderValue(Array.isArray(sliderInputValue) ? sliderInputValue[0] : sliderInputValue);
|
|
5223
|
+
setActualValue(nextValue);
|
|
5224
|
+
setDisplayValue(actualToDisplay(nextValue));
|
|
5225
|
+
setRangeError(null);
|
|
5226
|
+
}, [actualToDisplay]);
|
|
5227
|
+
const handleSliderChanged = useCallback((_, sliderInputValue) => {
|
|
5228
|
+
const nextValue = normalizeSliderValue(Array.isArray(sliderInputValue) ? sliderInputValue[0] : sliderInputValue ?? actualValue);
|
|
5229
|
+
setActualValue(nextValue);
|
|
5230
|
+
setDisplayValue(actualToDisplay(nextValue));
|
|
5231
|
+
setRangeError(null);
|
|
5143
5232
|
onChange?.(nextValue);
|
|
5144
|
-
},
|
|
5145
|
-
|
|
5146
|
-
|
|
5147
|
-
|
|
5148
|
-
|
|
5149
|
-
|
|
5150
|
-
|
|
5151
|
-
|
|
5152
|
-
|
|
5153
|
-
|
|
5154
|
-
|
|
5155
|
-
|
|
5156
|
-
|
|
5157
|
-
|
|
5158
|
-
|
|
5159
|
-
|
|
5160
|
-
|
|
5161
|
-
|
|
5162
|
-
|
|
5163
|
-
|
|
5164
|
-
|
|
5165
|
-
|
|
5166
|
-
|
|
5167
|
-
|
|
5168
|
-
|
|
5169
|
-
|
|
5170
|
-
|
|
5171
|
-
|
|
5172
|
-
|
|
5173
|
-
|
|
5174
|
-
|
|
5175
|
-
|
|
5176
|
-
|
|
5177
|
-
|
|
5178
|
-
|
|
5179
|
-
|
|
5180
|
-
|
|
5181
|
-
|
|
5182
|
-
|
|
5183
|
-
|
|
5184
|
-
|
|
5185
|
-
|
|
5186
|
-
|
|
5187
|
-
|
|
5233
|
+
}, [actualToDisplay, actualValue, onChange]);
|
|
5234
|
+
const sliderProgress = useMemo(() => {
|
|
5235
|
+
const range = actualSliderMax - actualSliderMin;
|
|
5236
|
+
if (!Number.isFinite(range) || range <= 0) {
|
|
5237
|
+
return 0;
|
|
5238
|
+
}
|
|
5239
|
+
return Math.min(100, Math.max(0, (actualValue - actualSliderMin) / range * 100));
|
|
5240
|
+
}, [actualSliderMax, actualSliderMin, actualValue]);
|
|
5241
|
+
const resolvedHelperText = rangeError ? void 0 : inputProps?.helperText;
|
|
5242
|
+
const resolvedError = rangeError ? true : inputProps?.error;
|
|
5243
|
+
const { sx: sliderSx, className: sliderClassName, style: sliderStyle, disabled: sliderDisabled, ...sliderRestProps } = sliderProps;
|
|
5244
|
+
const resolvedSliderSx = [
|
|
5245
|
+
{ flex: 1, minWidth: 0, color: "var(--white, #fff)" },
|
|
5246
|
+
...Array.isArray(sliderSx) ? sliderSx : sliderSx ? [sliderSx] : []
|
|
5247
|
+
];
|
|
5248
|
+
const inputValueClassName = `${inputProps?.className ?? ""} ls-slider-value-input mui-ls-slider-input-value`.trim();
|
|
5249
|
+
const htmlInputProps = {
|
|
5250
|
+
...inputProps?.slotProps?.htmlInput ?? {},
|
|
5251
|
+
...inputProps?.inputProps ?? {},
|
|
5252
|
+
name,
|
|
5253
|
+
min: displayMinimum,
|
|
5254
|
+
max: displayMaximum,
|
|
5255
|
+
step: inputStep,
|
|
5256
|
+
inputMode: typeof inputStep === "number" && inputStep % 1 !== 0 ? "decimal" : "numeric"
|
|
5257
|
+
};
|
|
5258
|
+
const showInfoIcon = Boolean(info || hasInfo);
|
|
5259
|
+
const labelId = label && name ? `${name}-slider-label` : void 0;
|
|
5260
|
+
const sliderInputId = name ? `${name}-slider-input` : void 0;
|
|
5261
|
+
const sliderControls = /* @__PURE__ */ jsxs("div", { className: `mui-ls-slider-input-style ${hideSlider ? "mui-ls-slider-input-style--input-only" : ""} ${label ? "noMargin" : ""}`, children: [
|
|
5262
|
+
!hideSlider && /* @__PURE__ */ jsxs(
|
|
5263
|
+
"div",
|
|
5264
|
+
{
|
|
5265
|
+
className: [
|
|
5266
|
+
"mui-ls-slider-input-track",
|
|
5267
|
+
inPopout ? "mui-ls-slider-input-track--popout" : "",
|
|
5268
|
+
startIcon ? "mui-ls-slider-input-track--start-icon" : "",
|
|
5269
|
+
endIcon ? "mui-ls-slider-input-track--end-icon" : ""
|
|
5270
|
+
].filter(Boolean).join(" "),
|
|
5271
|
+
children: [
|
|
5272
|
+
startIcon && /* @__PURE__ */ jsx4("span", { className: "ls-slider-input-icon", children: startIcon }),
|
|
5273
|
+
inPopout ? /* @__PURE__ */ jsx4(
|
|
5274
|
+
"input",
|
|
5275
|
+
{
|
|
5276
|
+
className: `ls-custom-range-input ${sliderClassName ?? ""}`.trim(),
|
|
5277
|
+
style: {
|
|
5278
|
+
background: `linear-gradient(to right, var(--white, #fff) ${sliderProgress}%, var(--white50, rgba(255, 255, 255, 0.5)) ${sliderProgress}%)`,
|
|
5279
|
+
padding: 0,
|
|
5280
|
+
maxWidth: "70px",
|
|
5281
|
+
marginRight: 0,
|
|
5282
|
+
...sliderStyle
|
|
5283
|
+
},
|
|
5284
|
+
type: "range",
|
|
5285
|
+
name,
|
|
5286
|
+
value: String(actualValue),
|
|
5287
|
+
min: actualSliderMin,
|
|
5288
|
+
max: actualSliderMax,
|
|
5289
|
+
step,
|
|
5290
|
+
disabled: sliderDisabled,
|
|
5291
|
+
onChange: ({ target: { value: nextSliderValue } }) => {
|
|
5292
|
+
handleSliderChanging({}, Number(nextSliderValue));
|
|
5293
|
+
},
|
|
5294
|
+
onMouseUp: () => handleSliderChanged({}),
|
|
5295
|
+
onTouchEnd: () => handleSliderChanged({})
|
|
5188
5296
|
}
|
|
5189
|
-
|
|
5190
|
-
|
|
5191
|
-
|
|
5192
|
-
|
|
5193
|
-
|
|
5194
|
-
|
|
5297
|
+
) : /* @__PURE__ */ jsx4(
|
|
5298
|
+
LSSlider,
|
|
5299
|
+
{
|
|
5300
|
+
...sliderRestProps,
|
|
5301
|
+
name,
|
|
5302
|
+
color: sliderColor,
|
|
5303
|
+
value: actualValue,
|
|
5304
|
+
step,
|
|
5305
|
+
min: actualSliderMin,
|
|
5306
|
+
max: actualSliderMax,
|
|
5307
|
+
valueLabelDisplay,
|
|
5308
|
+
valueLabelFormat: (sliderValue) => valueLabelFormat?.(sliderValue) ?? `${sliderValue}${endAdornment ?? inputAfterText ?? ""}`,
|
|
5309
|
+
onChange: handleSliderChanging,
|
|
5310
|
+
onChangeCommitted: handleSliderChanged,
|
|
5311
|
+
sx: resolvedSliderSx
|
|
5312
|
+
}
|
|
5313
|
+
),
|
|
5314
|
+
endIcon && /* @__PURE__ */ jsx4("span", { className: "ls-slider-input-icon", children: endIcon })
|
|
5315
|
+
]
|
|
5316
|
+
}
|
|
5317
|
+
),
|
|
5318
|
+
!hideInput && /* @__PURE__ */ jsx4(
|
|
5319
|
+
LSInput,
|
|
5320
|
+
{
|
|
5321
|
+
...rest,
|
|
5322
|
+
...inputProps,
|
|
5323
|
+
type,
|
|
5324
|
+
name,
|
|
5325
|
+
color,
|
|
5326
|
+
size: "small",
|
|
5327
|
+
onChange: handleInputChange,
|
|
5328
|
+
className: hideSlider ? inputProps?.className : inputValueClassName,
|
|
5329
|
+
value: displayValue,
|
|
5330
|
+
error: resolvedError,
|
|
5331
|
+
helperText: resolvedHelperText,
|
|
5332
|
+
fullWidth: hideSlider ? fullWidth : false,
|
|
5333
|
+
inputRef: ref,
|
|
5334
|
+
slotProps: {
|
|
5335
|
+
...inputProps?.slotProps ?? {},
|
|
5336
|
+
htmlInput: htmlInputProps
|
|
5195
5337
|
}
|
|
5196
|
-
|
|
5197
|
-
|
|
5198
|
-
|
|
5199
|
-
|
|
5200
|
-
|
|
5201
|
-
|
|
5202
|
-
|
|
5203
|
-
|
|
5204
|
-
|
|
5205
|
-
|
|
5206
|
-
|
|
5207
|
-
|
|
5338
|
+
}
|
|
5339
|
+
),
|
|
5340
|
+
!hideInput && (endAdornment ?? inputAfterText) && /* @__PURE__ */ jsx4("div", { className: "mui-ls-slider-input-adornment", children: endAdornment ?? inputAfterText })
|
|
5341
|
+
] });
|
|
5342
|
+
return /* @__PURE__ */ jsxs(FormControl2, { variant: "outlined", className: "mui-ls-slider-input-root", fullWidth: true, error: Boolean(rangeError), children: [
|
|
5343
|
+
label && /* @__PURE__ */ jsxs(InputLabel, { shrink: true, id: labelId, htmlFor: sliderInputId, children: [
|
|
5344
|
+
label,
|
|
5345
|
+
showInfoIcon && /* @__PURE__ */ jsx4(Tooltip, { title: info ?? "", placement: "top", onOpen: infoOpen, onClose: infoClose, children: /* @__PURE__ */ jsx4("span", { className: "mui-ls-slider-input-info", "aria-label": typeof info === "string" ? info : void 0, children: /* @__PURE__ */ jsx4(InfoIcon, {}) }) })
|
|
5346
|
+
] }),
|
|
5347
|
+
/* @__PURE__ */ jsx4(
|
|
5348
|
+
OutlinedInput,
|
|
5349
|
+
{
|
|
5350
|
+
id: sliderInputId,
|
|
5351
|
+
label,
|
|
5352
|
+
notched: Boolean(label),
|
|
5353
|
+
className: "mui-ls-slider-input-control",
|
|
5354
|
+
inputComponent: SliderInputContent,
|
|
5355
|
+
inputProps: { children: sliderControls }
|
|
5356
|
+
}
|
|
5357
|
+
),
|
|
5358
|
+
(helperText || rangeError) && /* @__PURE__ */ jsx4(FormHelperText, { className: "mui-ls-slider-input-helper", children: rangeError ?? helperText })
|
|
5359
|
+
] });
|
|
5360
|
+
}
|
|
5361
|
+
);
|
|
5208
5362
|
LSSliderInput.displayName = "LSSliderInput";
|
|
5209
5363
|
|
|
5210
5364
|
// src/components/LSSwitch/LSSwitch.tsx
|
|
5211
5365
|
import MatSwitch from "@mui/material/Switch";
|
|
5212
|
-
import { forwardRef as
|
|
5213
|
-
import { jsx as
|
|
5214
|
-
var LSSwitch =
|
|
5366
|
+
import { forwardRef as forwardRef3 } from "react";
|
|
5367
|
+
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
5368
|
+
var LSSwitch = forwardRef3(({ slotProps, ...rest }, ref) => /* @__PURE__ */ jsx5(
|
|
5215
5369
|
MatSwitch,
|
|
5216
5370
|
{
|
|
5217
5371
|
sx: {
|
|
@@ -5232,20 +5386,20 @@ var LSSwitch = forwardRef2(({ slotProps, ...rest }, ref) => /* @__PURE__ */ jsx4
|
|
|
5232
5386
|
LSSwitch.displayName = "LSSwitch";
|
|
5233
5387
|
|
|
5234
5388
|
// src/components/LSSelect/LSSelect.tsx
|
|
5235
|
-
import
|
|
5236
|
-
import
|
|
5389
|
+
import FormControl3 from "@mui/material/FormControl";
|
|
5390
|
+
import InputLabel2 from "@mui/material/InputLabel";
|
|
5237
5391
|
import Select from "@mui/material/Select";
|
|
5238
|
-
import
|
|
5239
|
-
import { forwardRef as
|
|
5240
|
-
import { jsx as
|
|
5241
|
-
var
|
|
5392
|
+
import Tooltip2 from "@mui/material/Tooltip";
|
|
5393
|
+
import { forwardRef as forwardRef4 } from "react";
|
|
5394
|
+
import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
5395
|
+
var InfoIcon2 = () => /* @__PURE__ */ jsx6("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx6(
|
|
5242
5396
|
"path",
|
|
5243
5397
|
{
|
|
5244
5398
|
d: "M7 0C3.1402 0 0 3.1402 0 7C0 10.8598 3.1402 14 7 14C10.8598 14 14 10.8598 14 7C14 3.1402 10.8598 0 7 0ZM7.7 11.2H6.3V9.8H7.7V11.2ZM8.3832 7.7805C8.246 7.8911 8.1137 7.9968 8.0087 8.1018C7.7231 8.3867 7.7007 8.6457 7.7 8.6569V8.75H6.3V8.6331C6.3 8.5505 6.3203 7.8092 7.0182 7.1113C7.1547 6.9748 7.3241 6.8362 7.5019 6.692C8.0157 6.2755 8.3531 5.9717 8.3531 5.5531C8.34497 5.19947 8.19875 4.86308 7.94574 4.61588C7.69273 4.36869 7.35303 4.23034 6.99931 4.23043C6.64559 4.23052 6.30595 4.36905 6.05307 4.61637C5.80019 4.8637 5.65415 5.20017 5.6462 5.5538H4.2462C4.2462 4.0355 5.4817 2.8 7 2.8C8.5183 2.8 9.7538 4.0355 9.7538 5.5538C9.7538 6.6717 8.9285 7.3388 8.3832 7.7805Z",
|
|
5245
5399
|
fill: "#CAC9D5"
|
|
5246
5400
|
}
|
|
5247
5401
|
) });
|
|
5248
|
-
var LSSelect =
|
|
5402
|
+
var LSSelect = forwardRef4(({ className = "", style, ...props }, ref) => {
|
|
5249
5403
|
const {
|
|
5250
5404
|
placeholder,
|
|
5251
5405
|
info,
|
|
@@ -5263,7 +5417,7 @@ var LSSelect = forwardRef3(({ className = "", style, ...props }, ref) => {
|
|
|
5263
5417
|
const value = rest.multiple === true ? Array.isArray(rest.value) ? rest.value : rest.value === void 0 || rest.value === null || rest.value === "" ? [] : [rest.value] : rest.value ?? "";
|
|
5264
5418
|
const renderValue = renderValueProp ?? (placeholderText ? (selected) => {
|
|
5265
5419
|
if (selected === "" || Array.isArray(selected) && selected.length === 0) {
|
|
5266
|
-
return /* @__PURE__ */
|
|
5420
|
+
return /* @__PURE__ */ jsx6("span", { style: { color: "var(--neutralLight3, var(--grey, #9392a1))" }, children: placeholderText });
|
|
5267
5421
|
}
|
|
5268
5422
|
return Array.isArray(selected) ? selected.join(", ") : selected;
|
|
5269
5423
|
} : void 0);
|
|
@@ -5290,6 +5444,16 @@ var LSSelect = forwardRef3(({ className = "", style, ...props }, ref) => {
|
|
|
5290
5444
|
"& .MuiMenuItem-root": {
|
|
5291
5445
|
color: "var(--neutralLight1, var(--white, #fff))"
|
|
5292
5446
|
},
|
|
5447
|
+
"& .MuiMenuItem-root:hover, & .MuiMenuItem-root.Mui-focusVisible": {
|
|
5448
|
+
backgroundColor: "color-mix(in srgb, var(--primary, #ff4076) 14%, transparent) !important"
|
|
5449
|
+
},
|
|
5450
|
+
"& .MuiMenuItem-root.Mui-selected": {
|
|
5451
|
+
backgroundColor: "color-mix(in srgb, var(--primary, #ff4076) 24%, transparent) !important",
|
|
5452
|
+
color: "var(--neutralLight1, var(--white, #fff)) !important"
|
|
5453
|
+
},
|
|
5454
|
+
"& .MuiMenuItem-root.Mui-selected:hover, & .MuiMenuItem-root.Mui-selected.Mui-focusVisible": {
|
|
5455
|
+
backgroundColor: "color-mix(in srgb, var(--primary, #ff4076) 30%, transparent) !important"
|
|
5456
|
+
},
|
|
5293
5457
|
...MenuProps?.slotProps?.paper?.sx
|
|
5294
5458
|
}
|
|
5295
5459
|
},
|
|
@@ -5304,24 +5468,18 @@ var LSSelect = forwardRef3(({ className = "", style, ...props }, ref) => {
|
|
|
5304
5468
|
}
|
|
5305
5469
|
};
|
|
5306
5470
|
return /* @__PURE__ */ jsxs2(
|
|
5307
|
-
|
|
5471
|
+
FormControl3,
|
|
5308
5472
|
{
|
|
5309
5473
|
variant: "outlined",
|
|
5310
5474
|
className: `${className} mui-ls-select-form-control`,
|
|
5311
|
-
sx: {
|
|
5312
|
-
marginBottom: ".3rem",
|
|
5313
|
-
marginTop: ".5rem",
|
|
5314
|
-
minWidth: "100px",
|
|
5315
|
-
width: "100%"
|
|
5316
|
-
},
|
|
5317
5475
|
size: rest.size,
|
|
5318
5476
|
style,
|
|
5319
5477
|
children: [
|
|
5320
|
-
props.label && /* @__PURE__ */ jsxs2(
|
|
5478
|
+
props.label && /* @__PURE__ */ jsxs2(InputLabel2, { shrink: true, id: labelId, children: [
|
|
5321
5479
|
props.label,
|
|
5322
|
-
info && /* @__PURE__ */
|
|
5480
|
+
info && /* @__PURE__ */ jsx6(Tooltip2, { title: info, placement: "right", children: /* @__PURE__ */ jsx6("span", { style: { display: "inline-flex", alignItems: "center", cursor: "pointer" }, children: /* @__PURE__ */ jsx6(InfoIcon2, {}) }) })
|
|
5323
5481
|
] }),
|
|
5324
|
-
/* @__PURE__ */
|
|
5482
|
+
/* @__PURE__ */ jsx6(
|
|
5325
5483
|
Select,
|
|
5326
5484
|
{
|
|
5327
5485
|
MenuProps: mergedMenuProps,
|
|
@@ -5350,18 +5508,18 @@ import { default as default3 } from "@mui/material/ListSubheader";
|
|
|
5350
5508
|
// src/components/LSCheckbox/LSCheckbox.tsx
|
|
5351
5509
|
import Checkbox from "@mui/material/Checkbox";
|
|
5352
5510
|
import FormControlLabel from "@mui/material/FormControlLabel";
|
|
5353
|
-
import { forwardRef as
|
|
5511
|
+
import { forwardRef as forwardRef5 } from "react";
|
|
5354
5512
|
import { useController, useFormContext } from "react-hook-form";
|
|
5355
|
-
import
|
|
5356
|
-
import { Fragment, jsx as
|
|
5357
|
-
var LSCheckbox =
|
|
5513
|
+
import classNames3 from "classnames";
|
|
5514
|
+
import { Fragment, jsx as jsx7 } from "react/jsx-runtime";
|
|
5515
|
+
var LSCheckbox = forwardRef5(({ className = "", checked, inputRef, slotProps, ...props }, ref) => {
|
|
5358
5516
|
const CheckboxComponent = Checkbox;
|
|
5359
|
-
return /* @__PURE__ */
|
|
5517
|
+
return /* @__PURE__ */ jsx7(
|
|
5360
5518
|
CheckboxComponent,
|
|
5361
5519
|
{
|
|
5362
5520
|
...props,
|
|
5363
5521
|
checked: checked ?? false,
|
|
5364
|
-
className:
|
|
5522
|
+
className: classNames3("ls-checkbox", className, { "Mui-disabled": props.disabled }),
|
|
5365
5523
|
ref,
|
|
5366
5524
|
slotProps: {
|
|
5367
5525
|
...slotProps ?? {},
|
|
@@ -5378,11 +5536,11 @@ LSCheckbox.displayName = "LSCheckbox";
|
|
|
5378
5536
|
// src/components/LSColorPicker/LSColorPicker.tsx
|
|
5379
5537
|
import { useEffect as useEffect2, useRef, useState as useState2 } from "react";
|
|
5380
5538
|
import GradientColorPicker from "react-best-gradient-color-picker";
|
|
5381
|
-
import { jsx as
|
|
5539
|
+
import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
5382
5540
|
|
|
5383
5541
|
// src/components/LSDatePicker/LSDatePicker.tsx
|
|
5384
|
-
import { forwardRef as
|
|
5385
|
-
import { jsx as
|
|
5542
|
+
import { forwardRef as forwardRef6 } from "react";
|
|
5543
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
5386
5544
|
var toDateTimeLocalValue = (value) => {
|
|
5387
5545
|
if (!value) return "";
|
|
5388
5546
|
const date = new Date(value);
|
|
@@ -5394,7 +5552,7 @@ var fromDateTimeLocalValue = (value) => {
|
|
|
5394
5552
|
if (!value) return "";
|
|
5395
5553
|
return new Date(value).toISOString();
|
|
5396
5554
|
};
|
|
5397
|
-
var LSDatePicker =
|
|
5555
|
+
var LSDatePicker = forwardRef6(
|
|
5398
5556
|
({ value, onChange, onChangeStart, onChangeEnd, className, ...rest }, ref) => {
|
|
5399
5557
|
const handleChange = (event) => {
|
|
5400
5558
|
const nextValue = fromDateTimeLocalValue(event.target.value);
|
|
@@ -5402,7 +5560,7 @@ var LSDatePicker = forwardRef5(
|
|
|
5402
5560
|
onChange?.(event, nextValue);
|
|
5403
5561
|
onChangeEnd?.(event, nextValue);
|
|
5404
5562
|
};
|
|
5405
|
-
return /* @__PURE__ */
|
|
5563
|
+
return /* @__PURE__ */ jsx9(
|
|
5406
5564
|
LSInput,
|
|
5407
5565
|
{
|
|
5408
5566
|
...rest,
|
|
@@ -5422,7 +5580,7 @@ import { KeyboardArrowDown } from "@mui/icons-material";
|
|
|
5422
5580
|
import Autocomplete from "@mui/material/Autocomplete";
|
|
5423
5581
|
import TextField2 from "@mui/material/TextField";
|
|
5424
5582
|
import { memo, startTransition, useEffect as useEffect3, useMemo as useMemo2, useRef as useRef2, useState as useState3 } from "react";
|
|
5425
|
-
import { jsx as
|
|
5583
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
5426
5584
|
var LSFontPicker = memo(function LSFontPicker2({
|
|
5427
5585
|
value,
|
|
5428
5586
|
onChange,
|
|
@@ -5466,7 +5624,7 @@ var LSFontPicker = memo(function LSFontPicker2({
|
|
|
5466
5624
|
onLoadFontsRef.current?.([nextValue]);
|
|
5467
5625
|
});
|
|
5468
5626
|
};
|
|
5469
|
-
return /* @__PURE__ */
|
|
5627
|
+
return /* @__PURE__ */ jsx10("div", { className: "ls-font-picker", children: /* @__PURE__ */ jsx10(
|
|
5470
5628
|
AutocompleteComponent,
|
|
5471
5629
|
{
|
|
5472
5630
|
freeSolo: true,
|
|
@@ -5476,7 +5634,7 @@ var LSFontPicker = memo(function LSFontPicker2({
|
|
|
5476
5634
|
options: combinedFonts,
|
|
5477
5635
|
value: currentValue,
|
|
5478
5636
|
inputValue,
|
|
5479
|
-
popupIcon: /* @__PURE__ */
|
|
5637
|
+
popupIcon: /* @__PURE__ */ jsx10(KeyboardArrowDown, {}),
|
|
5480
5638
|
isOptionEqualToValue: (option, selectedValue) => option === selectedValue,
|
|
5481
5639
|
onChange: (_event, newValue) => {
|
|
5482
5640
|
handleValueChange(typeof newValue === "string" ? newValue : `${newValue ?? ""}`);
|
|
@@ -5518,7 +5676,7 @@ var LSFontPicker = memo(function LSFontPicker2({
|
|
|
5518
5676
|
noOptionsText: "No fonts found",
|
|
5519
5677
|
renderOption: (props, option) => {
|
|
5520
5678
|
const { key, ...optionProps } = props;
|
|
5521
|
-
return /* @__PURE__ */
|
|
5679
|
+
return /* @__PURE__ */ jsx10(
|
|
5522
5680
|
"li",
|
|
5523
5681
|
{
|
|
5524
5682
|
...optionProps,
|
|
@@ -5537,7 +5695,7 @@ var LSFontPicker = memo(function LSFontPicker2({
|
|
|
5537
5695
|
},
|
|
5538
5696
|
renderInput: (params) => {
|
|
5539
5697
|
const { slotProps: paramsSlotProps = {}, ...restParams } = params;
|
|
5540
|
-
return /* @__PURE__ */
|
|
5698
|
+
return /* @__PURE__ */ jsx10(
|
|
5541
5699
|
TextFieldComponent,
|
|
5542
5700
|
{
|
|
5543
5701
|
...restParams,
|
|
@@ -5574,25 +5732,25 @@ var LSFontPicker = memo(function LSFontPicker2({
|
|
|
5574
5732
|
|
|
5575
5733
|
// src/components/LSMultiSelect/LSMultiSelect.tsx
|
|
5576
5734
|
import { MenuItem } from "@mui/material";
|
|
5577
|
-
import { jsx as
|
|
5735
|
+
import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
5578
5736
|
|
|
5579
5737
|
// src/components/LSRadio/LSRadio.tsx
|
|
5580
5738
|
import FormControlLabel2 from "@mui/material/FormControlLabel";
|
|
5581
5739
|
import Radio from "@mui/material/Radio";
|
|
5582
5740
|
import RadioGroup from "@mui/material/RadioGroup";
|
|
5583
|
-
import
|
|
5584
|
-
import { jsx as
|
|
5741
|
+
import classNames4 from "classnames";
|
|
5742
|
+
import { jsx as jsx12 } from "react/jsx-runtime";
|
|
5585
5743
|
var LSRadio = ({ className = "", ...props }) => {
|
|
5586
|
-
return /* @__PURE__ */
|
|
5744
|
+
return /* @__PURE__ */ jsx12(Radio, { ...props, className: classNames4("ls-radio", className) });
|
|
5587
5745
|
};
|
|
5588
5746
|
var LSRadioGroup = ({ selections, className = "", optionClassName = "", row, ...props }) => {
|
|
5589
|
-
return /* @__PURE__ */
|
|
5747
|
+
return /* @__PURE__ */ jsx12(RadioGroup, { ...props, row, className: classNames4("ls-radio-group", className, { row }), children: selections.map((selection) => /* @__PURE__ */ jsx12(
|
|
5590
5748
|
FormControlLabel2,
|
|
5591
5749
|
{
|
|
5592
|
-
className:
|
|
5750
|
+
className: classNames4("ls-radio-row", optionClassName),
|
|
5593
5751
|
value: selection.value,
|
|
5594
5752
|
disabled: selection.disabled,
|
|
5595
|
-
control: /* @__PURE__ */
|
|
5753
|
+
control: /* @__PURE__ */ jsx12(LSRadio, {}),
|
|
5596
5754
|
label: selection.label
|
|
5597
5755
|
},
|
|
5598
5756
|
selection.value
|
|
@@ -5602,13 +5760,13 @@ LSRadioGroup.displayName = "LSRadioGroup";
|
|
|
5602
5760
|
|
|
5603
5761
|
// src/components/LSTextField/LSTextField.tsx
|
|
5604
5762
|
import TextField3 from "@mui/material/TextField";
|
|
5605
|
-
import { forwardRef as
|
|
5606
|
-
import { jsx as
|
|
5607
|
-
var LSTextField =
|
|
5763
|
+
import { forwardRef as forwardRef7 } from "react";
|
|
5764
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
5765
|
+
var LSTextField = forwardRef7(
|
|
5608
5766
|
(props, ref) => {
|
|
5609
5767
|
const { slotProps, ...rest } = props;
|
|
5610
5768
|
const paramsInputLabel = slotProps?.inputLabel ?? {};
|
|
5611
|
-
return /* @__PURE__ */
|
|
5769
|
+
return /* @__PURE__ */ jsx13(
|
|
5612
5770
|
TextField3,
|
|
5613
5771
|
{
|
|
5614
5772
|
...rest,
|
|
@@ -5636,11 +5794,11 @@ import InputAdornment2 from "@mui/material/InputAdornment";
|
|
|
5636
5794
|
import Popover from "@mui/material/Popover";
|
|
5637
5795
|
import Search from "@mui/icons-material/Search";
|
|
5638
5796
|
import KeyboardArrowDown2 from "@mui/icons-material/KeyboardArrowDown";
|
|
5639
|
-
import
|
|
5797
|
+
import Tooltip3 from "@mui/material/Tooltip";
|
|
5640
5798
|
import {
|
|
5641
5799
|
Fragment as Fragment4,
|
|
5642
5800
|
createContext,
|
|
5643
|
-
forwardRef as
|
|
5801
|
+
forwardRef as forwardRef8,
|
|
5644
5802
|
useCallback as useCallback2,
|
|
5645
5803
|
useContext,
|
|
5646
5804
|
useEffect as useEffect5,
|
|
@@ -5659,7 +5817,7 @@ import {
|
|
|
5659
5817
|
useState as useState4
|
|
5660
5818
|
} from "react";
|
|
5661
5819
|
import { createPortal } from "react-dom";
|
|
5662
|
-
import { Fragment as Fragment3, jsx as
|
|
5820
|
+
import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
5663
5821
|
var TOKEN_START = "{{";
|
|
5664
5822
|
var TOKEN_END = "}}";
|
|
5665
5823
|
var COPIED_STYLE_PROPS = [
|
|
@@ -5743,7 +5901,7 @@ var parseSegments = (value, classify, describe) => {
|
|
|
5743
5901
|
}
|
|
5744
5902
|
return segments;
|
|
5745
5903
|
};
|
|
5746
|
-
var renderSegment = (segment, key) => segment.token ? /* @__PURE__ */
|
|
5904
|
+
var renderSegment = (segment, key) => segment.token ? /* @__PURE__ */ jsx14(
|
|
5747
5905
|
"span",
|
|
5748
5906
|
{
|
|
5749
5907
|
"data-desc": segment.desc || void 0,
|
|
@@ -5757,7 +5915,7 @@ var renderSegment = (segment, key) => segment.token ? /* @__PURE__ */ jsx13(
|
|
|
5757
5915
|
] }) : segment.text
|
|
5758
5916
|
},
|
|
5759
5917
|
key
|
|
5760
|
-
) : /* @__PURE__ */
|
|
5918
|
+
) : /* @__PURE__ */ jsx14(Fragment2, { children: segment.text }, key);
|
|
5761
5919
|
var VariableHighlightOverlay = ({
|
|
5762
5920
|
inputEl,
|
|
5763
5921
|
value,
|
|
@@ -5881,11 +6039,11 @@ var VariableHighlightOverlay = ({
|
|
|
5881
6039
|
}
|
|
5882
6040
|
return /* @__PURE__ */ jsxs5(Fragment3, { children: [
|
|
5883
6041
|
createPortal(
|
|
5884
|
-
/* @__PURE__ */
|
|
6042
|
+
/* @__PURE__ */ jsx14("div", { ref: layerRef, "aria-hidden": true, className: "ls-variable-highlight__layer", children: segments.map((segment, index) => renderSegment(segment, String(index))) }),
|
|
5885
6043
|
inputEl.parentElement
|
|
5886
6044
|
),
|
|
5887
6045
|
tooltip ? createPortal(
|
|
5888
|
-
/* @__PURE__ */
|
|
6046
|
+
/* @__PURE__ */ jsx14(
|
|
5889
6047
|
"div",
|
|
5890
6048
|
{
|
|
5891
6049
|
className: "ls-variable-highlight__tooltip",
|
|
@@ -5899,7 +6057,7 @@ var VariableHighlightOverlay = ({
|
|
|
5899
6057
|
};
|
|
5900
6058
|
|
|
5901
6059
|
// src/components/LSVariableInputField/LSVariableInputField.tsx
|
|
5902
|
-
import { Fragment as Fragment5, jsx as
|
|
6060
|
+
import { Fragment as Fragment5, jsx as jsx15, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
5903
6061
|
import { createElement } from "react";
|
|
5904
6062
|
var LSVariableInputContext = createContext({});
|
|
5905
6063
|
var DEFAULT_FUNCTION_VARIABLES = [
|
|
@@ -6119,7 +6277,7 @@ var getVariableColorClass = (variableType, isSuggested) => {
|
|
|
6119
6277
|
return "ls-variable-token--custom";
|
|
6120
6278
|
};
|
|
6121
6279
|
var CHILD_VARIABLE_COLOR_CLASS = "ls-variable-token--child";
|
|
6122
|
-
var LSVariableInputField =
|
|
6280
|
+
var LSVariableInputField = forwardRef8((props, ref) => {
|
|
6123
6281
|
const context = useContext(LSVariableInputContext);
|
|
6124
6282
|
const {
|
|
6125
6283
|
name,
|
|
@@ -6651,8 +6809,8 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6651
6809
|
{
|
|
6652
6810
|
className: `ls-variable-token ${getVariableColorClass(variableType, isSuggested)}`,
|
|
6653
6811
|
children: [
|
|
6654
|
-
/* @__PURE__ */
|
|
6655
|
-
variableType === "func" && /* @__PURE__ */
|
|
6812
|
+
/* @__PURE__ */ jsx15("span", { className: "ls-variable-token__name", children: `{{${variableName}}}` }),
|
|
6813
|
+
variableType === "func" && /* @__PURE__ */ jsx15(
|
|
6656
6814
|
"span",
|
|
6657
6815
|
{
|
|
6658
6816
|
className: "ls-variable-token__badge",
|
|
@@ -6663,7 +6821,7 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6663
6821
|
]
|
|
6664
6822
|
}
|
|
6665
6823
|
);
|
|
6666
|
-
const renderExpandToggle = (path, expanded) => /* @__PURE__ */
|
|
6824
|
+
const renderExpandToggle = (path, expanded) => /* @__PURE__ */ jsx15(
|
|
6667
6825
|
"button",
|
|
6668
6826
|
{
|
|
6669
6827
|
type: "button",
|
|
@@ -6674,15 +6832,15 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6674
6832
|
className: `ls-variable-picker__expand-toggle${expanded ? " ls-variable-picker__expand-toggle--expanded" : ""}`,
|
|
6675
6833
|
"aria-label": expanded ? "Collapse" : "Expand",
|
|
6676
6834
|
"aria-expanded": expanded,
|
|
6677
|
-
children: /* @__PURE__ */
|
|
6835
|
+
children: /* @__PURE__ */ jsx15(KeyboardArrowDown2, { style: { width: 16, height: 16 } })
|
|
6678
6836
|
}
|
|
6679
6837
|
);
|
|
6680
|
-
const renderExpandSpacer = () => /* @__PURE__ */
|
|
6838
|
+
const renderExpandSpacer = () => /* @__PURE__ */ jsx15("span", { className: "ls-variable-picker__expand-spacer", "aria-hidden": true });
|
|
6681
6839
|
const getVariableValuePreview = (variableValue) => {
|
|
6682
6840
|
const { displayValue, fullValue } = getVariableValueDisplay(variableValue);
|
|
6683
6841
|
return { displayValue, fullValue };
|
|
6684
6842
|
};
|
|
6685
|
-
const renderVariableValueInput = (displayValue, fullValue) => /* @__PURE__ */
|
|
6843
|
+
const renderVariableValueInput = (displayValue, fullValue) => /* @__PURE__ */ jsx15(
|
|
6686
6844
|
"input",
|
|
6687
6845
|
{
|
|
6688
6846
|
className: "ls-variable-picker__value-input",
|
|
@@ -6716,18 +6874,18 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6716
6874
|
style: { paddingLeft: `${node.depth * 1.25}rem` },
|
|
6717
6875
|
children: [
|
|
6718
6876
|
node.isExpandable ? renderExpandToggle(fullToken, expanded) : renderExpandSpacer(),
|
|
6719
|
-
/* @__PURE__ */
|
|
6877
|
+
/* @__PURE__ */ jsx15(
|
|
6720
6878
|
"div",
|
|
6721
6879
|
{
|
|
6722
6880
|
className: `ls-variable-token ${CHILD_VARIABLE_COLOR_CLASS}`,
|
|
6723
|
-
children: /* @__PURE__ */
|
|
6881
|
+
children: /* @__PURE__ */ jsx15("span", { className: "ls-variable-token__name", children: `{{${fullToken}}}` })
|
|
6724
6882
|
}
|
|
6725
6883
|
)
|
|
6726
6884
|
]
|
|
6727
6885
|
}
|
|
6728
6886
|
),
|
|
6729
|
-
/* @__PURE__ */
|
|
6730
|
-
/* @__PURE__ */
|
|
6887
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__description", children: node.displayKey }),
|
|
6888
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__value", title: fullValue, children: renderVariableValueInput(displayValue, fullValue) })
|
|
6731
6889
|
]
|
|
6732
6890
|
}
|
|
6733
6891
|
),
|
|
@@ -6735,7 +6893,7 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6735
6893
|
] }, fullToken);
|
|
6736
6894
|
});
|
|
6737
6895
|
const renderExampleChildRows = (variable, examples) => /* @__PURE__ */ jsxs6(Fragment5, { children: [
|
|
6738
|
-
/* @__PURE__ */
|
|
6896
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__row ls-variable-picker__row--child ls-variable-picker__example-description", children: getSystemVariableDescription(variable) }),
|
|
6739
6897
|
examples.map((example) => /* @__PURE__ */ jsxs6(
|
|
6740
6898
|
"div",
|
|
6741
6899
|
{
|
|
@@ -6749,12 +6907,12 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6749
6907
|
style: { paddingLeft: "1.25rem" },
|
|
6750
6908
|
children: [
|
|
6751
6909
|
renderExpandSpacer(),
|
|
6752
|
-
/* @__PURE__ */
|
|
6910
|
+
/* @__PURE__ */ jsx15("div", { className: `ls-variable-token ${CHILD_VARIABLE_COLOR_CLASS}`, children: /* @__PURE__ */ jsx15("span", { className: "ls-variable-token__name", children: `{{${example.snippet}}}` }) })
|
|
6753
6911
|
]
|
|
6754
6912
|
}
|
|
6755
6913
|
),
|
|
6756
|
-
/* @__PURE__ */
|
|
6757
|
-
/* @__PURE__ */
|
|
6914
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__description", children: example.label }),
|
|
6915
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__value" })
|
|
6758
6916
|
]
|
|
6759
6917
|
},
|
|
6760
6918
|
example.snippet
|
|
@@ -6811,7 +6969,7 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6811
6969
|
isSelected ? "ls-variable-option--selected" : ""
|
|
6812
6970
|
].filter(Boolean).join(" ")
|
|
6813
6971
|
},
|
|
6814
|
-
thumb ? /* @__PURE__ */
|
|
6972
|
+
thumb ? /* @__PURE__ */ jsx15(
|
|
6815
6973
|
"img",
|
|
6816
6974
|
{
|
|
6817
6975
|
src: thumb,
|
|
@@ -6820,23 +6978,23 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6820
6978
|
}
|
|
6821
6979
|
) : null,
|
|
6822
6980
|
/* @__PURE__ */ jsxs6("div", { className: "ls-variable-option__body", children: [
|
|
6823
|
-
/* @__PURE__ */
|
|
6824
|
-
helperText ? /* @__PURE__ */
|
|
6981
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-option__label", children: resolveOptionLabel(opt) }),
|
|
6982
|
+
helperText ? /* @__PURE__ */ jsx15("div", { className: "ls-variable-option__helper", children: helperText }) : null
|
|
6825
6983
|
] })
|
|
6826
6984
|
);
|
|
6827
6985
|
};
|
|
6828
6986
|
const showSuggestedSection = shouldRenderPicker && allowedVariableNames.length > 0 && filteredAllowedVariables.length > 0;
|
|
6829
6987
|
const pickerBody = shouldRenderPicker ? /* @__PURE__ */ jsxs6("div", { className: "ls-variable-picker ls-variable-picker--three-col", children: [
|
|
6830
6988
|
/* @__PURE__ */ jsxs6("div", { className: "ls-variable-picker__intro", children: [
|
|
6831
|
-
/* @__PURE__ */
|
|
6989
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__intro-text", children: t(
|
|
6832
6990
|
"overlay-variables.variables-description",
|
|
6833
6991
|
"Use variables that will automatically be replaced before sending out the text"
|
|
6834
6992
|
) }),
|
|
6835
|
-
/* @__PURE__ */
|
|
6993
|
+
/* @__PURE__ */ jsx15(
|
|
6836
6994
|
LSInput,
|
|
6837
6995
|
{
|
|
6838
6996
|
autoFocus: true,
|
|
6839
|
-
startAdornment: /* @__PURE__ */
|
|
6997
|
+
startAdornment: /* @__PURE__ */ jsx15(Search, { style: { color: "#fff", width: 20, height: 20 } }),
|
|
6840
6998
|
placeholder: t("common.search", "Search"),
|
|
6841
6999
|
value: searchQuery,
|
|
6842
7000
|
onChange: (e) => setSearchQuery(e.target.value),
|
|
@@ -6845,13 +7003,13 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6845
7003
|
)
|
|
6846
7004
|
] }),
|
|
6847
7005
|
/* @__PURE__ */ jsxs6("div", { className: "ls-variable-picker__header", children: [
|
|
6848
|
-
/* @__PURE__ */
|
|
6849
|
-
/* @__PURE__ */
|
|
6850
|
-
/* @__PURE__ */
|
|
7006
|
+
/* @__PURE__ */ jsx15("div", { style: { paddingLeft: "2.2rem" }, children: t("commands.variable", "Variable") }),
|
|
7007
|
+
/* @__PURE__ */ jsx15("div", { children: t("commands.description", "Description") }),
|
|
7008
|
+
/* @__PURE__ */ jsx15("div", { children: t("common.value", "Value") })
|
|
6851
7009
|
] }),
|
|
6852
7010
|
/* @__PURE__ */ jsxs6("div", { className: "ls-variable-picker__list", children: [
|
|
6853
7011
|
showSuggestedSection && /* @__PURE__ */ jsxs6("fieldset", { className: "ls-variable-picker__field", children: [
|
|
6854
|
-
/* @__PURE__ */
|
|
7012
|
+
/* @__PURE__ */ jsx15("legend", { className: "ls-variable-picker__legend", children: t("commands.suggested-variables", "Suggested Variables") }),
|
|
6855
7013
|
filteredAllowedVariables.map((definition, idx) => {
|
|
6856
7014
|
const variableType = getAllowedVariableVisualType(
|
|
6857
7015
|
definition.name
|
|
@@ -6879,8 +7037,8 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6879
7037
|
expandable ? renderExpandToggle(definition.name, expanded) : renderExpandSpacer(),
|
|
6880
7038
|
renderVariableToken(definition.name, variableType, true)
|
|
6881
7039
|
] }),
|
|
6882
|
-
/* @__PURE__ */
|
|
6883
|
-
/* @__PURE__ */
|
|
7040
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__description", children: getAllowedVariableDescription(definition.name) }),
|
|
7041
|
+
/* @__PURE__ */ jsx15(
|
|
6884
7042
|
"div",
|
|
6885
7043
|
{
|
|
6886
7044
|
className: "ls-variable-picker__value",
|
|
@@ -6919,8 +7077,8 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6919
7077
|
expandable ? renderExpandToggle(rootToken, expanded) : renderExpandSpacer(),
|
|
6920
7078
|
renderVariableToken(variable.name, variableType)
|
|
6921
7079
|
] }),
|
|
6922
|
-
/* @__PURE__ */
|
|
6923
|
-
/* @__PURE__ */
|
|
7080
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__description", children: getSystemVariableDescription(variable) }),
|
|
7081
|
+
/* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__value", title: fullValue, children: renderVariableValueInput(displayValue, fullValue) })
|
|
6924
7082
|
]
|
|
6925
7083
|
}
|
|
6926
7084
|
),
|
|
@@ -6929,7 +7087,7 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6929
7087
|
})
|
|
6930
7088
|
] })
|
|
6931
7089
|
] }) : null;
|
|
6932
|
-
const textField = (params = {}) => /* @__PURE__ */
|
|
7090
|
+
const textField = (params = {}) => /* @__PURE__ */ jsx15(
|
|
6933
7091
|
VariableInputTextField,
|
|
6934
7092
|
{
|
|
6935
7093
|
t,
|
|
@@ -6957,7 +7115,7 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6957
7115
|
}
|
|
6958
7116
|
);
|
|
6959
7117
|
return /* @__PURE__ */ jsxs6(Fragment5, { children: [
|
|
6960
|
-
/* @__PURE__ */
|
|
7118
|
+
/* @__PURE__ */ jsx15(
|
|
6961
7119
|
Popover,
|
|
6962
7120
|
{
|
|
6963
7121
|
anchorEl: containerRef.current,
|
|
@@ -6983,7 +7141,7 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
6983
7141
|
children: pickerBody
|
|
6984
7142
|
}
|
|
6985
7143
|
),
|
|
6986
|
-
isAutoComplete ? /* @__PURE__ */
|
|
7144
|
+
isAutoComplete ? /* @__PURE__ */ jsx15(
|
|
6987
7145
|
Autocomplete2,
|
|
6988
7146
|
{
|
|
6989
7147
|
disableClearable: true,
|
|
@@ -7080,7 +7238,7 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
7080
7238
|
renderInput: (params) => textField(params)
|
|
7081
7239
|
}
|
|
7082
7240
|
) : textField(),
|
|
7083
|
-
!hideVariables && typeof value === "string" ? /* @__PURE__ */
|
|
7241
|
+
!hideVariables && typeof value === "string" ? /* @__PURE__ */ jsx15(
|
|
7084
7242
|
VariableHighlightOverlay,
|
|
7085
7243
|
{
|
|
7086
7244
|
inputEl,
|
|
@@ -7093,7 +7251,7 @@ var LSVariableInputField = forwardRef7((props, ref) => {
|
|
|
7093
7251
|
] });
|
|
7094
7252
|
});
|
|
7095
7253
|
LSVariableInputField.displayName = "LSVariableInputField";
|
|
7096
|
-
var VariableInputTextField =
|
|
7254
|
+
var VariableInputTextField = forwardRef8(
|
|
7097
7255
|
({
|
|
7098
7256
|
t,
|
|
7099
7257
|
id,
|
|
@@ -7119,10 +7277,10 @@ var VariableInputTextField = forwardRef7(
|
|
|
7119
7277
|
const inputPropsSlotInput = inputProps?.slotProps?.input ?? {};
|
|
7120
7278
|
const paramsSlotInput = params?.slotProps?.input ?? {};
|
|
7121
7279
|
const explicitStartAdornment = inputProps?.startAdornment;
|
|
7122
|
-
const resolvedExplicitStartAdornment = explicitStartAdornment ? /* @__PURE__ */
|
|
7280
|
+
const resolvedExplicitStartAdornment = explicitStartAdornment ? /* @__PURE__ */ jsx15(InputAdornment2, { position: "start", children: explicitStartAdornment }) : void 0;
|
|
7123
7281
|
const startAdornment = paramsSlotInput.startAdornment ?? inputPropsSlotInput.startAdornment ?? resolvedExplicitStartAdornment;
|
|
7124
7282
|
const endAdornment = paramsSlotInput.endAdornment ?? inputPropsSlotInput.endAdornment;
|
|
7125
|
-
return /* @__PURE__ */
|
|
7283
|
+
return /* @__PURE__ */ jsx15(
|
|
7126
7284
|
LSTextField,
|
|
7127
7285
|
{
|
|
7128
7286
|
id,
|
|
@@ -7152,7 +7310,7 @@ var VariableInputTextField = forwardRef7(
|
|
|
7152
7310
|
startAdornment,
|
|
7153
7311
|
endAdornment: /* @__PURE__ */ jsxs6(Fragment5, { children: [
|
|
7154
7312
|
endAdornment ?? null,
|
|
7155
|
-
currentValue ? /* @__PURE__ */
|
|
7313
|
+
currentValue ? /* @__PURE__ */ jsx15(Tooltip3, { title: currentValue.fullValue, children: /* @__PURE__ */ jsx15(
|
|
7156
7314
|
InputAdornment2,
|
|
7157
7315
|
{
|
|
7158
7316
|
position: "end",
|
|
@@ -7168,7 +7326,7 @@ var VariableInputTextField = forwardRef7(
|
|
|
7168
7326
|
children: currentValue.displayValue
|
|
7169
7327
|
}
|
|
7170
7328
|
) }) : null,
|
|
7171
|
-
showVariableIcon ? /* @__PURE__ */
|
|
7329
|
+
showVariableIcon ? /* @__PURE__ */ jsx15(Tooltip3, { title: t("chatbot.allowed-variables", "Allowed Variables"), children: /* @__PURE__ */ jsx15(
|
|
7172
7330
|
InputAdornment2,
|
|
7173
7331
|
{
|
|
7174
7332
|
position: "end",
|
|
@@ -7194,11 +7352,11 @@ import ListItemIcon from "@mui/material/ListItemIcon";
|
|
|
7194
7352
|
import ListItemText from "@mui/material/ListItemText";
|
|
7195
7353
|
import Menu from "@mui/material/Menu";
|
|
7196
7354
|
import MenuItem2 from "@mui/material/MenuItem";
|
|
7197
|
-
import
|
|
7198
|
-
import
|
|
7355
|
+
import Tooltip4 from "@mui/material/Tooltip";
|
|
7356
|
+
import classNames6 from "classnames";
|
|
7199
7357
|
|
|
7200
7358
|
// src/components/PlatformIcon/PlatformIcon.tsx
|
|
7201
|
-
import
|
|
7359
|
+
import classNames5 from "classnames";
|
|
7202
7360
|
|
|
7203
7361
|
// src/assets/platforms/discord.svg
|
|
7204
7362
|
var discord_default = 'data:image/svg+xml,<svg width="106" height="84" viewBox="0 0 106 84" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M87.6564 10.3044C81.1722 7.33742 74.33 5.21982 67.3004 4.00432C67.2367 3.99362 67.1713 4.00292 67.1131 4.03082C67.0549 4.05872 67.0068 4.10392 66.9754 4.16012C66.0941 5.71802 65.1192 7.75572 64.4379 9.35102C56.8605 8.20442 49.153 8.20442 41.5757 9.35102C40.8157 7.57392 39.956 5.84082 39.0007 4.16012C38.9686 4.10452 38.9204 4.05982 38.8624 4.03202C38.8044 4.00422 38.7393 3.99452 38.6757 4.00432C31.6445 5.21322 24.8008 7.33202 18.3196 10.3044C18.2642 10.3255 18.2178 10.3652 18.1884 10.4166C5.22598 29.7281 1.66978 48.5661 3.41358 67.1673C3.41978 67.2545 3.47608 67.3418 3.54478 67.3978C11.093 72.9727 19.5358 77.229 28.5133 79.986C28.5767 80.005 28.6448 80.005 28.7077 79.983C28.7707 79.962 28.8252 79.921 28.8633 79.867C30.7883 77.25 32.5007 74.4893 33.9757 71.5854C34.0065 71.5256 34.017 71.4575 34.0057 71.3913C33.9945 71.325 33.962 71.2641 33.9132 71.2178C33.8809 71.1874 33.8426 71.164 33.8007 71.1492C31.108 70.1174 28.5001 68.8777 26.0008 67.4415C25.931 67.402 25.8791 67.3373 25.8558 67.2607C25.8325 67.1842 25.8397 67.1016 25.8758 67.0302C25.8971 66.9838 25.9292 66.9432 25.9696 66.9118C26.4946 66.5192 27.0196 66.1079 27.5195 65.6966C27.5637 65.6612 27.6167 65.6385 27.6729 65.6308C27.729 65.6231 27.7862 65.6308 27.8383 65.653C44.2069 73.1059 61.9254 73.1059 78.094 65.653C78.148 65.6297 78.2074 65.6214 78.2657 65.6291C78.324 65.6368 78.3792 65.6601 78.4253 65.6966C78.9253 66.1079 79.4503 66.5192 79.9753 66.9118C80.0178 66.9428 80.052 66.9838 80.0747 67.0312C80.0975 67.0786 80.1081 67.1308 80.1056 67.1833C80.1031 67.2358 80.0876 67.2868 80.0605 67.3319C80.0334 67.3769 79.9955 67.4146 79.9503 67.4415C77.4566 68.8909 74.8454 70.1291 72.1441 71.143C72.101 71.1585 72.0619 71.1834 72.0295 71.2157C71.9971 71.248 71.9722 71.287 71.9566 71.3299C71.9421 71.3716 71.9363 71.4157 71.9396 71.4596C71.9428 71.5035 71.955 71.5464 71.9753 71.5854C73.4753 74.4831 75.194 77.25 77.0815 79.867C77.1197 79.921 77.1741 79.962 77.2371 79.983C77.3 80.005 77.3681 80.005 77.4315 79.986C86.424 77.238 94.881 72.9807 102.438 67.3978C102.475 67.3717 102.507 67.3374 102.53 67.2975C102.552 67.2576 102.566 67.2131 102.569 67.1673C104.656 45.6622 99.075 26.98 87.7814 10.4228C87.77 10.3955 87.753 10.3708 87.7315 10.3504C87.71 10.33 87.6844 10.3144 87.6564 10.3044ZM36.4195 55.8383C31.4883 55.8383 27.432 51.3267 27.432 45.7931C27.432 40.2532 31.4133 35.7416 36.4195 35.7416C41.4632 35.7416 45.4819 40.2906 45.4069 45.7931C45.4069 51.3267 41.4257 55.8383 36.4195 55.8383ZM69.6441 55.8383C64.7192 55.8383 60.6567 51.3267 60.6567 45.7931C60.6567 40.2532 64.6379 35.7416 69.6441 35.7416C74.6878 35.7416 78.7128 40.2906 78.6315 45.7931C78.6315 51.3267 74.6878 55.8383 69.6441 55.8383Z" fill="%235C65EB"/>%0A</svg>%0A';
|
|
@@ -7225,7 +7383,7 @@ var twitter_default = 'data:image/svg+xml,<svg width="400" height="400" viewBox=
|
|
|
7225
7383
|
var youtube_default = 'data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M12.5612 5H12.6669C13.643 5.00347 18.5892 5.03817 19.9229 5.38749C20.3261 5.4941 20.6935 5.7019 20.9884 5.99013C21.2833 6.27836 21.4953 6.63692 21.6033 7.02998C21.7233 7.46952 21.8076 8.05133 21.8646 8.65166L21.8765 8.77195L21.9026 9.0727L21.9121 9.19298C21.9893 10.2502 21.9988 11.2403 22 11.4566V11.5434C21.9988 11.7678 21.9882 12.825 21.9026 13.9262L21.8931 14.0476L21.8825 14.1679C21.823 14.8295 21.7352 15.4865 21.6033 15.97C21.4957 16.3632 21.2837 16.722 20.9888 17.0102C20.6939 17.2985 20.3262 17.5062 19.9229 17.6125C18.5454 17.9734 13.3093 17.9988 12.5837 18H12.4151C12.0481 18 10.5304 17.9931 8.93906 17.9399L8.73717 17.9329L8.63385 17.9283L8.43078 17.9202L8.2277 17.9121C6.90949 17.8554 5.65423 17.764 5.07589 17.6114C4.67269 17.5052 4.30522 17.2976 4.0103 17.0096C3.71538 16.7215 3.50335 16.363 3.39546 15.97C3.26364 15.4877 3.17576 14.8295 3.11638 14.1679L3.10688 14.0464L3.09738 13.9262C3.03877 13.1424 3.00629 12.357 3 11.5711V11.43C3.00238 11.1813 3.01188 10.3219 3.076 9.37343L3.08432 9.25429L3.08788 9.19415L3.09738 9.07385L3.12351 8.77311L3.13538 8.65281C3.19239 8.0525 3.27671 7.46952 3.39665 7.03115C3.50435 6.63792 3.7163 6.27919 4.01124 5.99091C4.30617 5.70263 4.67374 5.49494 5.07707 5.38865C5.65541 5.23828 6.91069 5.14574 8.22889 5.08791L8.43078 5.07981L8.63503 5.07287L8.73717 5.0694L8.94024 5.0613C10.0705 5.02549 11.2011 5.00544 12.332 5.00116H12.5612V5ZM10.6005 8.71297V14.2859L15.5372 11.5006L10.6005 8.71297Z" fill="%23FF0000"/>%0A</svg>%0A';
|
|
7226
7384
|
|
|
7227
7385
|
// src/components/PlatformIcon/PlatformIcon.tsx
|
|
7228
|
-
import { jsx as
|
|
7386
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
7229
7387
|
var PLATFORM_ICON_URLS = {
|
|
7230
7388
|
twitch: twitch_default,
|
|
7231
7389
|
youtube: youtube_default,
|
|
@@ -7250,13 +7408,13 @@ function PlatformIcon({ platform, fallback = true, size, className, title, style
|
|
|
7250
7408
|
return null;
|
|
7251
7409
|
}
|
|
7252
7410
|
const sizeStyle = size !== void 0 ? { height: typeof size === "number" ? `${size}px` : size } : void 0;
|
|
7253
|
-
return /* @__PURE__ */
|
|
7411
|
+
return /* @__PURE__ */ jsx16("img", { className: classNames5("ls-platform-icon", className), src: url, alt: "", title: title ?? (platform ? String(platform) : void 0), style: { ...sizeStyle, ...style } });
|
|
7254
7412
|
}
|
|
7255
7413
|
PlatformIcon.displayName = "PlatformIcon";
|
|
7256
7414
|
|
|
7257
7415
|
// src/components/ChatMessageItem/modActionIcons.tsx
|
|
7258
|
-
import { jsx as
|
|
7259
|
-
var DeleteIcon = () => /* @__PURE__ */
|
|
7416
|
+
import { jsx as jsx17, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
7417
|
+
var DeleteIcon = () => /* @__PURE__ */ jsx17("svg", { width: "15", height: "15", viewBox: "0 0 15 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17(
|
|
7260
7418
|
"path",
|
|
7261
7419
|
{
|
|
7262
7420
|
d: "M14.375 2.7H11.875V1.2C11.875 0.538125 11.3145 0 10.625 0H4.375C3.68555 0 3.125 0.538125 3.125 1.2V2.7H0.625C0.279297 2.7 0 2.96813 0 3.3V3.9C0 3.9825 0.0703125 4.05 0.15625 4.05H1.33594L1.81836 13.8563C1.84961 14.4956 2.40039 15 3.06641 15H11.9336C12.6016 15 13.1504 14.4975 13.1816 13.8563L13.6641 4.05H14.8438C14.9297 4.05 15 3.9825 15 3.9V3.3C15 2.96813 14.7207 2.7 14.375 2.7ZM10.4688 2.7H4.53125V1.35H10.4688V2.7Z",
|
|
@@ -7264,14 +7422,14 @@ var DeleteIcon = () => /* @__PURE__ */ jsx16("svg", { width: "15", height: "15",
|
|
|
7264
7422
|
}
|
|
7265
7423
|
) });
|
|
7266
7424
|
var CopyIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
7267
|
-
/* @__PURE__ */
|
|
7425
|
+
/* @__PURE__ */ jsx17(
|
|
7268
7426
|
"path",
|
|
7269
7427
|
{
|
|
7270
7428
|
d: "M11.3569 12.0002H2.78544C2.61494 12.0002 2.45143 11.9325 2.33087 11.8119C2.21031 11.6914 2.14258 11.5278 2.14258 11.3574V2.57164C2.14258 2.45797 2.18773 2.34896 2.2681 2.26859C2.34848 2.18822 2.45749 2.14307 2.57115 2.14307H11.3569C11.5274 2.14307 11.6909 2.2108 11.8114 2.33135C11.932 2.45191 11.9997 2.61543 11.9997 2.78592V11.3574C11.9997 11.5278 11.932 11.6914 11.8114 11.8119C11.6909 11.9325 11.5274 12.0002 11.3569 12.0002Z",
|
|
7271
7429
|
fill: "currentColor"
|
|
7272
7430
|
}
|
|
7273
7431
|
),
|
|
7274
|
-
/* @__PURE__ */
|
|
7432
|
+
/* @__PURE__ */ jsx17(
|
|
7275
7433
|
"path",
|
|
7276
7434
|
{
|
|
7277
7435
|
d: "M2.14286 1.28571H9.85714V0.642857C9.85714 0.472361 9.78941 0.308848 9.66885 0.188289C9.54829 0.0677294 9.38478 0 9.21428 0H0.75C0.551088 0 0.360322 0.0790177 0.21967 0.21967C0.0790177 0.360322 0 0.551088 0 0.75V9.21428C0 9.38478 0.0677294 9.54829 0.188289 9.66885C0.308848 9.78941 0.472361 9.85714 0.642857 9.85714H1.28571V2.14286C1.28571 1.91553 1.37602 1.69751 1.53677 1.53677C1.69751 1.37602 1.91553 1.28571 2.14286 1.28571Z",
|
|
@@ -7279,8 +7437,8 @@ var CopyIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "12", height: "12", v
|
|
|
7279
7437
|
}
|
|
7280
7438
|
)
|
|
7281
7439
|
] });
|
|
7282
|
-
var PinOnIcon = () => /* @__PURE__ */
|
|
7283
|
-
var PinOffIcon = () => /* @__PURE__ */
|
|
7440
|
+
var PinOnIcon = () => /* @__PURE__ */ jsx17("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17("path", { d: "M10.6667 7.99992V2.66659H11.3333V1.33325H4.66667V2.66659H5.33333V7.99992L4 9.33325V10.6666H7.46667V14.6666H8.53333V10.6666H12V9.33325L10.6667 7.99992Z", fill: "currentColor" }) });
|
|
7441
|
+
var PinOffIcon = () => /* @__PURE__ */ jsx17("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17(
|
|
7284
7442
|
"path",
|
|
7285
7443
|
{
|
|
7286
7444
|
d: "M10.6667 7.99992V2.66659H11.3333V1.33325H4.66667V2.66659H5.33333V7.99992L4 9.33325V10.6666H7.46667V14.6666H8.53333V10.6666H12V9.33325L10.6667 7.99992ZM5.86667 9.33325L6.66667 8.53325V2.66659H9.33333V8.53325L10.1333 9.33325H5.86667Z",
|
|
@@ -7289,8 +7447,8 @@ var PinOffIcon = () => /* @__PURE__ */ jsx16("svg", { width: "16", height: "16",
|
|
|
7289
7447
|
) });
|
|
7290
7448
|
var TranslateIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height: "16", viewBox: "0 0 107 107", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
7291
7449
|
/* @__PURE__ */ jsxs7("g", { clipPath: "url(#ls-chat-translate-clip)", children: [
|
|
7292
|
-
/* @__PURE__ */
|
|
7293
|
-
/* @__PURE__ */
|
|
7450
|
+
/* @__PURE__ */ jsx17("path", { d: "M34.9975 45.927L32.605 53H26.5L36.741 25.5H43.803L54 53H47.5815L45.189 45.927H34.9975ZM43.9845 41.879L40.25 30.758H39.9805L36.246 41.879H43.9845Z", fill: "currentColor" }),
|
|
7451
|
+
/* @__PURE__ */ jsx17(
|
|
7294
7452
|
"path",
|
|
7295
7453
|
{
|
|
7296
7454
|
d: "M10 20C10 17.0826 11.1589 14.2847 13.2218 12.2218C15.2847 10.1589 18.0826 9 21 9H59.5C62.4174 9 65.2153 10.1589 67.2782 12.2218C69.3411 14.2847 70.5 17.0826 70.5 20V36.5H87C89.9174 36.5 92.7153 37.6589 94.7782 39.7218C96.8411 41.7847 98 44.5826 98 47.5V86C98 88.9174 96.8411 91.7153 94.7782 93.7782C92.7153 95.8411 89.9174 97 87 97H48.5C45.5826 97 42.7847 95.8411 40.7218 93.7782C38.6589 91.7153 37.5 88.9174 37.5 86V69.5H21C18.0826 69.5 15.2847 68.3411 13.2218 66.2782C11.1589 64.2153 10 61.4174 10 58.5V20ZM21 14.5C19.5413 14.5 18.1424 15.0795 17.1109 16.1109C16.0795 17.1424 15.5 18.5413 15.5 20V58.5C15.5 59.9587 16.0795 61.3576 17.1109 62.3891C18.1424 63.4205 19.5413 64 21 64H59.5C60.9587 64 62.3576 63.4205 63.3891 62.3891C64.4205 61.3576 65 59.9587 65 58.5V20C65 18.5413 64.4205 17.1424 63.3891 16.1109C62.3576 15.0795 60.9587 14.5 59.5 14.5H21ZM60.259 69.4725C61.3187 71.1262 62.4737 72.6772 63.724 74.1255C59.61 77.288 54.5225 79.631 48.5 81.2315C49.479 82.425 50.9805 84.724 51.5525 86C57.74 84.0255 62.9925 81.358 67.4255 77.783C71.699 81.4405 76.99 84.1905 83.5405 85.879C84.272 84.482 85.8175 82.1775 87 80.984C80.8125 79.5925 75.6865 77.167 71.49 73.922C75.2355 69.8135 78.211 64.8415 80.4055 58.7585H87V53H70.5V58.7585H74.7075C72.9585 63.4005 70.6375 67.2615 67.7115 70.4735C66.9028 69.613 66.1409 68.7097 65.429 67.7675C63.8757 68.76 62.098 69.3463 60.259 69.4725Z",
|
|
@@ -7298,17 +7456,17 @@ var TranslateIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height: "1
|
|
|
7298
7456
|
}
|
|
7299
7457
|
)
|
|
7300
7458
|
] }),
|
|
7301
|
-
/* @__PURE__ */
|
|
7459
|
+
/* @__PURE__ */ jsx17("defs", { children: /* @__PURE__ */ jsx17("clipPath", { id: "ls-chat-translate-clip", children: /* @__PURE__ */ jsx17("rect", { width: "88", height: "88", fill: "#fff", transform: "translate(10 9)" }) }) })
|
|
7302
7460
|
] });
|
|
7303
7461
|
var BanUserIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height: "16", viewBox: "0 0 107 107", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
7304
|
-
/* @__PURE__ */
|
|
7462
|
+
/* @__PURE__ */ jsx17(
|
|
7305
7463
|
"path",
|
|
7306
7464
|
{
|
|
7307
7465
|
d: "M71.333 62.417C72.1697 62.417 73.0017 62.465 73.8252 62.5576C65.2189 65.3659 59 73.4561 59 83C59 88.8767 61.3585 94.202 65.1797 98.083H13.375V84.708C13.3751 78.7961 15.724 73.1267 19.9043 68.9463C24.0848 64.7658 29.7549 62.417 35.667 62.417H71.333ZM53.5 8.91699C60.0033 8.91699 66.2403 11.5001 70.8389 16.0986C75.4374 20.6972 78.0205 26.9342 78.0205 33.4375C78.0205 39.9408 75.4374 46.1778 70.8389 50.7764C66.2403 55.3749 60.0033 57.958 53.5 57.958C46.9967 57.958 40.7597 55.3749 36.1611 50.7764C31.5626 46.1778 28.9795 39.9408 28.9795 33.4375C28.9795 26.9342 31.5626 20.6972 36.1611 16.0986C40.7597 11.5001 46.9967 8.91699 53.5 8.91699Z",
|
|
7308
7466
|
fill: "currentColor"
|
|
7309
7467
|
}
|
|
7310
7468
|
),
|
|
7311
|
-
/* @__PURE__ */
|
|
7469
|
+
/* @__PURE__ */ jsx17(
|
|
7312
7470
|
"path",
|
|
7313
7471
|
{
|
|
7314
7472
|
d: "M72.4414 77.9153C71.0064 79.9384 70.3336 82.4041 70.5422 84.8757C70.7508 87.3473 71.8274 89.6654 73.5814 91.4193C75.3353 93.1732 77.6533 94.2498 80.1249 94.4584C82.5965 94.6671 85.0622 93.9943 87.0853 92.5592L72.4414 77.9153ZM74.9159 75.4426L89.5598 90.0865C90.9949 88.0634 91.6677 85.5977 91.4591 83.126C91.2504 80.6544 90.1738 78.3364 88.4199 76.5825C86.666 74.8286 84.348 73.752 81.8764 73.5433C79.4047 73.3347 76.939 74.0075 74.9159 75.4426ZM71.101 93.9014C68.4752 91.2759 66.9999 87.7148 66.9998 84.0015C66.9996 80.2882 68.4745 76.727 71.1001 74.1012C73.7256 71.4754 77.2868 70.0002 81 70C84.7133 69.9998 88.2745 71.4748 90.9003 74.1003C93.5259 76.7259 95.0009 80.2869 95.0009 84C95.0009 87.7131 93.5259 91.2741 90.9003 93.8997C88.2748 96.5252 84.7137 98.0003 81.0006 98.0003C77.2875 98.0003 73.7265 96.5252 71.101 93.8997V93.9014Z",
|
|
@@ -7317,14 +7475,14 @@ var BanUserIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height: "16"
|
|
|
7317
7475
|
)
|
|
7318
7476
|
] });
|
|
7319
7477
|
var TimeoutUserIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height: "16", viewBox: "0 0 107 108", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
7320
|
-
/* @__PURE__ */
|
|
7478
|
+
/* @__PURE__ */ jsx17(
|
|
7321
7479
|
"path",
|
|
7322
7480
|
{
|
|
7323
7481
|
d: "M71.333 62.917C72.1697 62.917 73.0017 62.965 73.8252 63.0576C65.2189 65.8659 59 73.9561 59 83.5C59 89.3767 61.3585 94.702 65.1797 98.583H13.375V85.208C13.3751 79.2961 15.724 73.6267 19.9043 69.4463C24.0848 65.2658 29.7549 62.917 35.667 62.917H71.333ZM53.5 9.41699C60.0033 9.41699 66.2403 12.0001 70.8389 16.5986C75.4374 21.1972 78.0205 27.4342 78.0205 33.9375C78.0205 40.4408 75.4374 46.6778 70.8389 51.2764C66.2403 55.8749 60.0033 58.458 53.5 58.458C46.9967 58.458 40.7597 55.8749 36.1611 51.2764C31.5626 46.6778 28.9795 40.4408 28.9795 33.9375C28.9795 27.4342 31.5626 21.1972 36.1611 16.5986C40.7597 12.0001 46.9967 9.41699 53.5 9.41699Z",
|
|
7324
7482
|
fill: "currentColor"
|
|
7325
7483
|
}
|
|
7326
7484
|
),
|
|
7327
|
-
/* @__PURE__ */
|
|
7485
|
+
/* @__PURE__ */ jsx17(
|
|
7328
7486
|
"path",
|
|
7329
7487
|
{
|
|
7330
7488
|
d: "M81.1936 70.3225C88.8545 70.3225 95.0646 76.5325 95.0646 84.1935C95.0646 91.8544 88.8545 98.0644 81.1936 98.0644C73.5327 98.0644 67.3226 91.8544 67.3226 84.1935C67.3226 76.5325 73.5327 70.3225 81.1936 70.3225ZM81.1936 75.8709C80.8257 75.8709 80.4729 76.017 80.2128 76.2772C79.9526 76.5373 79.8065 76.8901 79.8065 77.258V84.1935C79.8066 84.5613 79.9528 84.9141 80.2129 85.1742L84.3742 89.3354C84.6358 89.5881 84.9862 89.7279 85.3499 89.7248C85.7136 89.7216 86.0615 89.5757 86.3187 89.3185C86.5758 89.0614 86.7217 88.7135 86.7249 88.3498C86.728 87.9861 86.5882 87.6357 86.3356 87.3741L82.5807 83.6192V77.258C82.5807 76.8901 82.4346 76.5373 82.1744 76.2772C81.9143 76.017 81.5615 75.8709 81.1936 75.8709Z",
|
|
@@ -7333,21 +7491,21 @@ var TimeoutUserIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height:
|
|
|
7333
7491
|
)
|
|
7334
7492
|
] });
|
|
7335
7493
|
var MenuDotsIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height: "16", viewBox: "0 0 3 19", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
7336
|
-
/* @__PURE__ */
|
|
7494
|
+
/* @__PURE__ */ jsx17(
|
|
7337
7495
|
"path",
|
|
7338
7496
|
{
|
|
7339
7497
|
d: "M1.47273 0.727539C1.90909 0.727539 2.27273 0.854812 2.56364 1.10936C2.85455 1.373 3 1.7639 3 2.28209C3 2.80027 2.85455 3.19118 2.56364 3.45481C2.27273 3.72754 1.90909 3.8639 1.47273 3.8639C1.05455 3.8639 0.704544 3.72754 0.422727 3.45481C0.140909 3.19118 -2.265e-08 2.80027 0 2.28209C2.265e-08 1.7639 0.140909 1.373 0.422728 1.10936C0.704544 0.854812 1.05455 0.727539 1.47273 0.727539Z",
|
|
7340
7498
|
fill: "currentColor"
|
|
7341
7499
|
}
|
|
7342
7500
|
),
|
|
7343
|
-
/* @__PURE__ */
|
|
7501
|
+
/* @__PURE__ */ jsx17(
|
|
7344
7502
|
"path",
|
|
7345
7503
|
{
|
|
7346
7504
|
d: "M1.47273 7.86426C1.90909 7.86426 2.27273 7.99152 2.56364 8.2461C2.85455 8.50974 3 8.90064 3 9.4188C3 9.93702 2.85455 10.3279 2.56364 10.5916C2.27273 10.8643 1.90909 11.0006 1.47273 11.0006C1.05455 11.0006 0.704544 10.8643 0.422727 10.5916C0.140909 10.3279 -2.265e-08 9.93702 0 9.4188C2.26506e-08 8.90064 0.140909 8.50974 0.422727 8.2461C0.704544 7.99152 1.05455 7.86426 1.47273 7.86426Z",
|
|
7347
7505
|
fill: "currentColor"
|
|
7348
7506
|
}
|
|
7349
7507
|
),
|
|
7350
|
-
/* @__PURE__ */
|
|
7508
|
+
/* @__PURE__ */ jsx17(
|
|
7351
7509
|
"path",
|
|
7352
7510
|
{
|
|
7353
7511
|
d: "M1.47273 15C1.90909 15 2.27273 15.1273 2.56364 15.3818C2.85455 15.6454 3 16.0363 3 16.5545C3 17.0727 2.85455 17.4636 2.56364 17.7272C2.27273 18 1.90909 18.1363 1.47273 18.1363C1.05455 18.1363 0.704544 18 0.422727 17.7272C0.140909 17.4636 -2.26494e-08 17.0727 0 16.5545C2.26515e-08 16.0363 0.140909 15.6454 0.422727 15.3818C0.704544 15.1273 1.05455 15 1.47273 15Z",
|
|
@@ -7355,7 +7513,7 @@ var MenuDotsIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height: "16
|
|
|
7355
7513
|
}
|
|
7356
7514
|
)
|
|
7357
7515
|
] });
|
|
7358
|
-
var ShoutoutIcon = () => /* @__PURE__ */
|
|
7516
|
+
var ShoutoutIcon = () => /* @__PURE__ */ jsx17("svg", { width: "16", height: "16", viewBox: "0 0 100 100", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17(
|
|
7359
7517
|
"path",
|
|
7360
7518
|
{
|
|
7361
7519
|
fillRule: "evenodd",
|
|
@@ -7364,7 +7522,7 @@ var ShoutoutIcon = () => /* @__PURE__ */ jsx16("svg", { width: "16", height: "16
|
|
|
7364
7522
|
fill: "currentColor"
|
|
7365
7523
|
}
|
|
7366
7524
|
) });
|
|
7367
|
-
var VipIcon = () => /* @__PURE__ */
|
|
7525
|
+
var VipIcon = () => /* @__PURE__ */ jsx17("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17(
|
|
7368
7526
|
"path",
|
|
7369
7527
|
{
|
|
7370
7528
|
fillRule: "evenodd",
|
|
@@ -7373,14 +7531,14 @@ var VipIcon = () => /* @__PURE__ */ jsx16("svg", { width: "16", height: "16", vi
|
|
|
7373
7531
|
fill: "currentColor"
|
|
7374
7532
|
}
|
|
7375
7533
|
) });
|
|
7376
|
-
var RemoveVipIcon = () => /* @__PURE__ */
|
|
7534
|
+
var RemoveVipIcon = () => /* @__PURE__ */ jsx17("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17(
|
|
7377
7535
|
"path",
|
|
7378
7536
|
{
|
|
7379
7537
|
d: "M17.9995 13C18.6561 13 19.3069 13.1296 19.9136 13.3809C20.5201 13.6321 21.0714 14.0006 21.5356 14.4648C21.9998 14.9291 22.3684 15.4804 22.6196 16.0869C22.8708 16.6934 22.9995 17.3435 22.9995 18C22.9995 18.6565 22.8708 19.3066 22.6196 19.9131C22.3684 20.5196 21.9998 21.0709 21.5356 21.5352C21.0714 21.9994 20.5201 22.3679 19.9136 22.6191C19.3069 22.8704 18.6561 23 17.9995 23C16.6736 22.9999 15.4019 22.4727 14.4644 21.5352C13.5268 20.5975 12.9995 19.326 12.9995 18C12.9995 16.674 13.5268 15.4025 14.4644 14.4648C15.4019 13.5273 16.6736 13.0001 17.9995 13ZM17.4204 3C17.7449 3.00004 18.0649 3.07933 18.3521 3.23047C18.6392 3.38169 18.8852 3.60063 19.0688 3.86816L19.1558 4.00781L22.4897 9.83984C22.6933 10.1958 22.7828 10.6063 22.7456 11.0146C22.7083 11.4229 22.5462 11.8098 22.2817 12.123L22.1675 12.2461L21.3745 13.0381C20.413 12.3829 19.2507 12 17.9995 12C14.686 12.0003 11.9995 14.6864 11.9995 18C11.9995 19.2515 12.3832 20.4134 13.0386 21.375L12.8853 21.5293C12.6676 21.7469 12.3771 21.8767 12.0698 21.8936C11.7625 21.9103 11.4593 21.8127 11.2192 21.6201L11.1167 21.5303L1.8335 12.2461C1.54369 11.9563 1.35037 11.5842 1.27881 11.1807C1.20728 10.777 1.26145 10.3611 1.43408 9.98926L1.51221 9.83887L4.84521 4.00684C5.00627 3.72505 5.23356 3.48685 5.50732 3.3125C5.78107 3.13819 6.09308 3.03263 6.4165 3.00586L6.57959 3H17.4204ZM15.2222 18.5557H20.7778V17.4443H15.2222V18.5557ZM16.0034 8.9873C15.8707 8.98848 15.7396 9.01695 15.6177 9.06934C15.4957 9.12174 15.3847 9.19748 15.2925 9.29297L11.9995 12.5859L8.70654 9.29297C8.51904 9.10565 8.26456 9 7.99951 9C7.73453 9.00013 7.47989 9.10561 7.29248 9.29297C7.10516 9.48047 7.00049 9.73495 7.00049 10C7.00049 10.265 7.10516 10.5195 7.29248 10.707L11.1157 14.5303C11.2318 14.6464 11.3703 14.7379 11.522 14.8008C11.6734 14.8635 11.8356 14.8964 11.9995 14.8965C12.1636 14.8965 12.3264 14.8636 12.478 14.8008C12.6297 14.7379 12.7682 14.6464 12.8843 14.5303L16.7065 10.707C16.802 10.6149 16.8787 10.5047 16.9312 10.3828C16.9836 10.2608 17.0111 10.1289 17.0122 9.99609C17.0133 9.86355 16.9881 9.73207 16.938 9.60938C16.8877 9.48649 16.8131 9.37416 16.7192 9.28027C16.6255 9.18657 16.5138 9.11273 16.3911 9.0625C16.2682 9.01223 16.1362 8.98615 16.0034 8.9873Z",
|
|
7380
7538
|
fill: "currentColor"
|
|
7381
7539
|
}
|
|
7382
7540
|
) });
|
|
7383
|
-
var ModeratorIcon = () => /* @__PURE__ */
|
|
7541
|
+
var ModeratorIcon = () => /* @__PURE__ */ jsx17("svg", { width: "16", height: "16", viewBox: "0 0 20 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17(
|
|
7384
7542
|
"path",
|
|
7385
7543
|
{
|
|
7386
7544
|
fillRule: "evenodd",
|
|
@@ -7391,7 +7549,7 @@ var ModeratorIcon = () => /* @__PURE__ */ jsx16("svg", { width: "16", height: "1
|
|
|
7391
7549
|
) });
|
|
7392
7550
|
|
|
7393
7551
|
// src/components/ChatMessageItem/ChatMessageItem.tsx
|
|
7394
|
-
import { jsx as
|
|
7552
|
+
import { jsx as jsx18, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
7395
7553
|
var DEFAULT_MOD_ACTION_LABELS = {
|
|
7396
7554
|
delete: "Delete Message",
|
|
7397
7555
|
copy: "Copy to clipboard",
|
|
@@ -7416,10 +7574,10 @@ function ModActionButton({
|
|
|
7416
7574
|
onClick,
|
|
7417
7575
|
children
|
|
7418
7576
|
}) {
|
|
7419
|
-
return /* @__PURE__ */
|
|
7577
|
+
return /* @__PURE__ */ jsx18(Tooltip4, { title, placement, children: /* @__PURE__ */ jsx18(
|
|
7420
7578
|
"span",
|
|
7421
7579
|
{
|
|
7422
|
-
className:
|
|
7580
|
+
className: classNames6("ls-chat-message__modbtn", { "ls-chat-message__modbtn--danger": danger }),
|
|
7423
7581
|
onClick,
|
|
7424
7582
|
children
|
|
7425
7583
|
}
|
|
@@ -7463,7 +7621,7 @@ function ChatMessageItem({
|
|
|
7463
7621
|
const [menuPosition, setMenuPosition] = useState6(null);
|
|
7464
7622
|
const [menuAnchorEl, setMenuAnchorEl] = useState6(null);
|
|
7465
7623
|
const name = displayname || username;
|
|
7466
|
-
const siteIcon = platformIcon ?? (platform ? /* @__PURE__ */
|
|
7624
|
+
const siteIcon = platformIcon ?? (platform ? /* @__PURE__ */ jsx18(PlatformIcon, { platform }) : null);
|
|
7467
7625
|
const has = (action) => Boolean(modActions?.includes(action));
|
|
7468
7626
|
const label = (action) => modActionLabels?.[action] ?? DEFAULT_MOD_ACTION_LABELS[action];
|
|
7469
7627
|
const vipAction = isVip ? "remove-vip" : "add-vip";
|
|
@@ -7498,34 +7656,34 @@ function ChatMessageItem({
|
|
|
7498
7656
|
closeMenu();
|
|
7499
7657
|
},
|
|
7500
7658
|
children: [
|
|
7501
|
-
/* @__PURE__ */
|
|
7502
|
-
/* @__PURE__ */
|
|
7659
|
+
/* @__PURE__ */ jsx18(ListItemIcon, { children: /* @__PURE__ */ jsx18("span", { className: "ls-chat-message__menu-icon", children: icon }) }),
|
|
7660
|
+
/* @__PURE__ */ jsx18(ListItemText, { children: label(action) })
|
|
7503
7661
|
]
|
|
7504
7662
|
},
|
|
7505
7663
|
action
|
|
7506
7664
|
) : null;
|
|
7507
7665
|
const builtInActions = hasVisibleModActions && hovered && !actions ? /* @__PURE__ */ jsxs8("span", { className: "ls-chat-message__modbar", children: [
|
|
7508
|
-
has("delete") && /* @__PURE__ */
|
|
7509
|
-
has("pin") && /* @__PURE__ */
|
|
7666
|
+
has("delete") && /* @__PURE__ */ jsx18(ModActionButton, { title: label("delete"), placement: modActionsTooltipPlacement, danger: true, onClick: () => fire("delete"), children: /* @__PURE__ */ jsx18(DeleteIcon, {}) }),
|
|
7667
|
+
has("pin") && /* @__PURE__ */ jsx18(
|
|
7510
7668
|
ModActionButton,
|
|
7511
7669
|
{
|
|
7512
7670
|
title: label(isPinned ? "unpin" : "pin"),
|
|
7513
7671
|
placement: modActionsTooltipPlacement,
|
|
7514
7672
|
onClick: () => fire(isPinned ? "unpin" : "pin"),
|
|
7515
|
-
children: isPinned ? /* @__PURE__ */
|
|
7673
|
+
children: isPinned ? /* @__PURE__ */ jsx18(PinOffIcon, {}) : /* @__PURE__ */ jsx18(PinOnIcon, {})
|
|
7516
7674
|
}
|
|
7517
7675
|
),
|
|
7518
|
-
has("copy") && /* @__PURE__ */
|
|
7519
|
-
has("translate") && /* @__PURE__ */
|
|
7520
|
-
has("ban") && !isSelf && /* @__PURE__ */
|
|
7521
|
-
has("timeout") && /* @__PURE__ */
|
|
7522
|
-
hasOverflowMenuItems && /* @__PURE__ */
|
|
7676
|
+
has("copy") && /* @__PURE__ */ jsx18(ModActionButton, { title: label("copy"), placement: modActionsTooltipPlacement, onClick: () => fire("copy"), children: /* @__PURE__ */ jsx18(CopyIcon, {}) }),
|
|
7677
|
+
has("translate") && /* @__PURE__ */ jsx18(ModActionButton, { title: label("translate"), placement: modActionsTooltipPlacement, onClick: () => fire("translate"), children: /* @__PURE__ */ jsx18(TranslateIcon, {}) }),
|
|
7678
|
+
has("ban") && !isSelf && /* @__PURE__ */ jsx18(ModActionButton, { title: label("ban"), placement: modActionsTooltipPlacement, onClick: () => fire("ban"), children: /* @__PURE__ */ jsx18(BanUserIcon, {}) }),
|
|
7679
|
+
has("timeout") && /* @__PURE__ */ jsx18(ModActionButton, { title: label("timeout"), placement: modActionsTooltipPlacement, onClick: () => fire("timeout"), children: /* @__PURE__ */ jsx18(TimeoutUserIcon, {}) }),
|
|
7680
|
+
hasOverflowMenuItems && /* @__PURE__ */ jsx18("span", { className: "ls-chat-message__modbtn", onClick: handleMenuOpen, children: /* @__PURE__ */ jsx18(MenuDotsIcon, {}) })
|
|
7523
7681
|
] }) : null;
|
|
7524
7682
|
const actionsNode = actions ?? builtInActions;
|
|
7525
7683
|
return /* @__PURE__ */ jsxs8(
|
|
7526
7684
|
"div",
|
|
7527
7685
|
{
|
|
7528
|
-
className:
|
|
7686
|
+
className: classNames6("ls-chat-message", className),
|
|
7529
7687
|
title,
|
|
7530
7688
|
onClick: () => {
|
|
7531
7689
|
closeMenu();
|
|
@@ -7541,12 +7699,12 @@ function ChatMessageItem({
|
|
|
7541
7699
|
onMouseLeave?.();
|
|
7542
7700
|
},
|
|
7543
7701
|
children: [
|
|
7544
|
-
reply ? /* @__PURE__ */
|
|
7545
|
-
showAvatar && avatarPrefix ? /* @__PURE__ */
|
|
7546
|
-
showAvatar && (avatar || fallbackAvatar) ? /* @__PURE__ */
|
|
7547
|
-
siteIcon ? /* @__PURE__ */
|
|
7548
|
-
showTimestamp && timestamp ? /* @__PURE__ */
|
|
7549
|
-
showBadges && badges ? /* @__PURE__ */
|
|
7702
|
+
reply ? /* @__PURE__ */ jsx18("span", { className: "ls-chat-message__reply", children: reply }) : null,
|
|
7703
|
+
showAvatar && avatarPrefix ? /* @__PURE__ */ jsx18("span", { className: "ls-chat-message__avatar-prefix", children: avatarPrefix }) : null,
|
|
7704
|
+
showAvatar && (avatar || fallbackAvatar) ? /* @__PURE__ */ jsx18("img", { className: "ls-chat-message__avatar", src: avatar || fallbackAvatar, alt: "" }) : null,
|
|
7705
|
+
siteIcon ? /* @__PURE__ */ jsx18("span", { className: "ls-chat-message__site", children: siteIcon }) : null,
|
|
7706
|
+
showTimestamp && timestamp ? /* @__PURE__ */ jsx18("span", { className: "ls-chat-message__time", children: timestamp }) : null,
|
|
7707
|
+
showBadges && badges ? /* @__PURE__ */ jsx18("span", { className: "ls-chat-message__badges", children: badges }) : null,
|
|
7550
7708
|
onUsernameClick ? /* @__PURE__ */ jsxs8(
|
|
7551
7709
|
"button",
|
|
7552
7710
|
{
|
|
@@ -7567,8 +7725,8 @@ function ChatMessageItem({
|
|
|
7567
7725
|
":"
|
|
7568
7726
|
] }),
|
|
7569
7727
|
" ",
|
|
7570
|
-
/* @__PURE__ */
|
|
7571
|
-
actionsNode ? /* @__PURE__ */
|
|
7728
|
+
/* @__PURE__ */ jsx18("span", { className: "ls-chat-message__text", children: message }),
|
|
7729
|
+
actionsNode ? /* @__PURE__ */ jsx18("span", { className: "ls-chat-message__actions", children: actionsNode }) : null,
|
|
7572
7730
|
onModAction && hasOverflowMenuItems ? /* @__PURE__ */ jsxs8(
|
|
7573
7731
|
Menu,
|
|
7574
7732
|
{
|
|
@@ -7580,10 +7738,10 @@ function ChatMessageItem({
|
|
|
7580
7738
|
anchorOrigin: modMenuAnchor === "element" ? { vertical: "bottom", horizontal: "right" } : void 0,
|
|
7581
7739
|
transformOrigin: modMenuAnchor === "element" ? { vertical: "top", horizontal: "right" } : void 0,
|
|
7582
7740
|
children: [
|
|
7583
|
-
menuItem("shoutout", /* @__PURE__ */
|
|
7584
|
-
menuItem(vipAction, isVip ? /* @__PURE__ */
|
|
7585
|
-
menuItem(moderatorAction, /* @__PURE__ */
|
|
7586
|
-
menuItem("unban", /* @__PURE__ */
|
|
7741
|
+
menuItem("shoutout", /* @__PURE__ */ jsx18(ShoutoutIcon, {})),
|
|
7742
|
+
menuItem(vipAction, isVip ? /* @__PURE__ */ jsx18(RemoveVipIcon, {}) : /* @__PURE__ */ jsx18(VipIcon, {})),
|
|
7743
|
+
menuItem(moderatorAction, /* @__PURE__ */ jsx18(ModeratorIcon, {})),
|
|
7744
|
+
menuItem("unban", /* @__PURE__ */ jsx18(BanUserIcon, {}))
|
|
7587
7745
|
]
|
|
7588
7746
|
}
|
|
7589
7747
|
) : null
|
|
@@ -7596,7 +7754,7 @@ ChatMessageItem.displayName = "ChatMessageItem";
|
|
|
7596
7754
|
// src/components/ChatboxPanel/ChatboxPanel.tsx
|
|
7597
7755
|
import { useEffect as useEffect6, useRef as useRef6, useState as useState8 } from "react";
|
|
7598
7756
|
import MenuItem3 from "@mui/material/MenuItem";
|
|
7599
|
-
import
|
|
7757
|
+
import classNames7 from "classnames";
|
|
7600
7758
|
|
|
7601
7759
|
// src/components/ChatboxPanel/useAutoScroll.ts
|
|
7602
7760
|
import { useCallback as useCallback3, useRef as useRef5, useState as useState7 } from "react";
|
|
@@ -7639,7 +7797,7 @@ var useAutoScroll = (threshold = 24, options) => {
|
|
|
7639
7797
|
};
|
|
7640
7798
|
|
|
7641
7799
|
// src/components/ChatboxPanel/ChatboxPanel.tsx
|
|
7642
|
-
import { jsx as
|
|
7800
|
+
import { jsx as jsx19, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
7643
7801
|
function ChatboxPanel({
|
|
7644
7802
|
children,
|
|
7645
7803
|
messageCount,
|
|
@@ -7732,9 +7890,9 @@ function ChatboxPanel({
|
|
|
7732
7890
|
setInternalValue("");
|
|
7733
7891
|
}
|
|
7734
7892
|
};
|
|
7735
|
-
return /* @__PURE__ */ jsxs9("div", { className:
|
|
7893
|
+
return /* @__PURE__ */ jsxs9("div", { className: classNames7("ls-chatbox", className), id, children: [
|
|
7736
7894
|
/* @__PURE__ */ jsxs9("div", { className: "ls-chatbox__viewport", children: [
|
|
7737
|
-
/* @__PURE__ */
|
|
7895
|
+
/* @__PURE__ */ jsx19(
|
|
7738
7896
|
"div",
|
|
7739
7897
|
{
|
|
7740
7898
|
className: "ls-chatbox__list",
|
|
@@ -7762,7 +7920,7 @@ function ChatboxPanel({
|
|
|
7762
7920
|
/* @__PURE__ */ jsxs9(
|
|
7763
7921
|
"svg",
|
|
7764
7922
|
{
|
|
7765
|
-
className:
|
|
7923
|
+
className: classNames7("ls-chatbox__jump-arrow", { "ls-chatbox__jump-arrow--up": reverse }),
|
|
7766
7924
|
width: "14",
|
|
7767
7925
|
height: "14",
|
|
7768
7926
|
viewBox: "0 0 24 24",
|
|
@@ -7772,19 +7930,19 @@ function ChatboxPanel({
|
|
|
7772
7930
|
strokeLinecap: "round",
|
|
7773
7931
|
strokeLinejoin: "round",
|
|
7774
7932
|
children: [
|
|
7775
|
-
/* @__PURE__ */
|
|
7776
|
-
/* @__PURE__ */
|
|
7933
|
+
/* @__PURE__ */ jsx19("line", { x1: "12", y1: "5", x2: "12", y2: "19" }),
|
|
7934
|
+
/* @__PURE__ */ jsx19("polyline", { points: "19 12 12 19 5 12" })
|
|
7777
7935
|
]
|
|
7778
7936
|
}
|
|
7779
7937
|
),
|
|
7780
7938
|
jumpToLatestLabel,
|
|
7781
|
-
unreadCount > 0 && /* @__PURE__ */
|
|
7939
|
+
unreadCount > 0 && /* @__PURE__ */ jsx19("span", { className: "ls-chatbox__jump-badge", children: unreadCount > 99 ? "99+" : unreadCount })
|
|
7782
7940
|
]
|
|
7783
7941
|
}
|
|
7784
7942
|
)
|
|
7785
7943
|
] }),
|
|
7786
7944
|
showSendBar && onSend ? /* @__PURE__ */ jsxs9("div", { className: "ls-chatbox__sendbar", children: [
|
|
7787
|
-
/* @__PURE__ */
|
|
7945
|
+
/* @__PURE__ */ jsx19(
|
|
7788
7946
|
LSInput,
|
|
7789
7947
|
{
|
|
7790
7948
|
className: "ls-chatbox__input",
|
|
@@ -7806,9 +7964,9 @@ function ChatboxPanel({
|
|
|
7806
7964
|
displayEmpty: true,
|
|
7807
7965
|
onChange: (e) => onPlatformChange?.(String(e.target.value)),
|
|
7808
7966
|
children: [
|
|
7809
|
-
allPlatformsLabel != null && /* @__PURE__ */
|
|
7810
|
-
platforms?.map((option) => /* @__PURE__ */
|
|
7811
|
-
/* @__PURE__ */
|
|
7967
|
+
allPlatformsLabel != null && /* @__PURE__ */ jsx19(MenuItem3, { value: "", children: allPlatformsLabel }),
|
|
7968
|
+
platforms?.map((option) => /* @__PURE__ */ jsx19(MenuItem3, { value: option.value, children: /* @__PURE__ */ jsxs9("span", { className: "ls-chatbox__platform-option", children: [
|
|
7969
|
+
/* @__PURE__ */ jsx19(PlatformIcon, { platform: option.value, fallback: false }),
|
|
7812
7970
|
option.label
|
|
7813
7971
|
] }) }, option.value))
|
|
7814
7972
|
]
|
|
@@ -7822,12 +7980,12 @@ function ChatboxPanel({
|
|
|
7822
7980
|
value: chatAs ?? "self",
|
|
7823
7981
|
onChange: (e) => onChatAsChange(e.target.value === "bot" ? "bot" : "self"),
|
|
7824
7982
|
children: [
|
|
7825
|
-
/* @__PURE__ */
|
|
7826
|
-
/* @__PURE__ */
|
|
7983
|
+
/* @__PURE__ */ jsx19(MenuItem3, { value: "self", children: chatAsSelfLabel }),
|
|
7984
|
+
/* @__PURE__ */ jsx19(MenuItem3, { value: "bot", children: chatAsBotLabel })
|
|
7827
7985
|
]
|
|
7828
7986
|
}
|
|
7829
7987
|
) : null,
|
|
7830
|
-
/* @__PURE__ */
|
|
7988
|
+
/* @__PURE__ */ jsx19(
|
|
7831
7989
|
LSButton,
|
|
7832
7990
|
{
|
|
7833
7991
|
className: "ls-chatbox__send",
|
|
@@ -7845,8 +8003,8 @@ ChatboxPanel.displayName = "ChatboxPanel";
|
|
|
7845
8003
|
// src/components/ModalChrome/DialogChrome.tsx
|
|
7846
8004
|
import Fade from "@mui/material/Fade";
|
|
7847
8005
|
import Modal from "@mui/material/Modal";
|
|
7848
|
-
import
|
|
7849
|
-
import { jsx as
|
|
8006
|
+
import classNames8 from "classnames";
|
|
8007
|
+
import { jsx as jsx20, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
7850
8008
|
var DIMENSIONS = {
|
|
7851
8009
|
small: { width: "30%", height: "30%" },
|
|
7852
8010
|
longS: { width: "50%", height: "30%" },
|
|
@@ -7858,14 +8016,14 @@ var DIMENSIONS = {
|
|
|
7858
8016
|
full: { width: "100%", height: "calc(100% - 1rem)" }
|
|
7859
8017
|
};
|
|
7860
8018
|
var DefaultCloseIcon = () => /* @__PURE__ */ jsxs10("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", "aria-hidden": "true", children: [
|
|
7861
|
-
/* @__PURE__ */
|
|
7862
|
-
/* @__PURE__ */
|
|
7863
|
-
/* @__PURE__ */
|
|
8019
|
+
/* @__PURE__ */ jsx20("circle", { cx: "12", cy: "12", r: "10" }),
|
|
8020
|
+
/* @__PURE__ */ jsx20("line", { x1: "9", y1: "9", x2: "15", y2: "15", strokeLinecap: "round" }),
|
|
8021
|
+
/* @__PURE__ */ jsx20("line", { x1: "15", y1: "9", x2: "9", y2: "15", strokeLinecap: "round" })
|
|
7864
8022
|
] });
|
|
7865
8023
|
var DialogChrome = ({ children, overlayProps, closeIcon, ...props }) => {
|
|
7866
8024
|
const modalBackground = overlayProps?.background ? overlayProps.background : !overlayProps?.noBackground ? "var(--gradientBg, var(--background, #151230))" : void 0;
|
|
7867
8025
|
const dimensions = overlayProps?.size && DIMENSIONS[overlayProps.size] || { width: "90%", height: "90%" };
|
|
7868
|
-
return /* @__PURE__ */
|
|
8026
|
+
return /* @__PURE__ */ jsx20(
|
|
7869
8027
|
Modal,
|
|
7870
8028
|
{
|
|
7871
8029
|
disableEnforceFocus: true,
|
|
@@ -7876,10 +8034,10 @@ var DialogChrome = ({ children, overlayProps, closeIcon, ...props }) => {
|
|
|
7876
8034
|
},
|
|
7877
8035
|
className: "ls-dialog",
|
|
7878
8036
|
style: { ...props.style, zIndex: `${props.zIndex ? props.zIndex : "2500"} !important` },
|
|
7879
|
-
children: /* @__PURE__ */
|
|
8037
|
+
children: /* @__PURE__ */ jsx20(Fade, { in: props.open, children: /* @__PURE__ */ jsxs10(
|
|
7880
8038
|
"div",
|
|
7881
8039
|
{
|
|
7882
|
-
className:
|
|
8040
|
+
className: classNames8("ls-dialog__card", {
|
|
7883
8041
|
"ls-dialog__card--pad": !overlayProps?.noOuterPadding,
|
|
7884
8042
|
"ls-dialog__card--full": overlayProps?.size === "full"
|
|
7885
8043
|
}),
|
|
@@ -7894,29 +8052,29 @@ var DialogChrome = ({ children, overlayProps, closeIcon, ...props }) => {
|
|
|
7894
8052
|
!props.$hideTop && /* @__PURE__ */ jsxs10(
|
|
7895
8053
|
"div",
|
|
7896
8054
|
{
|
|
7897
|
-
className:
|
|
8055
|
+
className: classNames8("ls-dialog__top", { "ls-dialog__top--full": overlayProps?.size === "full" }),
|
|
7898
8056
|
style: { padding: props.$noPadTitle ? "0" : "1rem" },
|
|
7899
8057
|
children: [
|
|
7900
|
-
/* @__PURE__ */
|
|
7901
|
-
/* @__PURE__ */
|
|
7902
|
-
props.hideClose ? /* @__PURE__ */
|
|
7903
|
-
/* @__PURE__ */
|
|
7904
|
-
closeIcon ?? /* @__PURE__ */
|
|
8058
|
+
/* @__PURE__ */ jsx20("div", { className: "ls-dialog__top-side", children: props.$leftText }),
|
|
8059
|
+
/* @__PURE__ */ jsx20("div", { className: "ls-dialog__title", role: "heading", children: props.title }),
|
|
8060
|
+
props.hideClose ? /* @__PURE__ */ jsx20("div", { className: "ls-dialog__top-side" }) : /* @__PURE__ */ jsx20("div", { className: "ls-dialog__close", children: /* @__PURE__ */ jsxs10("span", { onClick: props.close, className: "ls-dialog__close-btn", children: [
|
|
8061
|
+
/* @__PURE__ */ jsx20("div", { className: "ls-dialog__close-label", children: props.closeLabel }),
|
|
8062
|
+
closeIcon ?? /* @__PURE__ */ jsx20(DefaultCloseIcon, {})
|
|
7905
8063
|
] }) })
|
|
7906
8064
|
]
|
|
7907
8065
|
}
|
|
7908
8066
|
),
|
|
7909
|
-
/* @__PURE__ */
|
|
8067
|
+
/* @__PURE__ */ jsx20(
|
|
7910
8068
|
"div",
|
|
7911
8069
|
{
|
|
7912
|
-
className:
|
|
8070
|
+
className: classNames8("ls-dialog__body", props.containerClass),
|
|
7913
8071
|
style: { backgroundImage: props.backgroundImage ? `url(${props.backgroundImage})` : "", padding: props.noPadding ? 0 : "20px 0" },
|
|
7914
8072
|
children
|
|
7915
8073
|
}
|
|
7916
8074
|
),
|
|
7917
8075
|
!props.$hideBottom && /* @__PURE__ */ jsxs10("div", { className: "ls-dialog__bottom", children: [
|
|
7918
|
-
/* @__PURE__ */
|
|
7919
|
-
props.showTest && /* @__PURE__ */
|
|
8076
|
+
/* @__PURE__ */ jsx20(LSButton, { style: props.buttonStyle && props.buttonStyle, color: props.color, label: props.saveLabel, onClick: props.save, disabled: props.saveDisabled }),
|
|
8077
|
+
props.showTest && /* @__PURE__ */ jsx20(LSButton, { color: "secondary", label: props.testLabel, onClick: props.test, disabled: props.testDisabled })
|
|
7920
8078
|
] })
|
|
7921
8079
|
]
|
|
7922
8080
|
}
|
|
@@ -7927,11 +8085,11 @@ var DialogChrome = ({ children, overlayProps, closeIcon, ...props }) => {
|
|
|
7927
8085
|
DialogChrome.displayName = "DialogChrome";
|
|
7928
8086
|
|
|
7929
8087
|
// src/components/ModalChrome/ModalChrome.tsx
|
|
7930
|
-
import
|
|
8088
|
+
import classNames10 from "classnames";
|
|
7931
8089
|
|
|
7932
8090
|
// src/components/ModalChrome/PanelChrome.tsx
|
|
7933
|
-
import
|
|
7934
|
-
import { Fragment as Fragment6, jsx as
|
|
8091
|
+
import classNames9 from "classnames";
|
|
8092
|
+
import { Fragment as Fragment6, jsx as jsx21, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
7935
8093
|
function PanelChrome({
|
|
7936
8094
|
title,
|
|
7937
8095
|
titleVariant = "heading",
|
|
@@ -7948,20 +8106,20 @@ function PanelChrome({
|
|
|
7948
8106
|
}) {
|
|
7949
8107
|
const hasHeader = Boolean(title || headerActions || onClose && showClose);
|
|
7950
8108
|
const mergedStyle = padding ? { ...style, ["--ls-panel-padding"]: padding } : style;
|
|
7951
|
-
const panel = /* @__PURE__ */ jsxs11("div", { className:
|
|
8109
|
+
const panel = /* @__PURE__ */ jsxs11("div", { className: classNames9("ls-panel", { "ls-panel--no-header": !hasHeader }, className), style: mergedStyle, children: [
|
|
7952
8110
|
hasHeader ? /* @__PURE__ */ jsxs11("div", { className: "ls-panel__header", children: [
|
|
7953
|
-
title ? /* @__PURE__ */
|
|
8111
|
+
title ? /* @__PURE__ */ jsx21("span", { className: classNames9("ls-panel__title", { "ls-panel__title--label": titleVariant === "label" }), children: title }) : /* @__PURE__ */ jsx21("span", {}),
|
|
7954
8112
|
/* @__PURE__ */ jsxs11("span", { className: "ls-panel__header-actions", children: [
|
|
7955
8113
|
headerActions,
|
|
7956
|
-
onClose && showClose ? /* @__PURE__ */
|
|
8114
|
+
onClose && showClose ? /* @__PURE__ */ jsx21("button", { type: "button", className: "ls-panel__close", onClick: onClose, "aria-label": "Close", children: "\u2715" }) : null
|
|
7957
8115
|
] })
|
|
7958
8116
|
] }) : null,
|
|
7959
|
-
/* @__PURE__ */
|
|
7960
|
-
footer ? /* @__PURE__ */
|
|
8117
|
+
/* @__PURE__ */ jsx21("div", { className: classNames9("ls-panel__body", bodyClassName), children }),
|
|
8118
|
+
footer ? /* @__PURE__ */ jsx21("div", { className: "ls-panel__footer", children: footer }) : null
|
|
7961
8119
|
] });
|
|
7962
8120
|
if (onClickAway) {
|
|
7963
8121
|
return /* @__PURE__ */ jsxs11(Fragment6, { children: [
|
|
7964
|
-
/* @__PURE__ */
|
|
8122
|
+
/* @__PURE__ */ jsx21("div", { className: "ls-panel__clickaway", onClick: onClickAway }),
|
|
7965
8123
|
panel
|
|
7966
8124
|
] });
|
|
7967
8125
|
}
|
|
@@ -7970,7 +8128,7 @@ function PanelChrome({
|
|
|
7970
8128
|
PanelChrome.displayName = "PanelChrome";
|
|
7971
8129
|
|
|
7972
8130
|
// src/components/ModalChrome/ModalChrome.tsx
|
|
7973
|
-
import { jsx as
|
|
8131
|
+
import { jsx as jsx22, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
7974
8132
|
function ModalChrome({
|
|
7975
8133
|
open = true,
|
|
7976
8134
|
onClose,
|
|
@@ -7995,12 +8153,12 @@ function ModalChrome({
|
|
|
7995
8153
|
return null;
|
|
7996
8154
|
}
|
|
7997
8155
|
const mergedCardStyle = maxWidth ? { ...cardStyle, ["--ls-modal-max-width"]: maxWidth } : cardStyle;
|
|
7998
|
-
return /* @__PURE__ */ jsxs12("div", { className:
|
|
7999
|
-
/* @__PURE__ */
|
|
8000
|
-
/* @__PURE__ */
|
|
8156
|
+
return /* @__PURE__ */ jsxs12("div", { className: classNames10("ls-modal", { "ls-modal--absolute": position === "absolute" }, className), role: "dialog", "aria-modal": "true", children: [
|
|
8157
|
+
/* @__PURE__ */ jsx22("div", { className: classNames10("ls-modal__backdrop", backdropClassName), onClick: onClose }),
|
|
8158
|
+
/* @__PURE__ */ jsx22(
|
|
8001
8159
|
PanelChrome,
|
|
8002
8160
|
{
|
|
8003
|
-
className:
|
|
8161
|
+
className: classNames10(
|
|
8004
8162
|
"ls-modal__card",
|
|
8005
8163
|
{ "ls-modal__card--fit": fitContent, "ls-modal__card--center": centerContent },
|
|
8006
8164
|
cardClassName
|
|
@@ -8022,32 +8180,32 @@ function ModalChrome({
|
|
|
8022
8180
|
ModalChrome.displayName = "ModalChrome";
|
|
8023
8181
|
|
|
8024
8182
|
// src/components/WidgetChrome/WidgetChrome.tsx
|
|
8025
|
-
import
|
|
8026
|
-
import { jsx as
|
|
8183
|
+
import classNames11 from "classnames";
|
|
8184
|
+
import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
8027
8185
|
function WidgetChromeButton({ active, buttonRef, className, children, ...rest }) {
|
|
8028
|
-
return /* @__PURE__ */
|
|
8186
|
+
return /* @__PURE__ */ jsx23("button", { ref: buttonRef, type: "button", className: classNames11("ls-widget__btn", { "ls-widget__btn--active": active }, className), ...rest, children });
|
|
8029
8187
|
}
|
|
8030
8188
|
WidgetChromeButton.displayName = "WidgetChromeButton";
|
|
8031
8189
|
function WidgetChrome({ title, leftActions, rightActions, headerExtra, showHeader = true, className, headerClassName, bodyClassName, style, id, children }) {
|
|
8032
|
-
return /* @__PURE__ */ jsxs13("div", { className:
|
|
8033
|
-
showHeader ? /* @__PURE__ */ jsxs13("div", { className:
|
|
8034
|
-
/* @__PURE__ */
|
|
8035
|
-
/* @__PURE__ */
|
|
8036
|
-
/* @__PURE__ */
|
|
8190
|
+
return /* @__PURE__ */ jsxs13("div", { className: classNames11("ls-widget", className), style, id, children: [
|
|
8191
|
+
showHeader ? /* @__PURE__ */ jsxs13("div", { className: classNames11("ls-widget__header", headerClassName), children: [
|
|
8192
|
+
/* @__PURE__ */ jsx23("div", { className: "ls-widget__side", children: leftActions }),
|
|
8193
|
+
/* @__PURE__ */ jsx23("div", { className: "ls-widget__title", children: /* @__PURE__ */ jsx23("span", { children: title }) }),
|
|
8194
|
+
/* @__PURE__ */ jsx23("div", { className: "ls-widget__side ls-widget__side--right", children: rightActions }),
|
|
8037
8195
|
headerExtra
|
|
8038
8196
|
] }) : null,
|
|
8039
|
-
/* @__PURE__ */
|
|
8197
|
+
/* @__PURE__ */ jsx23("div", { className: classNames11("ls-widget__body", bodyClassName), children })
|
|
8040
8198
|
] });
|
|
8041
8199
|
}
|
|
8042
8200
|
WidgetChrome.displayName = "WidgetChrome";
|
|
8043
8201
|
|
|
8044
8202
|
// src/components/EventListItem/EventListItem.tsx
|
|
8045
|
-
import
|
|
8203
|
+
import classNames12 from "classnames";
|
|
8046
8204
|
|
|
8047
8205
|
// src/components/EventList/EventTypeIcon.tsx
|
|
8048
|
-
import { jsx as
|
|
8206
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
8049
8207
|
var createEventIcon = (def) => {
|
|
8050
|
-
const Icon = (props) => /* @__PURE__ */
|
|
8208
|
+
const Icon = (props) => /* @__PURE__ */ jsx24("svg", { width: def.width, height: def.height, viewBox: def.viewBox, fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: def.paths.map((path, index) => /* @__PURE__ */ jsx24("path", { fill: "currentColor", ...path }, index)) });
|
|
8051
8209
|
return Icon;
|
|
8052
8210
|
};
|
|
8053
8211
|
var EVENT_TYPE_FALLBACK_ICON = createEventIcon({ width: "77", height: "77", viewBox: "0 0 77 77", paths: [{ d: "M32.0348 67.8488C32.2317 68.9076 33.1257 69.6727 34.166 69.6727H41.7175C42.9162 69.6727 43.8879 68.6655 43.8879 67.4232C43.8879 66.1808 42.9162 65.1736 41.7175 65.1736H35.9581L35.8144 64.4007H43.1152C44.2884 64.4007 45.2493 63.4344 45.2847 62.219C45.5196 54.1506 48.6247 48.8606 51.9394 43.5096C52.0669 43.3038 52.1949 43.0976 52.3233 42.8909C55.5088 37.7611 58.9 32.3001 58.9 24.5131C58.9 17.6282 56.2649 12.4215 52.2565 8.9757C48.3033 5.57735 43.149 4 38.1777 4C28.6499 4 18 11.1793 18 24.739C18 31.851 21.089 38.0439 24.0565 43.3454C24.5114 44.1581 24.9596 44.943 25.3964 45.7078C26.4256 47.5099 27.3909 49.2003 28.229 50.8789C29.4122 53.2488 30.2139 55.3578 30.4727 57.3163C30.6216 58.4425 31.5576 59.2766 32.6541 59.2603C33.7507 59.244 34.6633 58.3825 34.7809 57.2524C34.9706 55.4309 35.9174 53.2643 37.4928 50.7048C38.8347 48.5248 40.4985 46.2646 42.2571 43.8756C42.5436 43.4864 42.8327 43.0937 43.1233 42.6975C45.1598 39.9201 47.2572 36.9825 48.8406 34.0308C50.417 31.0923 51.6027 27.9286 51.6027 24.7014C51.6027 20.79 50.1716 17.467 47.6813 15.1412C45.2141 12.8368 41.8546 11.6443 38.1777 11.6443C30.9242 11.6443 25.2973 17.6891 25.2973 24.7014C25.2973 26.7539 25.6936 29.8348 26.7508 32.4851C27.7593 35.0129 29.7798 38.0597 33.4218 38.0597C35.1995 38.0597 36.6557 37.3883 37.738 36.2561C38.7611 35.1859 39.3371 33.826 39.6795 32.5814C40.3187 30.2583 40.3144 27.6507 40.3121 26.2771C40.312 26.1997 40.3118 26.1263 40.3118 26.057C40.3118 24.8147 39.3401 23.8075 38.1414 23.8075C36.9427 23.8075 35.971 24.8147 35.971 26.057L35.971 26.1579C35.9713 27.6034 35.9717 29.6519 35.5051 31.3476C35.2712 32.1976 34.969 32.7605 34.6545 33.0895C34.3992 33.3566 34.0583 33.5607 33.4218 33.5607C32.5619 33.5607 31.6054 32.8794 30.7623 30.766C29.968 28.7751 29.6382 26.3016 29.6382 24.7014C29.6382 20.1907 33.3053 16.1434 38.1777 16.1434C40.9631 16.1434 43.231 17.0409 44.7754 18.4834C46.2969 19.9044 47.2619 21.9851 47.2619 24.7014C47.2619 26.8215 46.469 29.1934 45.0468 31.8445C43.6316 34.4825 41.7105 37.1887 39.6673 39.9752C39.3877 40.3564 39.1055 40.7396 38.8222 41.1243C37.0726 43.5001 35.2818 45.9317 33.8333 48.2851C33.4508 48.9065 33.0824 49.5373 32.7382 50.1753C32.5285 49.7174 32.3096 49.2626 32.0842 48.8112C31.1862 47.0126 30.1213 45.1476 29.064 43.2961C28.6415 42.5561 28.2201 41.8183 27.8112 41.0877C24.861 35.817 22.3408 30.5434 22.3408 24.739C22.3408 14.1984 30.497 8.49902 38.1777 8.49902C42.3191 8.49902 46.4406 9.82125 49.4853 12.4386C52.4747 15.0085 54.5592 18.9335 54.5592 24.5131C54.5592 30.9585 51.7975 35.4143 48.5022 40.7311C48.4306 40.8466 48.3587 40.9625 48.2866 41.0789C45.1891 46.0794 41.8063 51.7178 41.0743 59.9017H33.1858C32.5382 59.9017 31.9245 60.2014 31.5122 60.7189C31.0998 61.2365 30.932 61.9178 31.0546 62.5769L32.0348 67.8488Z", fillRule: "evenodd", clipRule: "evenodd" }, { d: "M41.1547 70.6428C41.1547 72.7023 39.6065 73.2035 37.6967 73.2035C35.7868 73.2035 34.2386 72.7023 34.2386 70.6428H41.1547Z" }, { d: "M45.3289 28.7231C45.4774 28.3343 45.2937 27.8944 44.9186 27.7405L42.3201 26.6745C41.945 26.5206 41.5206 26.7111 41.3721 27.0998C41.2237 27.4886 41.4074 27.9285 41.7825 28.0823L44.381 29.1484C44.7561 29.3022 45.1805 29.1118 45.3289 28.7231Z", fillRule: "evenodd", clipRule: "evenodd" }, { d: "M31.4505 29.2716C31.6184 29.6518 32.0518 29.819 32.4186 29.6451L34.96 28.44C35.3268 28.2661 35.4881 27.8169 35.3203 27.4367C35.1525 27.0565 34.7191 26.8893 34.3522 27.0632L31.8109 28.2682C31.444 28.4422 31.2827 28.8914 31.4505 29.2716Z", fillRule: "evenodd", clipRule: "evenodd" }, { d: "M35.3 24.9243C35.4287 24.528 35.223 24.0987 34.8407 23.9653L32.1921 23.0417C31.8098 22.9084 31.3955 23.1215 31.2669 23.5178C31.1382 23.9141 31.3439 24.3434 31.7262 24.4768L34.3748 25.4004C34.7571 25.5337 35.1714 25.3206 35.3 24.9243Z", fillRule: "evenodd", clipRule: "evenodd" }, { d: "M36.7911 23.1649C37.1695 23.0199 37.3629 22.5845 37.223 22.1923L36.2535 19.474C36.1137 19.0818 35.6936 18.8814 35.3152 19.0263C34.9368 19.1713 34.7434 19.6067 34.8833 19.9989L35.8528 22.7173C35.9926 23.1094 36.4127 23.3098 36.7911 23.1649Z", fillRule: "evenodd", clipRule: "evenodd" }, { d: "M39.5322 23.0163C39.911 23.1602 40.3305 22.9585 40.4693 22.5659L41.4314 19.8448C41.5702 19.4522 41.3757 19.0173 40.9969 18.8735C40.6181 18.7296 40.1986 18.9313 40.0598 19.3238L39.0977 22.045C38.9589 22.4376 39.1534 22.8724 39.5322 23.0163Z", fillRule: "evenodd", clipRule: "evenodd" }, { d: "M41.3214 24.7192C41.4951 25.0965 41.9311 25.2564 42.2952 25.0763L44.8173 23.8284C45.1813 23.6483 45.3356 23.1964 45.1618 22.8191C44.988 22.4418 44.552 22.2819 44.1879 22.4621L41.6659 23.7099C41.3018 23.89 41.1476 24.3419 41.3214 24.7192Z", fillRule: "evenodd", clipRule: "evenodd" }] });
|
|
@@ -8075,12 +8233,12 @@ var EVENT_TYPE_ICONS = {
|
|
|
8075
8233
|
};
|
|
8076
8234
|
function EventTypeIcon({ type, ...props }) {
|
|
8077
8235
|
const Icon = (type != null ? EVENT_TYPE_ICONS[String(type).trim().toLowerCase()] : void 0) ?? EVENT_TYPE_FALLBACK_ICON;
|
|
8078
|
-
return /* @__PURE__ */
|
|
8236
|
+
return /* @__PURE__ */ jsx24(Icon, { ...props });
|
|
8079
8237
|
}
|
|
8080
8238
|
EventTypeIcon.displayName = "EventTypeIcon";
|
|
8081
8239
|
|
|
8082
8240
|
// src/components/EventListItem/EventListItem.tsx
|
|
8083
|
-
import { jsx as
|
|
8241
|
+
import { jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
8084
8242
|
function EventListItem({
|
|
8085
8243
|
username,
|
|
8086
8244
|
message,
|
|
@@ -8101,7 +8259,7 @@ function EventListItem({
|
|
|
8101
8259
|
onUsernameClick,
|
|
8102
8260
|
className
|
|
8103
8261
|
}) {
|
|
8104
|
-
const resolvedAlertIcon = alertIcon ?? (eventType !== void 0 ? /* @__PURE__ */
|
|
8262
|
+
const resolvedAlertIcon = alertIcon ?? (eventType !== void 0 ? /* @__PURE__ */ jsx25(EventTypeIcon, { type: eventType }) : null);
|
|
8105
8263
|
const style = {};
|
|
8106
8264
|
if (accentColor) {
|
|
8107
8265
|
style.borderLeftColor = accentColor;
|
|
@@ -8109,13 +8267,13 @@ function EventListItem({
|
|
|
8109
8267
|
if (colorFullBackground && accentColor) {
|
|
8110
8268
|
style.backgroundColor = `color-mix(in srgb, ${accentColor} 22%, var(--cardbackground, var(--neutralDark2, #211d3e)))`;
|
|
8111
8269
|
}
|
|
8112
|
-
return /* @__PURE__ */ jsxs14("div", { className:
|
|
8270
|
+
return /* @__PURE__ */ jsxs14("div", { className: classNames12("ls-eventlist-item", className), style, children: [
|
|
8113
8271
|
/* @__PURE__ */ jsxs14("div", { className: "ls-eventlist-item__main", children: [
|
|
8114
8272
|
/* @__PURE__ */ jsxs14("div", { className: "ls-eventlist-item__identity", children: [
|
|
8115
|
-
/* @__PURE__ */
|
|
8273
|
+
/* @__PURE__ */ jsx25(
|
|
8116
8274
|
"span",
|
|
8117
8275
|
{
|
|
8118
|
-
className:
|
|
8276
|
+
className: classNames12("ls-eventlist-item__username", { "ls-eventlist-item__username--clickable": onUsernameClick }),
|
|
8119
8277
|
role: onUsernameClick ? "button" : void 0,
|
|
8120
8278
|
tabIndex: onUsernameClick ? 0 : void 0,
|
|
8121
8279
|
onClick: onUsernameClick,
|
|
@@ -8128,9 +8286,9 @@ function EventListItem({
|
|
|
8128
8286
|
children: username
|
|
8129
8287
|
}
|
|
8130
8288
|
),
|
|
8131
|
-
platformIcon ? /* @__PURE__ */
|
|
8132
|
-
showAvatar && (avatar || fallbackAvatar) ? /* @__PURE__ */
|
|
8133
|
-
resolvedAlertIcon ? /* @__PURE__ */
|
|
8289
|
+
platformIcon ? /* @__PURE__ */ jsx25("span", { className: "ls-eventlist-item__icon", children: platformIcon }) : null,
|
|
8290
|
+
showAvatar && (avatar || fallbackAvatar) ? /* @__PURE__ */ jsx25("span", { className: "ls-eventlist-item__avatar", children: /* @__PURE__ */ jsx25("img", { src: avatar || fallbackAvatar, alt: "" }) }) : null,
|
|
8291
|
+
resolvedAlertIcon ? /* @__PURE__ */ jsx25(
|
|
8134
8292
|
"span",
|
|
8135
8293
|
{
|
|
8136
8294
|
className: "ls-eventlist-item__icon",
|
|
@@ -8138,27 +8296,27 @@ function EventListItem({
|
|
|
8138
8296
|
children: resolvedAlertIcon
|
|
8139
8297
|
}
|
|
8140
8298
|
) : null,
|
|
8141
|
-
amountBadge != null ? /* @__PURE__ */
|
|
8299
|
+
amountBadge != null ? /* @__PURE__ */ jsx25("span", { className: "ls-eventlist-item__amount", style: accentColor ? { color: accentColor } : void 0, children: amountBadge }) : null
|
|
8142
8300
|
] }),
|
|
8143
8301
|
/* @__PURE__ */ jsxs14("div", { className: "ls-eventlist-item__body", children: [
|
|
8144
|
-
message ? /* @__PURE__ */
|
|
8302
|
+
message ? /* @__PURE__ */ jsx25("span", { className: "ls-eventlist-item__message", children: message }) : null,
|
|
8145
8303
|
showMessage && userMessage ? /* @__PURE__ */ jsxs14("span", { className: "ls-eventlist-item__usermessage", children: [
|
|
8146
8304
|
"\u201C",
|
|
8147
8305
|
userMessage,
|
|
8148
8306
|
"\u201D"
|
|
8149
8307
|
] }) : null
|
|
8150
8308
|
] }),
|
|
8151
|
-
showTimestamp && timestamp ? /* @__PURE__ */
|
|
8309
|
+
showTimestamp && timestamp ? /* @__PURE__ */ jsx25("span", { className: "ls-eventlist-item__time", children: timestamp }) : null
|
|
8152
8310
|
] }),
|
|
8153
|
-
actions ? /* @__PURE__ */
|
|
8311
|
+
actions ? /* @__PURE__ */ jsx25("div", { className: "ls-eventlist-item__actions", children: actions }) : null
|
|
8154
8312
|
] });
|
|
8155
8313
|
}
|
|
8156
8314
|
EventListItem.displayName = "EventListItem";
|
|
8157
8315
|
|
|
8158
8316
|
// src/components/EventList/EventList.tsx
|
|
8159
8317
|
import { useEffect as useEffect7, useRef as useRef7 } from "react";
|
|
8160
|
-
import
|
|
8161
|
-
import { jsx as
|
|
8318
|
+
import classNames13 from "classnames";
|
|
8319
|
+
import { jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
8162
8320
|
var PIN_THRESHOLD = 24;
|
|
8163
8321
|
function EventList({
|
|
8164
8322
|
items,
|
|
@@ -8202,17 +8360,17 @@ function EventList({
|
|
|
8202
8360
|
onEndReached();
|
|
8203
8361
|
}
|
|
8204
8362
|
};
|
|
8205
|
-
return /* @__PURE__ */
|
|
8206
|
-
emptyIcon ? /* @__PURE__ */
|
|
8207
|
-
/* @__PURE__ */
|
|
8208
|
-
] }) : /* @__PURE__ */
|
|
8363
|
+
return /* @__PURE__ */ jsx26("div", { className: classNames13("ls-eventlist", className), id, children: items.length === 0 ? /* @__PURE__ */ jsxs15("div", { className: classNames13("ls-eventlist__empty", emptyClassName), children: [
|
|
8364
|
+
emptyIcon ? /* @__PURE__ */ jsx26("span", { className: "ls-eventlist__empty-icon", children: emptyIcon }) : null,
|
|
8365
|
+
/* @__PURE__ */ jsx26("span", { children: emptyText })
|
|
8366
|
+
] }) : /* @__PURE__ */ jsx26(
|
|
8209
8367
|
"div",
|
|
8210
8368
|
{
|
|
8211
8369
|
className: "ls-eventlist__list",
|
|
8212
8370
|
ref: listRef,
|
|
8213
8371
|
onScroll: handleScroll,
|
|
8214
8372
|
style: itemGap != null ? { gap: typeof itemGap === "number" ? `${itemGap}px` : itemGap } : void 0,
|
|
8215
|
-
children: items.map((item) => /* @__PURE__ */
|
|
8373
|
+
children: items.map((item) => /* @__PURE__ */ jsx26("div", { className: "ls-eventlist__row", children: /* @__PURE__ */ jsx26(
|
|
8216
8374
|
EventListItem,
|
|
8217
8375
|
{
|
|
8218
8376
|
username: item.username,
|
|
@@ -8221,7 +8379,7 @@ function EventList({
|
|
|
8221
8379
|
avatar: item.avatar,
|
|
8222
8380
|
fallbackAvatar: item.fallbackAvatar ?? fallbackAvatar,
|
|
8223
8381
|
timestamp: item.timestamp,
|
|
8224
|
-
platformIcon: showPlatformIcons ? item.platformIcon ?? (item.platform ? /* @__PURE__ */
|
|
8382
|
+
platformIcon: showPlatformIcons ? item.platformIcon ?? (item.platform ? /* @__PURE__ */ jsx26(PlatformIcon, { platform: item.platform }) : void 0) : void 0,
|
|
8225
8383
|
alertIcon: item.alertIcon,
|
|
8226
8384
|
amountBadge: item.amountBadge,
|
|
8227
8385
|
eventType: item.eventType,
|
|
@@ -8240,9 +8398,9 @@ function EventList({
|
|
|
8240
8398
|
EventList.displayName = "EventList";
|
|
8241
8399
|
|
|
8242
8400
|
// src/components/StreamStatusPanel/StreamStatusPanel.tsx
|
|
8243
|
-
import
|
|
8244
|
-
import
|
|
8245
|
-
import { Fragment as Fragment7, jsx as
|
|
8401
|
+
import Tooltip5 from "@mui/material/Tooltip";
|
|
8402
|
+
import classNames14 from "classnames";
|
|
8403
|
+
import { Fragment as Fragment7, jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
8246
8404
|
var LS_INFO_TOOLTIP_SX = {
|
|
8247
8405
|
backgroundColor: "#1b1834",
|
|
8248
8406
|
border: "1px solid #393853",
|
|
@@ -8255,8 +8413,8 @@ var LS_INFO_TOOLTIP_SX = {
|
|
|
8255
8413
|
boxShadow: "0 10px 30px rgba(0, 0, 0, 0.45)"
|
|
8256
8414
|
};
|
|
8257
8415
|
var formatStatValue = (value) => value >= 1e3 ? `${value.toString().slice(0, -3)} K` : value.toString();
|
|
8258
|
-
var TrendUpArrow = () => /* @__PURE__ */
|
|
8259
|
-
var TrendDownArrow = () => /* @__PURE__ */
|
|
8416
|
+
var TrendUpArrow = () => /* @__PURE__ */ jsx27("svg", { viewBox: "0 0 8 8", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx27("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.50059 8C3.36798 8 3.2408 7.94732 3.14704 7.85355C3.05327 7.75978 3.00059 7.63261 3.00059 7.5L3.00059 1.707L0.854589 3.854C0.808102 3.90049 0.752912 3.93736 0.692173 3.96252C0.631433 3.98768 0.566333 4.00063 0.500589 4.00063C0.434845 4.00063 0.369745 3.98768 0.309006 3.96252C0.248266 3.93736 0.193077 3.90049 0.146589 3.854C0.100101 3.80751 0.0632247 3.75232 0.0380658 3.69158C0.0129069 3.63084 -4.20509e-05 3.56574 -4.20451e-05 3.5C-4.20394e-05 3.43426 0.012907 3.36916 0.0380658 3.30842C0.0632247 3.24768 0.100101 3.19249 0.146589 3.146L3.14659 0.146C3.19304 0.0994364 3.24821 0.0624939 3.30896 0.0372874C3.3697 0.0120808 3.43482 -0.000893905 3.50059 -0.000893899C3.56636 -0.000893893 3.63148 0.0120809 3.69222 0.0372874C3.75297 0.062494 3.80814 0.0994365 3.85459 0.146L6.85459 3.146C6.90108 3.19249 6.93795 3.24768 6.96311 3.30842C6.98827 3.36916 7.00122 3.43426 7.00122 3.5C7.00122 3.56574 6.98827 3.63084 6.96311 3.69158C6.93795 3.75232 6.90108 3.80751 6.85459 3.854C6.7607 3.94789 6.63336 4.00063 6.50059 4.00063C6.43485 4.00063 6.36975 3.98768 6.30901 3.96252C6.24827 3.93736 6.19308 3.90049 6.14659 3.854L4.00059 1.707L4.00059 7.5C4.00059 7.63261 3.94791 7.75978 3.85414 7.85355C3.76037 7.94732 3.6332 8 3.50059 8Z", fill: "currentColor" }) });
|
|
8417
|
+
var TrendDownArrow = () => /* @__PURE__ */ jsx27("svg", { viewBox: "0 0 8 8", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx27("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.50063 0C3.63324 0 3.76042 0.0526785 3.85419 0.146447C3.94795 0.240215 4.00063 0.367392 4.00063 0.5L4.00063 6.293L6.14663 4.146C6.19312 4.09951 6.24831 4.06264 6.30905 4.03748C6.36979 4.01232 6.43489 3.99937 6.50063 3.99937C6.56638 3.99937 6.63148 4.01232 6.69222 4.03748C6.75295 4.06264 6.80814 4.09951 6.85463 4.146C6.90112 4.19249 6.938 4.24768 6.96316 4.30842C6.98831 4.36916 7.00126 4.43426 7.00126 4.5C7.00126 4.56574 6.98831 4.63084 6.96316 4.69158C6.938 4.75232 6.90112 4.80751 6.85463 4.854L3.85463 7.854C3.80819 7.90056 3.75301 7.93751 3.69227 7.96271C3.63152 7.98792 3.5664 8.00089 3.50063 8.00089C3.43486 8.00089 3.36974 7.98792 3.309 7.96271C3.24825 7.93751 3.19308 7.90056 3.14663 7.854L0.146632 4.854C0.100144 4.80751 0.0632674 4.75232 0.0381083 4.69158C0.0129493 4.63084 0 4.56574 0 4.5C0 4.43426 0.0129493 4.36916 0.0381083 4.30842C0.0632674 4.24768 0.100144 4.19249 0.146632 4.146C0.240518 4.05211 0.367856 3.99937 0.500632 3.99937C0.566376 3.99937 0.631476 4.01232 0.692215 4.03748C0.752955 4.06264 0.808144 4.09951 0.854632 4.146L3.00063 6.293L3.00063 0.5C3.00063 0.367392 3.05331 0.240215 3.14708 0.146447C3.24085 0.0526785 3.36802 0 3.50063 0Z", fill: "currentColor" }) });
|
|
8260
8418
|
function StreamStatusPanel({
|
|
8261
8419
|
online = false,
|
|
8262
8420
|
statusLabel,
|
|
@@ -8280,20 +8438,20 @@ function StreamStatusPanel({
|
|
|
8280
8438
|
const hasTotal = totalValue != null;
|
|
8281
8439
|
const hasPlatforms = platforms != null;
|
|
8282
8440
|
const hasStats = stats.length > 0;
|
|
8283
|
-
const infoTooltip = (node, tip) => tip != null ? /* @__PURE__ */
|
|
8441
|
+
const infoTooltip = (node, tip) => tip != null ? /* @__PURE__ */ jsx27(Tooltip5, { title: tip, placement: "top", enterDelay: 120, slotProps: { tooltip: { sx: LS_INFO_TOOLTIP_SX } }, children: node }) : node;
|
|
8284
8442
|
if (!hasStatus && !hasTotal && !hasPlatforms && !hasStats) {
|
|
8285
|
-
return /* @__PURE__ */
|
|
8443
|
+
return /* @__PURE__ */ jsx27("div", { className: classNames14("ls-streamstatus", "ls-streamstatus--empty", className), id, children: emptyText });
|
|
8286
8444
|
}
|
|
8287
|
-
return /* @__PURE__ */ jsxs16("div", { className:
|
|
8445
|
+
return /* @__PURE__ */ jsxs16("div", { className: classNames14("ls-streamstatus", className), id, children: [
|
|
8288
8446
|
hasStatus ? infoTooltip(
|
|
8289
|
-
/* @__PURE__ */
|
|
8447
|
+
/* @__PURE__ */ jsx27("div", { className: "ls-streamstatus__status", style: statusTooltip != null ? { cursor: "help" } : void 0, children: statusSlot ?? /* @__PURE__ */ jsxs16(Fragment7, { children: [
|
|
8290
8448
|
/* @__PURE__ */ jsxs16("span", { className: "ls-streamstatus__indicator", children: [
|
|
8291
|
-
online ? /* @__PURE__ */
|
|
8292
|
-
/* @__PURE__ */
|
|
8449
|
+
online ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__indicator-ping" }) : null,
|
|
8450
|
+
/* @__PURE__ */ jsx27("span", { className: classNames14("ls-streamstatus__indicator-dot", { "ls-streamstatus__indicator-dot--online": online }) })
|
|
8293
8451
|
] }),
|
|
8294
8452
|
/* @__PURE__ */ jsxs16("span", { className: "ls-streamstatus__status-body", children: [
|
|
8295
|
-
/* @__PURE__ */
|
|
8296
|
-
statusSublabel != null ? /* @__PURE__ */
|
|
8453
|
+
/* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__status-label", children: statusLabel }),
|
|
8454
|
+
statusSublabel != null ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__status-sublabel", children: statusSublabel }) : null
|
|
8297
8455
|
] })
|
|
8298
8456
|
] }) }),
|
|
8299
8457
|
statusTooltip
|
|
@@ -8301,49 +8459,49 @@ function StreamStatusPanel({
|
|
|
8301
8459
|
hasTotal || hasPlatforms ? /* @__PURE__ */ jsxs16("div", { className: "ls-streamstatus__overview", children: [
|
|
8302
8460
|
hasTotal ? infoTooltip(
|
|
8303
8461
|
/* @__PURE__ */ jsxs16("div", { className: "ls-streamstatus__total", style: totalTooltip != null ? { cursor: "help" } : void 0, children: [
|
|
8304
|
-
/* @__PURE__ */
|
|
8305
|
-
totalLabel != null ? /* @__PURE__ */
|
|
8462
|
+
/* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__total-value", style: totalAccentColor ? { color: totalAccentColor } : void 0, children: totalValue }),
|
|
8463
|
+
totalLabel != null ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__total-label", children: totalLabel }) : null
|
|
8306
8464
|
] }),
|
|
8307
8465
|
totalTooltip
|
|
8308
8466
|
) : null,
|
|
8309
|
-
hasPlatforms ? /* @__PURE__ */
|
|
8467
|
+
hasPlatforms ? /* @__PURE__ */ jsx27("div", { className: "ls-streamstatus__platforms", children: platforms.length === 0 ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__platforms-empty", children: platformsEmptyText }) : platforms.map((platform) => /* @__PURE__ */ jsxs16("div", { className: "ls-streamstatus__platform", children: [
|
|
8310
8468
|
/* @__PURE__ */ jsxs16("span", { className: "ls-streamstatus__platform-info", children: [
|
|
8311
|
-
platform.icon != null ? /* @__PURE__ */
|
|
8469
|
+
platform.icon != null ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__platform-icon", children: platform.icon }) : getPlatformIconUrl(String(platform.id)) ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__platform-icon", children: /* @__PURE__ */ jsx27(PlatformIcon, { platform: String(platform.id) }) }) : /* @__PURE__ */ jsx27(
|
|
8312
8470
|
"span",
|
|
8313
8471
|
{
|
|
8314
8472
|
className: "ls-streamstatus__platform-dot",
|
|
8315
8473
|
style: platform.accentColor ? { backgroundColor: platform.accentColor } : void 0
|
|
8316
8474
|
}
|
|
8317
8475
|
),
|
|
8318
|
-
/* @__PURE__ */
|
|
8476
|
+
/* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__platform-label", children: platform.label })
|
|
8319
8477
|
] }),
|
|
8320
|
-
/* @__PURE__ */
|
|
8478
|
+
/* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__platform-value", children: platform.value })
|
|
8321
8479
|
] }, platform.id)) }) : null
|
|
8322
8480
|
] }) : null,
|
|
8323
|
-
hasStats ? /* @__PURE__ */
|
|
8481
|
+
hasStats ? /* @__PURE__ */ jsx27(
|
|
8324
8482
|
"div",
|
|
8325
8483
|
{
|
|
8326
8484
|
className: "ls-streamstatus__stats",
|
|
8327
8485
|
style: statsColumns ? { gridTemplateColumns: `repeat(${statsColumns}, minmax(0, 1fr))` } : void 0,
|
|
8328
8486
|
children: stats.map((stat) => {
|
|
8329
|
-
const label = stat.label != null ? /* @__PURE__ */
|
|
8487
|
+
const label = stat.label != null ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__stat-label", children: stat.label }) : null;
|
|
8330
8488
|
const showHead = stat.icon != null || stat.actions != null || statsLabelPosition === "top" && label != null;
|
|
8331
8489
|
const displayValue = typeof stat.value === "number" ? formatStatValue(stat.value) : stat.value;
|
|
8332
8490
|
const trend = typeof stat.value === "number" && stat.previousValue != null ? stat.value - stat.previousValue >= 0 ? "up" : "down" : void 0;
|
|
8333
8491
|
const node = /* @__PURE__ */ jsxs16("div", { className: "ls-streamstatus__stat", style: stat.tooltip != null ? { cursor: "help" } : void 0, children: [
|
|
8334
8492
|
showHead ? /* @__PURE__ */ jsxs16("div", { className: "ls-streamstatus__stat-head", children: [
|
|
8335
|
-
stat.icon != null ? /* @__PURE__ */
|
|
8493
|
+
stat.icon != null ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__stat-icon", children: stat.icon }) : null,
|
|
8336
8494
|
statsLabelPosition === "top" ? label : null,
|
|
8337
|
-
stat.actions != null ? /* @__PURE__ */
|
|
8495
|
+
stat.actions != null ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__stat-actions", children: stat.actions }) : null
|
|
8338
8496
|
] }) : null,
|
|
8339
|
-
/* @__PURE__ */
|
|
8497
|
+
/* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__stat-value", style: stat.accentColor ? { color: stat.accentColor } : void 0, children: trend ? /* @__PURE__ */ jsxs16("span", { className: "ls-streamstatus__stat-trendrow", children: [
|
|
8340
8498
|
displayValue,
|
|
8341
|
-
trend === "up" ? /* @__PURE__ */
|
|
8499
|
+
trend === "up" ? /* @__PURE__ */ jsx27(TrendUpArrow, {}) : /* @__PURE__ */ jsx27(TrendDownArrow, {})
|
|
8342
8500
|
] }) : displayValue }),
|
|
8343
8501
|
statsLabelPosition === "bottom" ? label : null,
|
|
8344
|
-
stat.sub != null ? /* @__PURE__ */
|
|
8502
|
+
stat.sub != null ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__stat-sub", children: stat.sub }) : null
|
|
8345
8503
|
] }, stat.id);
|
|
8346
|
-
return stat.tooltip != null ? /* @__PURE__ */
|
|
8504
|
+
return stat.tooltip != null ? /* @__PURE__ */ jsx27(Tooltip5, { title: stat.tooltip, placement: "top", enterDelay: 120, slotProps: { tooltip: { sx: LS_INFO_TOOLTIP_SX } }, children: node }, stat.id) : node;
|
|
8347
8505
|
})
|
|
8348
8506
|
}
|
|
8349
8507
|
) : null
|
|
@@ -8354,8 +8512,8 @@ StreamStatusPanel.displayName = "StreamStatusPanel";
|
|
|
8354
8512
|
// src/components/ViewersList/ViewersList.tsx
|
|
8355
8513
|
import * as React from "react";
|
|
8356
8514
|
import { useMemo as useMemo5, useState as useState9 } from "react";
|
|
8357
|
-
import
|
|
8358
|
-
import { jsx as
|
|
8515
|
+
import classNames15 from "classnames";
|
|
8516
|
+
import { jsx as jsx28, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
8359
8517
|
function ViewersList({
|
|
8360
8518
|
viewers,
|
|
8361
8519
|
groups,
|
|
@@ -8388,28 +8546,28 @@ function ViewersList({
|
|
|
8388
8546
|
return [...grouped, { key: "", viewers: rest }].filter((section) => section.viewers.length > 0);
|
|
8389
8547
|
}, [groups, filtered]);
|
|
8390
8548
|
const showHead = countLabel != null || searchSlot != null || internalSearch;
|
|
8391
|
-
return /* @__PURE__ */ jsxs17("div", { className:
|
|
8549
|
+
return /* @__PURE__ */ jsxs17("div", { className: classNames15("ls-viewerslist", className), id, children: [
|
|
8392
8550
|
showHead ? /* @__PURE__ */ jsxs17("div", { className: "ls-viewerslist__head", children: [
|
|
8393
|
-
countLabel != null ? /* @__PURE__ */
|
|
8394
|
-
searchSlot ? /* @__PURE__ */
|
|
8395
|
-
internalSearch ? /* @__PURE__ */
|
|
8551
|
+
countLabel != null ? /* @__PURE__ */ jsx28("span", { className: "ls-viewerslist__count", children: countLabel }) : null,
|
|
8552
|
+
searchSlot ? /* @__PURE__ */ jsx28("div", { className: "ls-viewerslist__search-slot", children: searchSlot }) : null,
|
|
8553
|
+
internalSearch ? /* @__PURE__ */ jsx28("input", { className: "ls-viewerslist__search", value: query, placeholder: searchPlaceholder, onChange: (e) => setQuery(e.target.value) }) : null
|
|
8396
8554
|
] }) : null,
|
|
8397
|
-
hint != null ? /* @__PURE__ */
|
|
8555
|
+
hint != null ? /* @__PURE__ */ jsx28("div", { className: "ls-viewerslist__hint", children: hint }) : null,
|
|
8398
8556
|
filtered.length === 0 ? /* @__PURE__ */ jsxs17("div", { className: "ls-viewerslist__empty", children: [
|
|
8399
|
-
emptyIcon ? /* @__PURE__ */
|
|
8400
|
-
/* @__PURE__ */
|
|
8401
|
-
] }) : /* @__PURE__ */
|
|
8402
|
-
section.label != null ? /* @__PURE__ */
|
|
8557
|
+
emptyIcon ? /* @__PURE__ */ jsx28("span", { className: "ls-viewerslist__empty-icon", children: emptyIcon }) : null,
|
|
8558
|
+
/* @__PURE__ */ jsx28("span", { children: emptyText })
|
|
8559
|
+
] }) : /* @__PURE__ */ jsx28("div", { className: "ls-viewerslist__list", children: sections.map((section) => /* @__PURE__ */ jsxs17(React.Fragment, { children: [
|
|
8560
|
+
section.label != null ? /* @__PURE__ */ jsx28("div", { className: "ls-viewerslist__group", children: section.label }) : null,
|
|
8403
8561
|
section.viewers.map((viewer) => {
|
|
8404
8562
|
const avatarSrc = viewer.avatar || viewer.fallbackAvatar || fallbackAvatar;
|
|
8405
|
-
const platformIcon = viewer.platformIcon ?? (viewer.platform ? /* @__PURE__ */
|
|
8563
|
+
const platformIcon = viewer.platformIcon ?? (viewer.platform ? /* @__PURE__ */ jsx28(PlatformIcon, { platform: viewer.platform }) : null);
|
|
8406
8564
|
return /* @__PURE__ */ jsxs17("div", { className: "ls-viewerslist__viewer", children: [
|
|
8407
|
-
showAvatars && avatarSrc ? /* @__PURE__ */
|
|
8408
|
-
platformIcon != null ? /* @__PURE__ */
|
|
8409
|
-
/* @__PURE__ */
|
|
8565
|
+
showAvatars && avatarSrc ? /* @__PURE__ */ jsx28("img", { className: "ls-viewerslist__avatar", src: avatarSrc, alt: "" }) : null,
|
|
8566
|
+
platformIcon != null ? /* @__PURE__ */ jsx28("span", { className: "ls-viewerslist__platform", children: platformIcon }) : null,
|
|
8567
|
+
/* @__PURE__ */ jsx28(
|
|
8410
8568
|
"span",
|
|
8411
8569
|
{
|
|
8412
|
-
className:
|
|
8570
|
+
className: classNames15("ls-viewerslist__username", { "ls-viewerslist__username--clickable": onUsernameClick }),
|
|
8413
8571
|
title: viewer.username,
|
|
8414
8572
|
role: onUsernameClick ? "button" : void 0,
|
|
8415
8573
|
tabIndex: onUsernameClick ? 0 : void 0,
|
|
@@ -8423,8 +8581,8 @@ function ViewersList({
|
|
|
8423
8581
|
children: viewer.username
|
|
8424
8582
|
}
|
|
8425
8583
|
),
|
|
8426
|
-
viewer.badges != null ? /* @__PURE__ */
|
|
8427
|
-
viewer.actions != null ? /* @__PURE__ */
|
|
8584
|
+
viewer.badges != null ? /* @__PURE__ */ jsx28("span", { className: "ls-viewerslist__badges", children: viewer.badges }) : null,
|
|
8585
|
+
viewer.actions != null ? /* @__PURE__ */ jsx28("span", { className: "ls-viewerslist__actions", children: viewer.actions }) : null
|
|
8428
8586
|
] }, viewer.id);
|
|
8429
8587
|
})
|
|
8430
8588
|
] }, section.key || "__ungrouped")) })
|
|
@@ -8433,8 +8591,8 @@ function ViewersList({
|
|
|
8433
8591
|
ViewersList.displayName = "ViewersList";
|
|
8434
8592
|
|
|
8435
8593
|
// src/components/ShortcutDockGrid/ShortcutDockGrid.tsx
|
|
8436
|
-
import
|
|
8437
|
-
import { Fragment as Fragment9, jsx as
|
|
8594
|
+
import classNames16 from "classnames";
|
|
8595
|
+
import { Fragment as Fragment9, jsx as jsx29, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
8438
8596
|
var softAccent = (color) => /^#[0-9a-fA-F]{6}$/.test(color) ? `${color}66` : color;
|
|
8439
8597
|
function ShortcutDockGrid({
|
|
8440
8598
|
buttons,
|
|
@@ -8460,7 +8618,7 @@ function ShortcutDockGrid({
|
|
|
8460
8618
|
return /* @__PURE__ */ jsxs18(
|
|
8461
8619
|
"div",
|
|
8462
8620
|
{
|
|
8463
|
-
className:
|
|
8621
|
+
className: classNames16(
|
|
8464
8622
|
"ls-shortcutdock",
|
|
8465
8623
|
{ "ls-shortcutdock--disabled": disabled, "ls-shortcutdock--readonly": readOnly },
|
|
8466
8624
|
className
|
|
@@ -8471,7 +8629,7 @@ function ShortcutDockGrid({
|
|
|
8471
8629
|
gridAutoRows: rowHeight ? `${rowHeight}px` : "auto"
|
|
8472
8630
|
},
|
|
8473
8631
|
children: [
|
|
8474
|
-
buttons.length === 0 && !showAdd && emptyText != null ? /* @__PURE__ */
|
|
8632
|
+
buttons.length === 0 && !showAdd && emptyText != null ? /* @__PURE__ */ jsx29("div", { className: "ls-shortcutdock__empty", children: emptyText }) : null,
|
|
8475
8633
|
buttons.map((button) => {
|
|
8476
8634
|
const large = (button.w ?? 1) > 1 || (button.h ?? 1) > 1;
|
|
8477
8635
|
const selected = selectedId != null && selectedId === button.id;
|
|
@@ -8482,11 +8640,11 @@ function ShortcutDockGrid({
|
|
|
8482
8640
|
...rowHeight ? {} : { minHeight: minButtonSize },
|
|
8483
8641
|
...colored ? { ["--ls-shortcutdock-accent"]: button.color, ["--ls-shortcutdock-accent-soft"]: softAccent(button.color) } : {}
|
|
8484
8642
|
};
|
|
8485
|
-
const node = /* @__PURE__ */
|
|
8643
|
+
const node = /* @__PURE__ */ jsx29(
|
|
8486
8644
|
"button",
|
|
8487
8645
|
{
|
|
8488
8646
|
type: "button",
|
|
8489
|
-
className:
|
|
8647
|
+
className: classNames16("ls-shortcutdock__btn", {
|
|
8490
8648
|
"ls-shortcutdock__btn--selected": selected,
|
|
8491
8649
|
"ls-shortcutdock__btn--colored": colored && !selected,
|
|
8492
8650
|
"ls-shortcutdock__btn--icon-only": button.label == null && button.content == null,
|
|
@@ -8499,17 +8657,17 @@ function ShortcutDockGrid({
|
|
|
8499
8657
|
}
|
|
8500
8658
|
},
|
|
8501
8659
|
children: button.content ?? /* @__PURE__ */ jsxs18(Fragment9, { children: [
|
|
8502
|
-
button.image ? /* @__PURE__ */
|
|
8503
|
-
button.label != null ? /* @__PURE__ */
|
|
8660
|
+
button.image ? /* @__PURE__ */ jsx29("img", { className: "ls-shortcutdock__btn-image", src: button.image, alt: "" }) : button.icon != null ? /* @__PURE__ */ jsx29("span", { className: "ls-shortcutdock__icon", children: button.icon }) : null,
|
|
8661
|
+
button.label != null ? /* @__PURE__ */ jsx29("span", { className: "ls-shortcutdock__label", children: button.label }) : null
|
|
8504
8662
|
] })
|
|
8505
8663
|
}
|
|
8506
8664
|
);
|
|
8507
8665
|
return /* @__PURE__ */ jsxs18("div", { className: "ls-shortcutdock__cell", style: cellStyle, title: button.title, children: [
|
|
8508
8666
|
renderButton ? renderButton(button, node) : node,
|
|
8509
|
-
editMode && onRemove ? /* @__PURE__ */
|
|
8667
|
+
editMode && onRemove ? /* @__PURE__ */ jsx29("button", { type: "button", className: "ls-shortcutdock__remove", title: removeTitle, onClick: () => onRemove(button.id), children: "\u2715" }) : null
|
|
8510
8668
|
] }, button.id);
|
|
8511
8669
|
}),
|
|
8512
|
-
showAdd ? /* @__PURE__ */
|
|
8670
|
+
showAdd ? /* @__PURE__ */ jsx29(
|
|
8513
8671
|
"button",
|
|
8514
8672
|
{
|
|
8515
8673
|
type: "button",
|
|
@@ -8527,9 +8685,9 @@ function ShortcutDockGrid({
|
|
|
8527
8685
|
ShortcutDockGrid.displayName = "ShortcutDockGrid";
|
|
8528
8686
|
|
|
8529
8687
|
// src/components/GoalsList/GoalsList.tsx
|
|
8530
|
-
import
|
|
8531
|
-
import
|
|
8532
|
-
import { Fragment as Fragment10, jsx as
|
|
8688
|
+
import Tooltip6 from "@mui/material/Tooltip";
|
|
8689
|
+
import classNames17 from "classnames";
|
|
8690
|
+
import { Fragment as Fragment10, jsx as jsx30, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
8533
8691
|
var GOAL_TOOLTIP_SX = {
|
|
8534
8692
|
backgroundColor: "#1b1834",
|
|
8535
8693
|
border: "1px solid #393853",
|
|
@@ -8553,7 +8711,7 @@ var resolvePercent = (goal) => {
|
|
|
8553
8711
|
};
|
|
8554
8712
|
function GoalsList({ goals, formatValue, showPercent = true, emptyText = "No goal data yet", id, className }) {
|
|
8555
8713
|
const fmt = (value, goal) => formatValue ? formatValue(value, goal) : value;
|
|
8556
|
-
return /* @__PURE__ */
|
|
8714
|
+
return /* @__PURE__ */ jsx30("div", { className: classNames17("ls-goals", className), id, children: goals.length === 0 ? /* @__PURE__ */ jsx30("div", { className: "ls-goals__empty", children: emptyText }) : goals.map((goal) => {
|
|
8557
8715
|
const percent = resolvePercent(goal);
|
|
8558
8716
|
const rowStyle = {
|
|
8559
8717
|
...goal.accentColor ? { ["--ls-goals-accent"]: goal.accentColor } : {},
|
|
@@ -8561,9 +8719,9 @@ function GoalsList({ goals, formatValue, showPercent = true, emptyText = "No goa
|
|
|
8561
8719
|
};
|
|
8562
8720
|
const node = /* @__PURE__ */ jsxs19("div", { className: "ls-goals__row", style: rowStyle, children: [
|
|
8563
8721
|
/* @__PURE__ */ jsxs19("div", { className: "ls-goals__head", children: [
|
|
8564
|
-
goal.icon != null ? /* @__PURE__ */
|
|
8565
|
-
/* @__PURE__ */
|
|
8566
|
-
/* @__PURE__ */
|
|
8722
|
+
goal.icon != null ? /* @__PURE__ */ jsx30("span", { className: "ls-goals__icon", children: goal.icon }) : null,
|
|
8723
|
+
/* @__PURE__ */ jsx30("span", { className: "ls-goals__label", children: goal.label }),
|
|
8724
|
+
/* @__PURE__ */ jsx30("span", { className: "ls-goals__value", children: goal.valueText ?? /* @__PURE__ */ jsxs19(Fragment10, { children: [
|
|
8567
8725
|
fmt(goal.current ?? 0, goal),
|
|
8568
8726
|
" ",
|
|
8569
8727
|
/* @__PURE__ */ jsxs19("span", { className: "ls-goals__target", children: [
|
|
@@ -8576,23 +8734,23 @@ function GoalsList({ goals, formatValue, showPercent = true, emptyText = "No goa
|
|
|
8576
8734
|
"%"
|
|
8577
8735
|
] }) : null
|
|
8578
8736
|
] }),
|
|
8579
|
-
/* @__PURE__ */
|
|
8737
|
+
/* @__PURE__ */ jsx30("div", { className: "ls-goals__bar", children: /* @__PURE__ */ jsx30("div", { className: "ls-goals__fill", style: { width: `${percent}%` } }) })
|
|
8580
8738
|
] }, goal.id);
|
|
8581
|
-
return goal.tooltip != null ? /* @__PURE__ */
|
|
8739
|
+
return goal.tooltip != null ? /* @__PURE__ */ jsx30(Tooltip6, { title: goal.tooltip, placement: "top", enterDelay: 120, slotProps: { tooltip: { sx: GOAL_TOOLTIP_SX } }, children: node }, goal.id) : node;
|
|
8582
8740
|
}) });
|
|
8583
8741
|
}
|
|
8584
8742
|
GoalsList.displayName = "GoalsList";
|
|
8585
8743
|
|
|
8586
8744
|
// src/components/ModQueueItem/ModQueueItem.tsx
|
|
8587
8745
|
import IconButton from "@mui/material/IconButton";
|
|
8588
|
-
import
|
|
8746
|
+
import classNames18 from "classnames";
|
|
8589
8747
|
|
|
8590
8748
|
// src/components/ModQueueItem/icons.tsx
|
|
8591
|
-
import { jsx as
|
|
8749
|
+
import { jsx as jsx31, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
8592
8750
|
function CrossBoxIcon({ className }) {
|
|
8593
8751
|
return /* @__PURE__ */ jsxs20("svg", { className, width: "21", height: "21", viewBox: "0 0 21 21", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
8594
|
-
/* @__PURE__ */
|
|
8595
|
-
/* @__PURE__ */
|
|
8752
|
+
/* @__PURE__ */ jsx31("rect", { x: "0.484367", y: "0.509025", width: "19.6005", height: "19.6005", rx: "3.43645", stroke: "#E76E6E", strokeWidth: "0.763655" }),
|
|
8753
|
+
/* @__PURE__ */ jsx31(
|
|
8596
8754
|
"path",
|
|
8597
8755
|
{
|
|
8598
8756
|
d: "M14.3571 7.71806L12.8756 6.23657L10.2843 8.82791L7.69292 6.23657L6.21143 7.71806L8.80276 10.3094L6.21143 12.9007L7.69292 14.3822L10.2843 11.7909L12.8756 14.3822L14.3571 12.9007L11.7657 10.3094L14.3571 7.71806Z",
|
|
@@ -8603,8 +8761,8 @@ function CrossBoxIcon({ className }) {
|
|
|
8603
8761
|
}
|
|
8604
8762
|
function TickBoxIcon({ className }) {
|
|
8605
8763
|
return /* @__PURE__ */ jsxs20("svg", { className, width: "22", height: "21", viewBox: "0 0 22 21", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
8606
|
-
/* @__PURE__ */
|
|
8607
|
-
/* @__PURE__ */
|
|
8764
|
+
/* @__PURE__ */ jsx31("rect", { x: "0.381828", y: "0.381828", width: "21.2296", height: "19.855", rx: "3.43645", stroke: "#93F0A2", strokeWidth: "0.763655" }),
|
|
8765
|
+
/* @__PURE__ */ jsx31(
|
|
8608
8766
|
"path",
|
|
8609
8767
|
{
|
|
8610
8768
|
d: "M14.8908 5.49829L9.85209 12.1414L6.87311 9.16455L5.49854 10.5391L10.0798 15.1203L16.4952 6.87287L14.8908 5.49829Z",
|
|
@@ -8615,7 +8773,7 @@ function TickBoxIcon({ className }) {
|
|
|
8615
8773
|
}
|
|
8616
8774
|
|
|
8617
8775
|
// src/components/ModQueueItem/ModQueueItem.tsx
|
|
8618
|
-
import { Fragment as Fragment11, jsx as
|
|
8776
|
+
import { Fragment as Fragment11, jsx as jsx32, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
8619
8777
|
function ModQueueItem({
|
|
8620
8778
|
username,
|
|
8621
8779
|
avatar,
|
|
@@ -8628,12 +8786,12 @@ function ModQueueItem({
|
|
|
8628
8786
|
onDeny,
|
|
8629
8787
|
className
|
|
8630
8788
|
}) {
|
|
8631
|
-
return /* @__PURE__ */ jsxs21("div", { className:
|
|
8632
|
-
icon ? /* @__PURE__ */
|
|
8789
|
+
return /* @__PURE__ */ jsxs21("div", { className: classNames18("ls-modqueue-item", className), children: [
|
|
8790
|
+
icon ? /* @__PURE__ */ jsx32("div", { className: "ls-modqueue-item__preview", children: icon }) : null,
|
|
8633
8791
|
/* @__PURE__ */ jsxs21("div", { className: "ls-modqueue-item__body", children: [
|
|
8634
8792
|
/* @__PURE__ */ jsxs21("div", { className: "ls-modqueue-item__head", children: [
|
|
8635
|
-
avatar || fallbackAvatar ? /* @__PURE__ */
|
|
8636
|
-
username ? /* @__PURE__ */
|
|
8793
|
+
avatar || fallbackAvatar ? /* @__PURE__ */ jsx32("img", { className: "ls-modqueue-item__avatar", src: avatar || fallbackAvatar, alt: "" }) : null,
|
|
8794
|
+
username ? /* @__PURE__ */ jsx32(
|
|
8637
8795
|
"span",
|
|
8638
8796
|
{
|
|
8639
8797
|
className: "ls-modqueue-item__username",
|
|
@@ -8641,7 +8799,7 @@ function ModQueueItem({
|
|
|
8641
8799
|
children: username
|
|
8642
8800
|
}
|
|
8643
8801
|
) : null,
|
|
8644
|
-
command ? /* @__PURE__ */
|
|
8802
|
+
command ? /* @__PURE__ */ jsx32("span", { className: "ls-modqueue-item__command", children: command }) : null
|
|
8645
8803
|
] }),
|
|
8646
8804
|
message ? /* @__PURE__ */ jsxs21("div", { className: "ls-modqueue-item__message", children: [
|
|
8647
8805
|
"\u201C",
|
|
@@ -8649,9 +8807,9 @@ function ModQueueItem({
|
|
|
8649
8807
|
"\u201D"
|
|
8650
8808
|
] }) : null
|
|
8651
8809
|
] }),
|
|
8652
|
-
/* @__PURE__ */
|
|
8653
|
-
/* @__PURE__ */
|
|
8654
|
-
/* @__PURE__ */
|
|
8810
|
+
/* @__PURE__ */ jsx32("div", { className: "ls-modqueue-item__actions", children: actions ?? /* @__PURE__ */ jsxs21(Fragment11, { children: [
|
|
8811
|
+
/* @__PURE__ */ jsx32(IconButton, { className: "ls-modqueue-item__iconbtn", disableRipple: true, onClick: onDeny, "aria-label": "Deny", children: /* @__PURE__ */ jsx32(CrossBoxIcon, { className: "ls-modqueue-item__action-icon" }) }),
|
|
8812
|
+
/* @__PURE__ */ jsx32(IconButton, { className: "ls-modqueue-item__iconbtn", disableRipple: true, onClick: onApprove, "aria-label": "Approve", children: /* @__PURE__ */ jsx32(TickBoxIcon, { className: "ls-modqueue-item__action-icon" }) })
|
|
8655
8813
|
] }) })
|
|
8656
8814
|
] });
|
|
8657
8815
|
}
|
|
@@ -8660,12 +8818,12 @@ ModQueueItem.displayName = "ModQueueItem";
|
|
|
8660
8818
|
// src/components/ModQueueList/ModQueueList.tsx
|
|
8661
8819
|
import { useMemo as useMemo6, useState as useState10 } from "react";
|
|
8662
8820
|
import ButtonBase from "@mui/material/ButtonBase";
|
|
8663
|
-
import
|
|
8821
|
+
import classNames19 from "classnames";
|
|
8664
8822
|
|
|
8665
8823
|
// src/components/ModQueueList/icons.tsx
|
|
8666
|
-
import { jsx as
|
|
8824
|
+
import { jsx as jsx33, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
8667
8825
|
function SearchIcon({ className }) {
|
|
8668
|
-
return /* @__PURE__ */
|
|
8826
|
+
return /* @__PURE__ */ jsx33("svg", { className, width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx33(
|
|
8669
8827
|
"path",
|
|
8670
8828
|
{
|
|
8671
8829
|
fillRule: "evenodd",
|
|
@@ -8677,23 +8835,23 @@ function SearchIcon({ className }) {
|
|
|
8677
8835
|
}
|
|
8678
8836
|
function EmptyModQueueIcon({ className }) {
|
|
8679
8837
|
return /* @__PURE__ */ jsxs22("svg", { className, width: "39", height: "39", viewBox: "0 0 39 39", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
8680
|
-
/* @__PURE__ */
|
|
8838
|
+
/* @__PURE__ */ jsx33(
|
|
8681
8839
|
"path",
|
|
8682
8840
|
{
|
|
8683
8841
|
d: "M17.8486 23.9297C17.8487 26.2984 19.0186 28.5764 20.8398 30H11V26.25C11.002 24.8582 11.5559 23.5242 12.54 22.54C13.5242 21.5559 14.8582 21.0019 16.25 21H17.8486V23.9297Z",
|
|
8684
8842
|
fill: "#CAC9D5"
|
|
8685
8843
|
}
|
|
8686
8844
|
),
|
|
8687
|
-
/* @__PURE__ */
|
|
8845
|
+
/* @__PURE__ */ jsx33(
|
|
8688
8846
|
"path",
|
|
8689
8847
|
{
|
|
8690
8848
|
d: "M24.9043 19.7451C24.6452 20.2749 24.5 20.8705 24.5 21.5C24.5 23.3373 25.7389 24.8844 27.4268 25.3535C26.8965 27.1804 25.5079 28.7064 23.75 29.1641C21.4908 28.5758 19.84 26.2235 19.8398 23.7354V21.0205L23.75 19.2109L24.9043 19.7451Z",
|
|
8691
8849
|
fill: "#CAC9D5"
|
|
8692
8850
|
}
|
|
8693
8851
|
),
|
|
8694
|
-
/* @__PURE__ */
|
|
8695
|
-
/* @__PURE__ */
|
|
8696
|
-
/* @__PURE__ */
|
|
8852
|
+
/* @__PURE__ */ jsx33("path", { d: "M30.5908 18.3184L28.2861 21.0459H30.5908V22.4092H26.5V21.0459L28.8115 18.3184H26.5V16.9541H30.5908V18.3184Z", fill: "#CAC9D5" }),
|
|
8853
|
+
/* @__PURE__ */ jsx33("path", { d: "M36.0459 15.5908L33.7412 18.3184H36.0459V19.6816H31.9541V18.3184L34.2656 15.5908H31.9541V14.2275H36.0459V15.5908Z", fill: "#CAC9D5" }),
|
|
8854
|
+
/* @__PURE__ */ jsx33(
|
|
8697
8855
|
"path",
|
|
8698
8856
|
{
|
|
8699
8857
|
d: "M18.5 9C19.5384 9 20.5536 9.30789 21.417 9.88477C22.2802 10.4616 22.9532 11.282 23.3506 12.2412C23.7478 13.2004 23.852 14.2561 23.6494 15.2744C23.4468 16.2928 22.9461 17.2278 22.2119 17.9619C21.8356 18.3383 21.4066 18.6536 20.9404 18.8984L20.248 19.2002C20.0129 19.2832 19.771 19.3504 19.5244 19.3994C18.5062 19.602 17.4504 19.4978 16.4912 19.1006C15.5319 18.7032 14.7117 18.0302 14.1348 17.167C13.5579 16.3036 13.25 15.2884 13.25 14.25C13.25 12.8576 13.8035 11.5227 14.7881 10.5381C15.7726 9.55352 17.1076 9 18.5 9Z",
|
|
@@ -8704,7 +8862,7 @@ function EmptyModQueueIcon({ className }) {
|
|
|
8704
8862
|
}
|
|
8705
8863
|
|
|
8706
8864
|
// src/components/ModQueueList/ModQueueList.tsx
|
|
8707
|
-
import { Fragment as Fragment12, jsx as
|
|
8865
|
+
import { Fragment as Fragment12, jsx as jsx34, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
8708
8866
|
var matches = (item, q) => {
|
|
8709
8867
|
if (!q) {
|
|
8710
8868
|
return true;
|
|
@@ -8742,32 +8900,32 @@ function ModQueueList({
|
|
|
8742
8900
|
};
|
|
8743
8901
|
const internalSearch = showSearch && !searchSlot;
|
|
8744
8902
|
const filtered = useMemo6(() => internalSearch ? items.filter((item) => matches(item, query)) : items, [internalSearch, items, query]);
|
|
8745
|
-
return /* @__PURE__ */ jsxs23("div", { className:
|
|
8746
|
-
searchSlot ? /* @__PURE__ */
|
|
8903
|
+
return /* @__PURE__ */ jsxs23("div", { className: classNames19("ls-modqueue", className), id, children: [
|
|
8904
|
+
searchSlot ? /* @__PURE__ */ jsx34("div", { className: "ls-modqueue__search-slot", children: searchSlot }) : showSearch ? /* @__PURE__ */ jsx34("div", { className: "ls-modqueue__search-slot", children: /* @__PURE__ */ jsx34(
|
|
8747
8905
|
LSInput,
|
|
8748
8906
|
{
|
|
8749
8907
|
size: "small",
|
|
8750
8908
|
placeholder: searchPlaceholder,
|
|
8751
|
-
startAdornment: /* @__PURE__ */
|
|
8909
|
+
startAdornment: /* @__PURE__ */ jsx34(SearchIcon, { className: "ls-modqueue__search-icon" }),
|
|
8752
8910
|
value: query,
|
|
8753
8911
|
onChange: (e) => handleSearchChange(String(e.target.value ?? ""))
|
|
8754
8912
|
}
|
|
8755
8913
|
) }) : null,
|
|
8756
8914
|
filtered.length === 0 ? /* @__PURE__ */ jsxs23("div", { className: "ls-modqueue__empty", children: [
|
|
8757
|
-
/* @__PURE__ */
|
|
8758
|
-
/* @__PURE__ */
|
|
8915
|
+
/* @__PURE__ */ jsx34("span", { className: "ls-modqueue__empty-icon", children: emptyIcon ?? /* @__PURE__ */ jsx34(EmptyModQueueIcon, {}) }),
|
|
8916
|
+
/* @__PURE__ */ jsx34("span", { children: emptyText })
|
|
8759
8917
|
] }) : /* @__PURE__ */ jsxs23(Fragment12, { children: [
|
|
8760
8918
|
canModerate && (onDeny || onApprove) ? /* @__PURE__ */ jsxs23("div", { className: "ls-modqueue__bulk", children: [
|
|
8761
8919
|
onDeny ? /* @__PURE__ */ jsxs23(ButtonBase, { className: "ls-modqueue__bulk-btn ls-modqueue__bulk-btn--deny", disableRipple: true, onClick: () => onDeny("all"), children: [
|
|
8762
|
-
/* @__PURE__ */
|
|
8920
|
+
/* @__PURE__ */ jsx34(CrossBoxIcon, { className: "ls-modqueue__bulk-icon" }),
|
|
8763
8921
|
denyAllLabel
|
|
8764
8922
|
] }) : null,
|
|
8765
8923
|
onApprove ? /* @__PURE__ */ jsxs23(ButtonBase, { className: "ls-modqueue__bulk-btn ls-modqueue__bulk-btn--approve", disableRipple: true, onClick: () => onApprove("all"), children: [
|
|
8766
|
-
/* @__PURE__ */
|
|
8924
|
+
/* @__PURE__ */ jsx34(TickBoxIcon, { className: "ls-modqueue__bulk-icon" }),
|
|
8767
8925
|
approveAllLabel
|
|
8768
8926
|
] }) : null
|
|
8769
8927
|
] }) : null,
|
|
8770
|
-
/* @__PURE__ */
|
|
8928
|
+
/* @__PURE__ */ jsx34("div", { className: "ls-modqueue__list", children: filtered.map((item) => /* @__PURE__ */ jsx34(
|
|
8771
8929
|
ModQueueItem,
|
|
8772
8930
|
{
|
|
8773
8931
|
icon: item.icon,
|
|
@@ -8778,7 +8936,7 @@ function ModQueueList({
|
|
|
8778
8936
|
message: showMessages ? item.message : void 0,
|
|
8779
8937
|
onApprove: () => onApprove?.(item.id),
|
|
8780
8938
|
onDeny: () => onDeny?.(item.id),
|
|
8781
|
-
actions: item.actions ?? (canModerate ? void 0 : /* @__PURE__ */
|
|
8939
|
+
actions: item.actions ?? (canModerate ? void 0 : /* @__PURE__ */ jsx34("span", { className: "ls-modqueue__readonly", children: "read-only" }))
|
|
8782
8940
|
},
|
|
8783
8941
|
item.id
|
|
8784
8942
|
)) })
|
|
@@ -8789,8 +8947,8 @@ ModQueueList.displayName = "ModQueueList";
|
|
|
8789
8947
|
|
|
8790
8948
|
// src/components/ModActivityLog/ModActivityLog.tsx
|
|
8791
8949
|
import { useEffect as useEffect8, useRef as useRef8 } from "react";
|
|
8792
|
-
import
|
|
8793
|
-
import { jsx as
|
|
8950
|
+
import classNames20 from "classnames";
|
|
8951
|
+
import { jsx as jsx35, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
8794
8952
|
function ModActivityLog({ logs, emptyText, onClear, clearLabel = "Clear logs", autoScroll, className }) {
|
|
8795
8953
|
const listRef = useRef8(null);
|
|
8796
8954
|
useEffect8(() => {
|
|
@@ -8798,20 +8956,20 @@ function ModActivityLog({ logs, emptyText, onClear, clearLabel = "Clear logs", a
|
|
|
8798
8956
|
listRef.current.scrollTop = listRef.current.scrollHeight;
|
|
8799
8957
|
}
|
|
8800
8958
|
}, [logs, autoScroll]);
|
|
8801
|
-
return /* @__PURE__ */ jsxs24("div", { className:
|
|
8802
|
-
onClear && logs.length > 0 ? /* @__PURE__ */
|
|
8803
|
-
logs.length === 0 ? /* @__PURE__ */
|
|
8959
|
+
return /* @__PURE__ */ jsxs24("div", { className: classNames20("ls-modlog", className), children: [
|
|
8960
|
+
onClear && logs.length > 0 ? /* @__PURE__ */ jsx35("div", { className: "ls-modlog__toolbar", children: /* @__PURE__ */ jsx35("button", { type: "button", className: "ls-modlog__clear", onClick: onClear, children: clearLabel }) }) : null,
|
|
8961
|
+
logs.length === 0 ? /* @__PURE__ */ jsx35("div", { className: "ls-modlog__empty", children: emptyText ?? "No activity yet" }) : /* @__PURE__ */ jsx35("div", { className: "ls-modlog__list", ref: listRef, children: logs.map((log, i) => {
|
|
8804
8962
|
const rowStyle = {
|
|
8805
8963
|
...log.tabColor ? { ["--ls-modlog-accent"]: log.tabColor } : {},
|
|
8806
8964
|
...log.barColor ? { ["--ls-modlog-bar"]: log.barColor } : {}
|
|
8807
8965
|
};
|
|
8808
8966
|
return /* @__PURE__ */ jsxs24("div", { className: "ls-modlog__row", style: rowStyle, children: [
|
|
8809
8967
|
/* @__PURE__ */ jsxs24("div", { className: "ls-modlog__head", children: [
|
|
8810
|
-
log.avatar ? /* @__PURE__ */
|
|
8811
|
-
log.title ? /* @__PURE__ */
|
|
8812
|
-
log.time ? /* @__PURE__ */
|
|
8968
|
+
log.avatar ? /* @__PURE__ */ jsx35("img", { className: "ls-modlog__avatar", src: log.avatar, alt: "" }) : null,
|
|
8969
|
+
log.title ? /* @__PURE__ */ jsx35("span", { className: "ls-modlog__title", children: log.title }) : null,
|
|
8970
|
+
log.time ? /* @__PURE__ */ jsx35("span", { className: "ls-modlog__time", children: log.time }) : null
|
|
8813
8971
|
] }),
|
|
8814
|
-
log.message ? /* @__PURE__ */
|
|
8972
|
+
log.message ? /* @__PURE__ */ jsx35("div", { className: "ls-modlog__message", children: log.message }) : null
|
|
8815
8973
|
] }, log.id ?? i);
|
|
8816
8974
|
}) })
|
|
8817
8975
|
] });
|
|
@@ -8820,8 +8978,8 @@ ModActivityLog.displayName = "ModActivityLog";
|
|
|
8820
8978
|
|
|
8821
8979
|
// src/components/SongRequestList/SongRequestList.tsx
|
|
8822
8980
|
import { useState as useState11 } from "react";
|
|
8823
|
-
import
|
|
8824
|
-
import { jsx as
|
|
8981
|
+
import classNames21 from "classnames";
|
|
8982
|
+
import { jsx as jsx36, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
8825
8983
|
function SongRequestList({
|
|
8826
8984
|
nowPlaying,
|
|
8827
8985
|
progress = 0,
|
|
@@ -8850,7 +9008,7 @@ function SongRequestList({
|
|
|
8850
9008
|
setAddValue("");
|
|
8851
9009
|
};
|
|
8852
9010
|
const addBar = onAddSong ? /* @__PURE__ */ jsxs25("div", { className: "ls-songreq__addbar", children: [
|
|
8853
|
-
/* @__PURE__ */
|
|
9011
|
+
/* @__PURE__ */ jsx36(
|
|
8854
9012
|
LSInput,
|
|
8855
9013
|
{
|
|
8856
9014
|
className: "ls-songreq__addinput",
|
|
@@ -8866,34 +9024,34 @@ function SongRequestList({
|
|
|
8866
9024
|
}
|
|
8867
9025
|
}
|
|
8868
9026
|
),
|
|
8869
|
-
/* @__PURE__ */
|
|
9027
|
+
/* @__PURE__ */ jsx36(LSButton, { size: "small", label: addLabel, disabled: addDisabled || !addValue.trim(), onClick: submitAdd })
|
|
8870
9028
|
] }) : null;
|
|
8871
9029
|
if (!nowPlaying) {
|
|
8872
9030
|
if (!addBar) {
|
|
8873
|
-
return /* @__PURE__ */
|
|
9031
|
+
return /* @__PURE__ */ jsx36("div", { className: classNames21("ls-songreq", "ls-songreq--empty", className), children: emptyText ?? "Nothing playing" });
|
|
8874
9032
|
}
|
|
8875
|
-
return /* @__PURE__ */ jsxs25("div", { className:
|
|
9033
|
+
return /* @__PURE__ */ jsxs25("div", { className: classNames21("ls-songreq", className), children: [
|
|
8876
9034
|
addBar,
|
|
8877
|
-
/* @__PURE__ */
|
|
9035
|
+
/* @__PURE__ */ jsx36("div", { className: "ls-songreq__empty", children: emptyText ?? "Nothing playing" })
|
|
8878
9036
|
] });
|
|
8879
9037
|
}
|
|
8880
9038
|
const clampedProgress = Math.min(100, Math.max(0, progress));
|
|
8881
|
-
return /* @__PURE__ */ jsxs25("div", { className:
|
|
9039
|
+
return /* @__PURE__ */ jsxs25("div", { className: classNames21("ls-songreq", className), children: [
|
|
8882
9040
|
addBar,
|
|
8883
9041
|
/* @__PURE__ */ jsxs25("div", { className: "ls-songreq__now", children: [
|
|
8884
|
-
showArt && nowPlaying.art ? /* @__PURE__ */
|
|
9042
|
+
showArt && nowPlaying.art ? /* @__PURE__ */ jsx36("img", { className: "ls-songreq__art", src: nowPlaying.art, alt: "" }) : null,
|
|
8885
9043
|
/* @__PURE__ */ jsxs25("div", { className: "ls-songreq__nowbody", children: [
|
|
8886
|
-
/* @__PURE__ */
|
|
8887
|
-
nowPlaying.artist ? /* @__PURE__ */
|
|
9044
|
+
/* @__PURE__ */ jsx36("div", { className: "ls-songreq__title", children: nowPlaying.title }),
|
|
9045
|
+
nowPlaying.artist ? /* @__PURE__ */ jsx36("div", { className: "ls-songreq__artist", children: nowPlaying.artist }) : null,
|
|
8888
9046
|
showRequester && nowPlaying.requester ? /* @__PURE__ */ jsxs25("div", { className: "ls-songreq__requester", children: [
|
|
8889
9047
|
"requested by ",
|
|
8890
9048
|
nowPlaying.requester
|
|
8891
9049
|
] }) : null,
|
|
8892
|
-
/* @__PURE__ */
|
|
9050
|
+
/* @__PURE__ */ jsx36("div", { className: "ls-songreq__progress", children: /* @__PURE__ */ jsx36("div", { className: "ls-songreq__progressbar", style: { width: `${clampedProgress}%` } }) })
|
|
8893
9051
|
] }),
|
|
8894
9052
|
/* @__PURE__ */ jsxs25("div", { className: "ls-songreq__controls", children: [
|
|
8895
|
-
onPlayPause ? /* @__PURE__ */
|
|
8896
|
-
onSkip ? /* @__PURE__ */
|
|
9053
|
+
onPlayPause ? /* @__PURE__ */ jsx36("button", { type: "button", className: "ls-songreq__btn", onClick: onPlayPause, title: isPlaying ? "Pause" : "Play", "aria-label": isPlaying ? "Pause" : "Play", children: isPlaying ? "\u23F8" : "\u25B6" }) : null,
|
|
9054
|
+
onSkip ? /* @__PURE__ */ jsx36("button", { type: "button", className: "ls-songreq__btn", onClick: onSkip, title: "Skip", "aria-label": "Skip", children: "\u23ED" }) : null
|
|
8897
9055
|
] })
|
|
8898
9056
|
] }),
|
|
8899
9057
|
showQueue ? /* @__PURE__ */ jsxs25("div", { className: "ls-songreq__queue", children: [
|
|
@@ -8901,16 +9059,16 @@ function SongRequestList({
|
|
|
8901
9059
|
"Up next \xB7 ",
|
|
8902
9060
|
queue.length
|
|
8903
9061
|
] }),
|
|
8904
|
-
/* @__PURE__ */
|
|
8905
|
-
showArt && item.art ? /* @__PURE__ */
|
|
9062
|
+
/* @__PURE__ */ jsx36("div", { className: "ls-songreq__queuelist", children: queue.length === 0 ? /* @__PURE__ */ jsx36("div", { className: "ls-songreq__queueempty", children: "Queue is empty" }) : queue.map((item) => /* @__PURE__ */ jsxs25("div", { className: "ls-songreq__item", children: [
|
|
9063
|
+
showArt && item.art ? /* @__PURE__ */ jsx36("img", { className: "ls-songreq__itemart", src: item.art, alt: "" }) : null,
|
|
8906
9064
|
/* @__PURE__ */ jsxs25("div", { className: "ls-songreq__itembody", children: [
|
|
8907
|
-
/* @__PURE__ */
|
|
9065
|
+
/* @__PURE__ */ jsx36("div", { className: "ls-songreq__itemtitle", children: item.title }),
|
|
8908
9066
|
/* @__PURE__ */ jsxs25("div", { className: "ls-songreq__itemmeta", children: [
|
|
8909
9067
|
item.artist,
|
|
8910
9068
|
showRequester && item.requester ? ` \xB7 ${item.requester}` : ""
|
|
8911
9069
|
] })
|
|
8912
9070
|
] }),
|
|
8913
|
-
onRemove ? /* @__PURE__ */
|
|
9071
|
+
onRemove ? /* @__PURE__ */ jsx36("button", { type: "button", className: "ls-songreq__remove", onClick: () => onRemove(item.id), title: "Remove", "aria-label": "Remove", children: "\u2715" }) : null
|
|
8914
9072
|
] }, item.id)) })
|
|
8915
9073
|
] }) : null
|
|
8916
9074
|
] });
|
|
@@ -8919,7 +9077,7 @@ SongRequestList.displayName = "SongRequestList";
|
|
|
8919
9077
|
|
|
8920
9078
|
// src/se-import/ui/MarketplacePicker.tsx
|
|
8921
9079
|
import { useEffect as useEffect9, useMemo as useMemo7, useState as useState12 } from "react";
|
|
8922
|
-
import { jsx as
|
|
9080
|
+
import { jsx as jsx37, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
8923
9081
|
function MarketplacePicker({ seWidgetType, fetchMarketplaceOverlay, CustomEmbed, onPick, onCancel }) {
|
|
8924
9082
|
const candidateIds = useMemo7(() => getMarketplaceCandidates(seWidgetType), [seWidgetType]);
|
|
8925
9083
|
const [candidates, setCandidates] = useState12(() => candidateIds.map((id) => ({ id, loading: true })));
|
|
@@ -8956,23 +9114,23 @@ function MarketplacePicker({ seWidgetType, fetchMarketplaceOverlay, CustomEmbed,
|
|
|
8956
9114
|
};
|
|
8957
9115
|
if (candidateIds.length === 0) {
|
|
8958
9116
|
return /* @__PURE__ */ jsxs26("div", { className: "ui-flex-column ui-gap-2", style: { padding: 16 }, children: [
|
|
8959
|
-
/* @__PURE__ */
|
|
9117
|
+
/* @__PURE__ */ jsx37("div", { style: { fontWeight: 600 }, children: "No marketplace replacements yet" }),
|
|
8960
9118
|
/* @__PURE__ */ jsxs26("div", { style: { fontSize: 13, opacity: 0.8 }, children: [
|
|
8961
9119
|
"No curated marketplace overlays are listed for ",
|
|
8962
|
-
/* @__PURE__ */
|
|
9120
|
+
/* @__PURE__ */ jsx37("code", { children: seWidgetType }),
|
|
8963
9121
|
" yet. Use AI generation or skip the widget for now."
|
|
8964
9122
|
] }),
|
|
8965
|
-
/* @__PURE__ */
|
|
9123
|
+
/* @__PURE__ */ jsx37("div", { className: "ui-flex-row", style: { marginTop: 8 }, children: /* @__PURE__ */ jsx37(LSButton, { type: "button", color: "secondary", onClick: onCancel, label: "Close" }) })
|
|
8966
9124
|
] });
|
|
8967
9125
|
}
|
|
8968
9126
|
return /* @__PURE__ */ jsxs26("div", { className: "ui-flex-column ui-gap-2", style: { padding: 16, minHeight: 420 }, children: [
|
|
8969
|
-
/* @__PURE__ */
|
|
9127
|
+
/* @__PURE__ */ jsx37("div", { style: { fontWeight: 600, fontSize: 16 }, children: "Pick a marketplace replacement" }),
|
|
8970
9128
|
/* @__PURE__ */ jsxs26("div", { style: { fontSize: 13, opacity: 0.8 }, children: [
|
|
8971
9129
|
"Replacing ",
|
|
8972
|
-
/* @__PURE__ */
|
|
9130
|
+
/* @__PURE__ */ jsx37("code", { children: seWidgetType }),
|
|
8973
9131
|
" with a layer from a curated Lumia Marketplace overlay."
|
|
8974
9132
|
] }),
|
|
8975
|
-
/* @__PURE__ */
|
|
9133
|
+
/* @__PURE__ */ jsx37("div", { className: "ui-flex-row ui-gap-2", style: { flexWrap: "wrap", marginTop: 4 }, children: candidates.map((c) => /* @__PURE__ */ jsx37(
|
|
8976
9134
|
LSButton,
|
|
8977
9135
|
{
|
|
8978
9136
|
type: "button",
|
|
@@ -8991,11 +9149,11 @@ function MarketplacePicker({ seWidgetType, fetchMarketplaceOverlay, CustomEmbed,
|
|
|
8991
9149
|
": ",
|
|
8992
9150
|
activeCandidate.error
|
|
8993
9151
|
] }),
|
|
8994
|
-
activeCandidate?.loading && /* @__PURE__ */
|
|
9152
|
+
activeCandidate?.loading && /* @__PURE__ */ jsx37("div", { style: { padding: 12, fontSize: 13, opacity: 0.8 }, children: "Loading overlay\u2026" }),
|
|
8995
9153
|
activeCandidate?.overlay && /* @__PURE__ */ jsxs26("div", { className: "ui-flex-row ui-gap-2", style: { alignItems: "stretch" }, children: [
|
|
8996
9154
|
/* @__PURE__ */ jsxs26("div", { style: { flex: "0 0 200px", display: "flex", flexDirection: "column", gap: 4, maxHeight: 320, overflowY: "auto" }, children: [
|
|
8997
|
-
/* @__PURE__ */
|
|
8998
|
-
activeLayers.map((l) => /* @__PURE__ */
|
|
9155
|
+
/* @__PURE__ */ jsx37("div", { style: { fontSize: 12, fontWeight: 600, opacity: 0.8 }, children: "Layers" }),
|
|
9156
|
+
activeLayers.map((l) => /* @__PURE__ */ jsx37(
|
|
8999
9157
|
LSButton,
|
|
9000
9158
|
{
|
|
9001
9159
|
type: "button",
|
|
@@ -9003,19 +9161,19 @@ function MarketplacePicker({ seWidgetType, fetchMarketplaceOverlay, CustomEmbed,
|
|
|
9003
9161
|
style: { justifyContent: "flex-start", textAlign: "left" },
|
|
9004
9162
|
onClick: () => setActiveLayerId(l.id),
|
|
9005
9163
|
label: /* @__PURE__ */ jsxs26("div", { style: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: [
|
|
9006
|
-
/* @__PURE__ */
|
|
9007
|
-
/* @__PURE__ */
|
|
9164
|
+
/* @__PURE__ */ jsx37("div", { style: { fontSize: 12, fontWeight: 600 }, children: l.label }),
|
|
9165
|
+
/* @__PURE__ */ jsx37("div", { style: { fontSize: 10, opacity: 0.7 }, children: l.type })
|
|
9008
9166
|
] })
|
|
9009
9167
|
},
|
|
9010
9168
|
l.id
|
|
9011
9169
|
)),
|
|
9012
|
-
activeLayers.length === 0 && /* @__PURE__ */
|
|
9170
|
+
activeLayers.length === 0 && /* @__PURE__ */ jsx37("div", { style: { fontSize: 12, opacity: 0.7 }, children: "No transplantable layers." })
|
|
9013
9171
|
] }),
|
|
9014
|
-
/* @__PURE__ */
|
|
9172
|
+
/* @__PURE__ */ jsx37("div", { style: { flex: 1, minHeight: 240, background: "rgba(0,0,0,0.3)", borderRadius: 6, overflow: "hidden" }, children: /* @__PURE__ */ jsx37(ActiveLayerPreview, { overlay: activeCandidate.overlay, layerId: activeLayerId, CustomEmbed }) })
|
|
9015
9173
|
] }),
|
|
9016
9174
|
/* @__PURE__ */ jsxs26("div", { className: "ui-flex-row ui-gap-2", style: { marginTop: 12, justifyContent: "flex-end" }, children: [
|
|
9017
|
-
/* @__PURE__ */
|
|
9018
|
-
/* @__PURE__ */
|
|
9175
|
+
/* @__PURE__ */ jsx37(LSButton, { type: "button", color: "secondary", variant: "outlined", onClick: onCancel, label: "Cancel" }),
|
|
9176
|
+
/* @__PURE__ */ jsx37(
|
|
9019
9177
|
LSButton,
|
|
9020
9178
|
{
|
|
9021
9179
|
type: "button",
|
|
@@ -9029,13 +9187,13 @@ function MarketplacePicker({ seWidgetType, fetchMarketplaceOverlay, CustomEmbed,
|
|
|
9029
9187
|
] });
|
|
9030
9188
|
}
|
|
9031
9189
|
function ActiveLayerPreview({ overlay, layerId, CustomEmbed }) {
|
|
9032
|
-
if (!layerId) return /* @__PURE__ */
|
|
9190
|
+
if (!layerId) return /* @__PURE__ */ jsx37("div", { style: { padding: 16, fontSize: 12, opacity: 0.7 }, children: "Select a layer to preview." });
|
|
9033
9191
|
const module = overlay.settings?.modules?.[layerId];
|
|
9034
|
-
if (!module) return /* @__PURE__ */
|
|
9192
|
+
if (!module) return /* @__PURE__ */ jsx37("div", { style: { padding: 16, fontSize: 12, opacity: 0.7 }, children: "Layer not found." });
|
|
9035
9193
|
const type = module.settings?.type;
|
|
9036
9194
|
if (type === "custom" && module.content && CustomEmbed) {
|
|
9037
9195
|
const c = module.content;
|
|
9038
|
-
return /* @__PURE__ */
|
|
9196
|
+
return /* @__PURE__ */ jsx37(
|
|
9039
9197
|
CustomEmbed,
|
|
9040
9198
|
{
|
|
9041
9199
|
codeId: c.codeId ?? layerId,
|
|
@@ -9047,10 +9205,10 @@ function ActiveLayerPreview({ overlay, layerId, CustomEmbed }) {
|
|
|
9047
9205
|
);
|
|
9048
9206
|
}
|
|
9049
9207
|
return /* @__PURE__ */ jsxs26("div", { style: { padding: 16, fontSize: 12 }, children: [
|
|
9050
|
-
/* @__PURE__ */
|
|
9208
|
+
/* @__PURE__ */ jsx37("div", { style: { fontWeight: 600, marginBottom: 8 }, children: module.settings?.title ?? type }),
|
|
9051
9209
|
/* @__PURE__ */ jsxs26("div", { style: { opacity: 0.8 }, children: [
|
|
9052
9210
|
"Preview not available for module type ",
|
|
9053
|
-
/* @__PURE__ */
|
|
9211
|
+
/* @__PURE__ */ jsx37("code", { children: String(type) }),
|
|
9054
9212
|
'. Click "Use this layer" to transplant it anyway.'
|
|
9055
9213
|
] })
|
|
9056
9214
|
] });
|
|
@@ -10149,28 +10307,6 @@ async function fetchStreamlabsWidgetConfig(token, widgetType, options = {}) {
|
|
|
10149
10307
|
return result.json();
|
|
10150
10308
|
}
|
|
10151
10309
|
|
|
10152
|
-
// #style-inject:#style-inject
|
|
10153
|
-
function styleInject(css, { insertAt } = {}) {
|
|
10154
|
-
if (!css || typeof document === "undefined") return;
|
|
10155
|
-
const head = document.head || document.getElementsByTagName("head")[0];
|
|
10156
|
-
const style = document.createElement("style");
|
|
10157
|
-
style.type = "text/css";
|
|
10158
|
-
if (insertAt === "top") {
|
|
10159
|
-
if (head.firstChild) {
|
|
10160
|
-
head.insertBefore(style, head.firstChild);
|
|
10161
|
-
} else {
|
|
10162
|
-
head.appendChild(style);
|
|
10163
|
-
}
|
|
10164
|
-
} else {
|
|
10165
|
-
head.appendChild(style);
|
|
10166
|
-
}
|
|
10167
|
-
if (style.styleSheet) {
|
|
10168
|
-
style.styleSheet.cssText = css;
|
|
10169
|
-
} else {
|
|
10170
|
-
style.appendChild(document.createTextNode(css));
|
|
10171
|
-
}
|
|
10172
|
-
}
|
|
10173
|
-
|
|
10174
10310
|
// src/se-import/ui/SEImportWizard.css
|
|
10175
10311
|
styleInject('.se-import,\n.se-import * {\n box-sizing: border-box;\n}\n.se-import {\n --se-bg: #17162a;\n --se-surface: #27264a;\n --se-panel: #171b38;\n --se-panel-2: #202449;\n --se-border: rgba(116, 124, 211, 0.24);\n --se-border-strong: rgba(126, 128, 255, 0.58);\n --se-text: #f5f4ff;\n --se-muted: #bab8d2;\n --se-primary: #ff4076;\n --se-purple: #393853;\n --se-green: #06c96f;\n --se-warn: #f7a42b;\n width: 100%;\n height: 100%;\n min-width: min(680px, 100%);\n color: var(--se-text);\n font-family: inherit;\n display: flex;\n flex-direction: column;\n min-height: 0;\n}\n.se-import__shell {\n border-radius: 0;\n padding: 28px 48px 24px;\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n}\n.se-import__header {\n flex: 0 0 auto;\n}\nfooter.se-import-actions {\n flex: 0 0 auto;\n}\n.se-import__header {\n display: grid;\n justify-items: center;\n gap: 42px;\n}\n.se-import__title {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n font-size: 20px;\n font-weight: 500;\n}\n.se-import-stepper {\n display: grid;\n width: min(760px, 100%);\n grid-template-columns: repeat(auto-fit, minmax(88px, 1fr));\n}\n.se-import-step {\n position: relative;\n display: grid;\n justify-items: center;\n gap: 12px;\n min-width: 0;\n color: rgba(255, 255, 255, 0.72);\n}\n.se-import-step__label {\n color: var(--se-text);\n font-size: 18px;\n line-height: 1.1;\n}\n.se-import-step__line {\n position: absolute;\n top: 42px;\n left: 50%;\n width: 100%;\n height: 2px;\n background: rgba(255, 255, 255, 0.16);\n}\n.se-import-step:last-child .se-import-step__line {\n display: none;\n}\n.se-import-step__dot {\n z-index: 1;\n display: grid;\n width: 22px;\n height: 22px;\n place-items: center;\n border-radius: 50%;\n background: #47485e;\n color: #fff;\n font-size: 13px;\n font-weight: 700;\n line-height: 1;\n}\n.se-import-step--active .se-import-step__dot {\n background: var(--se-primary);\n}\n.se-import-step--done .se-import-step__dot {\n background: var(--se-green);\n}\n.se-import-step--done .se-import-step__line {\n background: var(--se-green);\n}\n.se-import-step--done:has(+ .se-import-step--active) .se-import-step__line {\n background:\n linear-gradient(\n 90deg,\n var(--se-green),\n var(--se-primary));\n}\n.se-import__content {\n display: grid;\n place-items: center;\n padding: 64px 0 28px;\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n}\n@media (max-height: 760px) {\n .se-import__shell {\n padding: 18px 32px 16px;\n }\n .se-import__content {\n padding: 32px 0 16px;\n }\n}\n.se-import-panel {\n width: min(100%, 1080px);\n padding: 28px;\n}\n.se-import-panel--narrow {\n width: min(100%, 1140px);\n}\n.se-import-panel--medium {\n width: min(100%, 880px);\n}\n.se-import-panel--wide {\n width: min(100%, 1000px);\n}\n.se-import-panel--confirm {\n width: min(100%, 800px);\n}\n.se-import-panel h2,\n.se-import-panel h3,\n.se-import-panel p {\n margin: 0;\n}\n.se-import-panel h2 {\n font-size: 26px;\n font-weight: 700;\n line-height: 1.15;\n}\n.se-import-panel > p {\n margin-top: 14px;\n color: var(--se-muted);\n font-size: 16px;\n line-height: 1.45;\n}\n.se-import-field {\n margin-top: 34px;\n}\n.se-import-field .mui-ls-input {\n --ls-control-height: 66px;\n}\n.se-import-field .MuiInputLabel-root {\n color: var(--se-text);\n font-weight: 700;\n}\n.se-import-field .MuiInputLabel-root.Mui-focused {\n color: #dfe1ff;\n}\n.se-import-field .MuiInputBase-root {\n font-size: 18px;\n}\n.se-import-token-loading {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n margin-top: 14px;\n color: var(--se-muted);\n font-size: 13px;\n font-weight: 700;\n}\n.se-import-spinner {\n width: 16px;\n height: 16px;\n border: 2px solid rgba(255, 255, 255, 0.2);\n border-top-color: var(--se-primary);\n border-radius: 50%;\n animation: se-import-spin 800ms linear infinite;\n}\n@keyframes se-import-spin {\n to {\n transform: rotate(360deg);\n }\n}\n.se-import-help {\n display: flex;\n gap: 18px;\n margin-top: 30px;\n border: 1px solid var(--se-purple);\n border-radius: 12px;\n padding: 24px;\n color: var(--white2);\n}\n.se-import-help__icon {\n display: grid;\n width: 30px;\n height: 30px;\n flex: 0 0 auto;\n place-items: center;\n border: 1px solid var(--se-purple);\n border-radius: 50%;\n color: var(--white2);\n font-weight: 800;\n}\n.se-import-help__title {\n color: var(--se-text);\n font-size: 18px;\n font-weight: 700;\n}\n.se-import-help__image {\n display: block;\n width: min(100%, 560px);\n height: auto;\n margin-top: 16px;\n border: 1px solid var(--se-border);\n border-radius: 8px;\n}\n.se-import-help ol {\n margin: 16px 0 0;\n padding-left: 18px;\n font-size: 15px;\n line-height: 1.7;\n}\n.se-import-help a {\n color: var(--primary);\n font-weight: 700;\n}\n.se-import-help--info {\n align-items: center;\n}\n.se-import-section-title {\n display: flex;\n gap: 1rem;\n margin-bottom: 1.5rem;\n}\n.se-import-section-title__num {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 46px;\n height: 46px;\n border: 1px solid var(--se-purple);\n border-radius: 50%;\n font-size: 1.5rem;\n font-weight: 800;\n}\n.se-import-section-title__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n}\n.se-import-section-title h3 {\n font-size: 18px;\n font-weight: 800;\n}\n.se-import-section-title p {\n margin-top: 4px;\n color: var(--se-muted);\n font-size: 14px;\n}\n.se-import-grid {\n display: grid;\n gap: 8px;\n margin-top: 10px;\n}\n.se-import-grid--four {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n}\n.se-import-grid--stats {\n grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n}\n.se-import-grid--two {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.se-import-stat {\n min-height: 116px;\n border: 1px solid rgba(255, 255, 255, 0.06);\n border-radius: 8px;\n background:\n linear-gradient(\n 135deg,\n rgba(42, 47, 92, 0.9),\n rgba(33, 38, 78, 0.9));\n padding: 24px 22px;\n}\n.se-import-stat--success {\n background:\n linear-gradient(\n 135deg,\n rgba(12, 91, 86, 0.72),\n rgba(32, 65, 76, 0.8));\n border-color: rgba(19, 201, 126, 0.25);\n}\n.se-import-stat--info {\n border-color: rgba(116, 104, 255, 0.8);\n box-shadow: inset 3px 0 0 #6e76ff;\n}\n.se-import-stat--warn,\n.se-import-stat--muted {\n box-shadow: inset 3px 0 0 var(--se-warn);\n}\n.se-import-stat__label {\n display: flex;\n align-items: center;\n gap: 8px;\n color: var(--se-muted);\n font-size: 12px;\n font-weight: 800;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n}\n.se-import-stat__icon {\n width: 20px;\n height: 20px;\n object-fit: contain;\n}\n.se-import-stat__value {\n margin-top: 12px;\n color: #fff;\n font-size: 30px;\n font-weight: 800;\n line-height: 1;\n}\n.se-import-stat__description {\n margin-top: 10px;\n color: var(--se-muted);\n font-size: 13px;\n line-height: 1.35;\n}\n.se-import-stat__sub {\n margin-top: 8px;\n color: var(--se-muted);\n font-size: 13px;\n}\n.se-import-mode-card__icon {\n display: grid;\n width: 46px;\n height: 46px;\n place-items: center;\n border-radius: 12px;\n background: rgba(255, 255, 255, 0.08);\n}\n.se-import-mode-card__icon img {\n width: 30px;\n height: 30px;\n object-fit: contain;\n}\n.se-import-mode-card__features {\n display: grid;\n gap: 6px;\n margin: 0;\n padding-left: 18px;\n}\n.se-import-overlay-progress {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-items: center;\n max-width: min(760px, 100%);\n width: 100%;\n gap: 14px;\n padding: 4px 2px 0;\n}\n.se-import-overlay-progress__copy {\n min-width: 0;\n color: var(--se-text);\n font-size: 13px;\n font-weight: 700;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.se-import-overlay-progress__strip,\n.se-import-overlay-progress__stack {\n display: flex;\n align-items: center;\n}\n.se-import-overlay-progress__strip {\n gap: 7px;\n}\n.se-import-overlay-progress__stack {\n margin-right: 5px;\n}\n.se-import-overlay-progress__stack--queued {\n margin-right: 0;\n margin-left: 5px;\n}\n.se-import-overlay-progress__stack .se-import-overlay-progress__item {\n margin-left: -16px;\n}\n.se-import-overlay-progress__stack .se-import-overlay-progress__item:first-child {\n margin-left: 0;\n}\n.se-import-overlay-progress__item {\n position: relative;\n width: 50px;\n height: 36px;\n flex: 0 0 auto;\n overflow: hidden;\n border: 1px solid var(--se-border);\n border-radius: 6px;\n background: var(--se-panel-2);\n opacity: 0.72;\n}\n.se-import-overlay-progress__item img,\n.se-import-overlay-progress__placeholder {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.se-import-overlay-progress__item--current {\n border-color: var(--se-primary);\n box-shadow: 0 0 0 1px var(--se-primary);\n opacity: 1;\n z-index: 3;\n}\n.se-import-overlay-progress__item--done {\n opacity: 1;\n}\n.se-import-overlay-progress__item--queued {\n opacity: 0.64;\n}\n.se-import-overlay-progress__more {\n display: grid;\n min-width: 28px;\n height: 24px;\n place-items: center;\n border-radius: 999px;\n background: rgba(255, 255, 255, 0.08);\n color: var(--se-muted);\n font-size: 12px;\n font-weight: 800;\n}\n.se-import-overlay-progress__check {\n position: absolute;\n right: 3px;\n bottom: 3px;\n display: grid;\n width: 16px;\n height: 16px;\n place-items: center;\n border-radius: 50%;\n background: var(--se-green);\n color: #fff;\n font-size: 11px;\n font-weight: 900;\n line-height: 1;\n}\n.se-import-option {\n display: grid;\n grid-template-columns: auto minmax(0, 1fr) auto auto;\n align-items: center;\n gap: 18px;\n border: 1px solid var(--se-purple);\n border-radius: 12px;\n background:\n linear-gradient(\n 135deg,\n rgba(35, 39, 81, 0.95),\n rgba(31, 35, 73, 0.95));\n box-shadow: inset 3px 0 0 var(--se-primary);\n cursor: pointer;\n padding: 22px;\n margin-bottom: 1rem;\n}\n.se-import-option--disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.se-import-option__icon {\n display: grid;\n width: 40px;\n height: 40px;\n place-items: center;\n border-radius: 12px;\n background: rgba(255, 64, 118, 0.12);\n}\n.se-import-option__icon img {\n width: 24px;\n height: 24px;\n object-fit: contain;\n}\n.se-import-option__body {\n display: grid;\n gap: 8px;\n min-width: 0;\n}\n.se-import-option__title {\n font-size: 17px;\n font-weight: 800;\n}\n.se-import-option__copy {\n color: var(--se-muted);\n font-size: 14px;\n line-height: 1.45;\n}\n.se-import-option__count {\n color: #fff;\n font-size: 16px;\n}\n.se-import-option input {\n position: absolute;\n opacity: 0;\n pointer-events: none;\n}\n.se-import-toggle {\n position: relative;\n width: 48px;\n height: 28px;\n border-radius: 999px;\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);\n}\n.se-import-toggle::after {\n position: absolute;\n top: 4px;\n left: 4px;\n width: 20px;\n height: 20px;\n border-radius: 50%;\n background: #fff;\n content: "";\n transition: transform 160ms ease;\n}\n.se-import-option input:checked + .se-import-toggle {\n background: var(--primary);\n}\n.se-import-option input:checked + .se-import-toggle::after {\n transform: translateX(20px);\n}\n.se-import-advanced {\n margin-top: 26px;\n border-radius: 10px;\n background: rgba(32, 36, 73, 0.7);\n padding: 24px;\n}\n.se-import-advanced summary {\n cursor: pointer;\n font-size: 18px;\n font-weight: 700;\n}\n.se-import-advanced p {\n margin-top: 10px;\n color: var(--se-muted);\n}\n.se-import-transfer {\n position: relative;\n display: grid;\n width: min(720px, 100%);\n min-height: 190px;\n grid-template-columns: 180px minmax(260px, 1fr) 180px;\n align-items: center;\n gap: 28px;\n margin: 0 auto 60px;\n}\n.se-import-transfer__source {\n position: relative;\n display: grid;\n width: 160px;\n height: 160px;\n place-items: center;\n animation: se-import-source-bounce 1.8s ease-in-out infinite;\n}\n.se-import-transfer--complete .se-import-transfer__source {\n animation: none;\n}\n.se-import-transfer__source::before {\n top: -13px;\n left: -13px;\n box-shadow: 155px 0 0 var(--se-primary);\n}\n.se-import-transfer__source::after {\n bottom: -13px;\n left: -13px;\n box-shadow: 155px 0 0 var(--se-primary);\n}\n.se-import-transfer__source img {\n width: 192px;\n height: 192px;\n object-fit: contain;\n}\n.se-import-transfer__source--lumia {\n animation-delay: 0.22s;\n}\n.se-import-transfer__files {\n position: relative;\n height: 130px;\n}\n.se-import-transfer__file {\n position: absolute;\n top: 50%;\n left: -18px;\n width: 56px;\n height: 66px;\n object-fit: contain;\n transform: translateY(-50%);\n filter: drop-shadow(0 10px 12px rgba(8, 9, 25, 0.25));\n animation: se-import-file-fly 2.4s cubic-bezier(0.35, 0, 0.25, 1) infinite;\n}\n.se-import-transfer--complete .se-import-transfer__file {\n display: none;\n}\n.se-import-transfer__done {\n position: absolute;\n right: -8px;\n bottom: -8px;\n display: grid;\n width: 34px;\n height: 34px;\n place-items: center;\n border-radius: 50%;\n background: var(--se-green);\n color: #fff;\n font-size: 20px;\n font-weight: 900;\n box-shadow: 0 10px 20px rgba(6, 201, 111, 0.26);\n}\n.se-import-transfer__file--one {\n animation-delay: 0s;\n}\n.se-import-transfer__file--two {\n animation-delay: 0.38s;\n}\n.se-import-transfer__file--three {\n animation-delay: 0.76s;\n}\n.se-import-transfer__file--four {\n animation-delay: 1.14s;\n}\n@keyframes se-import-source-bounce {\n 0%, 100% {\n transform: translateY(0) scale(1);\n }\n 50% {\n transform: translateY(-8px) scale(1.025);\n }\n}\n@keyframes se-import-file-fly {\n 0% {\n opacity: 0;\n transform: translate(-10px, -50%) scale(0.82) rotate(-8deg);\n }\n 12% {\n opacity: 1;\n }\n 45% {\n transform: translate(145px, calc(-50% - 18px)) scale(1.08) rotate(5deg);\n }\n 82% {\n opacity: 1;\n }\n 100% {\n opacity: 0;\n transform: translate(330px, -50%) scale(0.9) rotate(10deg);\n }\n}\n.se-import-mirror-head {\n display: grid;\n grid-template-columns: minmax(220px, auto) minmax(180px, 1fr) auto;\n align-items: center;\n gap: 14px;\n}\n.se-import-mirror-head p {\n margin-top: 14px;\n color: var(--se-muted);\n font-size: 16px;\n}\n.se-import-mirror-head span {\n flex: 0 0 auto;\n color: var(--se-muted);\n font-weight: 700;\n}\n.se-import-mirror-head strong {\n color: var(--se-text);\n font-size: 14px;\n}\n.se-import-progress {\n width: 100%;\n height: 14px;\n margin-top: 0;\n overflow: hidden;\n border: 0;\n border-radius: 999px;\n background: rgba(255, 64, 118, 0.1);\n}\n.se-import-progress::-webkit-progress-bar {\n background: rgba(255, 64, 118, 0.1);\n}\n.se-import-progress::-webkit-progress-value {\n border-radius: 999px;\n background:\n linear-gradient(\n 90deg,\n #ff4076,\n #e7295f);\n}\n.se-import-progress::-moz-progress-bar {\n border-radius: 999px;\n background:\n linear-gradient(\n 90deg,\n #ff4076,\n #e7295f);\n}\n.se-import-asset-list {\n margin-top: 22px;\n border-top: 1px solid rgba(255, 255, 255, 0.08);\n}\n.se-import-asset-row {\n display: grid;\n grid-template-columns: 32px minmax(0, 1fr) auto auto;\n align-items: center;\n gap: 14px;\n min-height: 42px;\n border-bottom: 1px solid rgba(255, 255, 255, 0.08);\n color: var(--se-muted);\n font-size: 13px;\n}\n.se-import-asset-row__icon {\n width: 24px;\n height: 28px;\n justify-self: end;\n object-fit: contain;\n}\n.se-import-asset-row__url {\n overflow: hidden;\n font-family:\n ui-monospace,\n SFMono-Regular,\n Menlo,\n Monaco,\n Consolas,\n monospace;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.se-import-asset-row__state {\n color: #9b8cff;\n font-weight: 800;\n}\n.se-import-asset-row--done .se-import-asset-row__state,\n.se-import-asset-row--reused .se-import-asset-row__state {\n color: var(--se-green);\n}\n.se-import-asset-row--failed .se-import-asset-row__state,\n.se-import-asset-row__error {\n color: #ff8080;\n}\n.se-import-link-button {\n border: 0;\n background: transparent;\n color: #ff9ab6;\n cursor: pointer;\n font: inherit;\n font-weight: 800;\n}\n.se-import-overview {\n margin-top: 28px;\n border: 1px solid var(--se-border);\n border-radius: 12px;\n background: rgba(26, 30, 61, 0.62);\n padding: 28px;\n}\n.se-import-overview h3 {\n margin-bottom: 18px;\n font-size: 18px;\n font-weight: 800;\n}\n.se-import-row {\n display: grid;\n grid-template-columns: 190px minmax(0, 1fr) auto;\n gap: 18px;\n align-items: center;\n min-height: 48px;\n border-top: 1px solid rgba(255, 255, 255, 0.08);\n color: var(--se-muted);\n}\n.se-import-row strong {\n min-width: 0;\n overflow: hidden;\n color: var(--se-text);\n font-weight: 600;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.se-import-row em {\n color: var(--se-muted);\n font-style: normal;\n}\n.se-import-review-card {\n display: flex;\n justify-content: space-between;\n gap: 18px;\n border: 1px solid var(--se-border);\n border-radius: 10px;\n background: rgba(30, 34, 71, 0.8);\n padding: 20px;\n}\n.se-import-review-card__type {\n font-family:\n ui-monospace,\n SFMono-Regular,\n Menlo,\n Monaco,\n Consolas,\n monospace;\n font-weight: 800;\n}\n.se-import-review-card p {\n margin-top: 8px;\n color: var(--se-muted);\n line-height: 1.45;\n}\n.se-import-review-card__status {\n flex: 0 0 auto;\n color: #facc15;\n font-size: 11px;\n font-weight: 800;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n}\n.se-import-review-bulk,\n.se-import-actions--inline {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: flex-end;\n gap: 10px;\n margin-top: 16px;\n}\n.se-import-muted {\n margin-top: 16px;\n color: var(--se-muted);\n font-size: 13px;\n}\n.se-import-generated {\n display: grid;\n gap: 12px;\n margin-top: 18px;\n}\n.se-import-generated__title {\n font-weight: 800;\n}\n.se-import-preview {\n width: 100%;\n height: 260px;\n border: 1px solid var(--se-border);\n border-radius: 8px;\n background: repeating-conic-gradient(#1a1c20 0% 25%, #1d1f24 0% 50%) 50% / 20px 20px;\n}\n.se-import-code {\n margin-top: 16px;\n}\n.se-import-code summary {\n cursor: pointer;\n color: var(--se-muted);\n font-size: 13px;\n}\n.se-import-code pre {\n max-height: 220px;\n margin: 10px 0 0;\n overflow: auto;\n border-radius: 8px;\n background: rgba(0, 0, 0, 0.28);\n padding: 12px;\n color: #d8dcff;\n font-size: 12px;\n}\n.se-import-error {\n margin-top: 18px;\n border: 1px solid rgba(239, 68, 68, 0.45);\n border-radius: 8px;\n background: rgba(220, 38, 38, 0.12);\n padding: 12px;\n color: #fca5a5;\n}\n.se-import-error__title {\n font-weight: 800;\n}\n.se-import-error__hint {\n margin-top: 6px;\n white-space: pre-wrap;\n}\n.se-import-actions {\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n margin-top: 8px;\n}\nfooter.se-import-actions:not(.se-import-actions--inline) {\n margin: 0;\n padding: 0;\n}\n.se-import-cw-review {\n margin-top: 28px;\n display: grid;\n gap: 16px;\n}\n.se-import-cw-review h3 {\n font-size: 18px;\n font-weight: 800;\n}\n.se-import-cw-review__hint {\n margin-top: -6px;\n color: var(--se-muted);\n font-size: 13px;\n line-height: 1.5;\n}\n.se-import-cw {\n border: 1px solid var(--se-border);\n border-radius: 12px;\n background: rgba(26, 30, 61, 0.62);\n overflow: hidden;\n}\n.se-import-cw__title {\n padding: 14px 16px;\n border-bottom: 1px solid var(--se-border);\n color: var(--se-text);\n font-size: 15px;\n font-weight: 800;\n}\n.se-import-cw__tabs {\n display: flex;\n flex-wrap: wrap;\n gap: 4px;\n padding: 10px 12px 0;\n}\n.se-import-cw__tab {\n border: 1px solid transparent;\n border-radius: 8px 8px 0 0;\n background: transparent;\n padding: 7px 12px;\n color: var(--se-muted);\n font-family:\n ui-monospace,\n SFMono-Regular,\n Menlo,\n Monaco,\n Consolas,\n monospace;\n font-size: 12px;\n cursor: pointer;\n transition:\n background 120ms,\n color 120ms,\n border-color 120ms;\n}\n.se-import-cw__tab:hover {\n color: var(--se-text);\n background: rgba(255, 255, 255, 0.04);\n}\n.se-import-cw__tab--active {\n color: var(--se-text);\n border-color: var(--se-border);\n border-bottom-color: transparent;\n background: rgba(0, 0, 0, 0.28);\n}\n.se-import-cw__body {\n position: relative;\n padding: 0 12px 12px;\n}\n.se-import-cw__copy {\n position: absolute;\n top: 10px;\n right: 22px;\n z-index: 1;\n border: 1px solid var(--se-border);\n border-radius: 6px;\n background: var(--se-panel-2);\n padding: 4px 12px;\n color: var(--se-text);\n font-size: 12px;\n font-weight: 700;\n cursor: pointer;\n transition: border-color 120ms, background 120ms;\n}\n.se-import-cw__copy:hover {\n border-color: var(--se-primary);\n}\n.se-import-cw__code {\n max-height: 320px;\n margin: 0;\n overflow: auto;\n border-radius: 8px;\n background: rgba(0, 0, 0, 0.28);\n padding: 14px;\n color: #d8dcff;\n font-size: 12px;\n line-height: 1.5;\n white-space: pre;\n tab-size: 2;\n}\n@media (max-height: 760px) {\n footer.se-import-actions:not(.se-import-actions--inline) {\n margin: 0;\n padding: 0;\n }\n}\n@media (max-width: 900px) {\n .se-import__shell {\n min-height: 0;\n padding: 24px 18px;\n }\n .se-import__content {\n min-height: 0;\n padding-top: 32px;\n }\n .se-import-stepper {\n grid-template-columns: repeat(auto-fit, minmax(70px, 1fr));\n }\n .se-import-step__label {\n font-size: 13px;\n }\n .se-import-grid--four,\n .se-import-grid--two,\n .se-import-transfer {\n grid-template-columns: 1fr;\n }\n .se-import-transfer {\n justify-items: center;\n }\n .se-import-transfer__files {\n width: min(360px, 100%);\n }\n .se-import-option,\n .se-import-row,\n .se-import-asset-row {\n grid-template-columns: 1fr;\n }\n .se-import-mirror-head,\n .se-import-review-card {\n align-items: flex-start;\n flex-direction: column;\n }\n}\n');
|
|
10176
10312
|
|
|
@@ -10261,7 +10397,7 @@ function getJwtInstructionSteps({ pasteHint = "above" } = {}) {
|
|
|
10261
10397
|
}
|
|
10262
10398
|
|
|
10263
10399
|
// src/se-import/ui/SEImportWizard.tsx
|
|
10264
|
-
import { Fragment as Fragment14, jsx as
|
|
10400
|
+
import { Fragment as Fragment14, jsx as jsx38, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
10265
10401
|
function buildOverlaySaveBody(result, name, preview) {
|
|
10266
10402
|
return {
|
|
10267
10403
|
name: name.trim() || result.overlay.name,
|
|
@@ -10340,8 +10476,8 @@ function panelClass(extra) {
|
|
|
10340
10476
|
}
|
|
10341
10477
|
function ErrorPanel({ message, hint }) {
|
|
10342
10478
|
return /* @__PURE__ */ jsxs27("div", { className: "se-import-error", children: [
|
|
10343
|
-
/* @__PURE__ */
|
|
10344
|
-
hint && /* @__PURE__ */
|
|
10479
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-error__title", children: message }),
|
|
10480
|
+
hint && /* @__PURE__ */ jsx38("div", { className: "se-import-error__hint", children: hint })
|
|
10345
10481
|
] });
|
|
10346
10482
|
}
|
|
10347
10483
|
function Field({
|
|
@@ -10351,7 +10487,7 @@ function Field({
|
|
|
10351
10487
|
placeholder,
|
|
10352
10488
|
disabled
|
|
10353
10489
|
}) {
|
|
10354
|
-
return /* @__PURE__ */
|
|
10490
|
+
return /* @__PURE__ */ jsx38("div", { className: "se-import-field", children: /* @__PURE__ */ jsx38(
|
|
10355
10491
|
LSInput,
|
|
10356
10492
|
{
|
|
10357
10493
|
label,
|
|
@@ -10363,7 +10499,7 @@ function Field({
|
|
|
10363
10499
|
) });
|
|
10364
10500
|
}
|
|
10365
10501
|
function ProgressBar({ value, max }) {
|
|
10366
|
-
return /* @__PURE__ */
|
|
10502
|
+
return /* @__PURE__ */ jsx38("progress", { className: "se-import-progress", value: max > 0 ? value : 0, max: max || 1 });
|
|
10367
10503
|
}
|
|
10368
10504
|
function StatusCard({
|
|
10369
10505
|
label,
|
|
@@ -10375,12 +10511,12 @@ function StatusCard({
|
|
|
10375
10511
|
}) {
|
|
10376
10512
|
return /* @__PURE__ */ jsxs27("div", { className: `se-import-stat se-import-stat--${tone}`, children: [
|
|
10377
10513
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-stat__label", children: [
|
|
10378
|
-
icon && /* @__PURE__ */
|
|
10379
|
-
/* @__PURE__ */
|
|
10514
|
+
icon && /* @__PURE__ */ jsx38("img", { src: icon, alt: "", className: "se-import-stat__icon" }),
|
|
10515
|
+
/* @__PURE__ */ jsx38("span", { children: label })
|
|
10380
10516
|
] }),
|
|
10381
|
-
/* @__PURE__ */
|
|
10382
|
-
description && /* @__PURE__ */
|
|
10383
|
-
sub && /* @__PURE__ */
|
|
10517
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-stat__value", children: value }),
|
|
10518
|
+
description && /* @__PURE__ */ jsx38("div", { className: "se-import-stat__description", children: description }),
|
|
10519
|
+
sub && /* @__PURE__ */ jsx38("div", { className: "se-import-stat__sub", children: sub })
|
|
10384
10520
|
] });
|
|
10385
10521
|
}
|
|
10386
10522
|
function CoverageCards({ coverage }) {
|
|
@@ -10421,7 +10557,7 @@ function CoverageCards({ coverage }) {
|
|
|
10421
10557
|
}
|
|
10422
10558
|
].filter((card) => card.value > 0);
|
|
10423
10559
|
if (cards.length === 0) return null;
|
|
10424
|
-
return /* @__PURE__ */
|
|
10560
|
+
return /* @__PURE__ */ jsx38("div", { className: "se-import-grid se-import-grid--stats", children: cards.map((card) => /* @__PURE__ */ jsx38(
|
|
10425
10561
|
StatusCard,
|
|
10426
10562
|
{
|
|
10427
10563
|
label: card.label,
|
|
@@ -10458,7 +10594,7 @@ ${safeJs}
|
|
|
10458
10594
|
})().catch(__seImportShowError);
|
|
10459
10595
|
</script></body></html>`;
|
|
10460
10596
|
}, [html, css, js, data]);
|
|
10461
|
-
return /* @__PURE__ */
|
|
10597
|
+
return /* @__PURE__ */ jsx38(
|
|
10462
10598
|
"iframe",
|
|
10463
10599
|
{
|
|
10464
10600
|
title: "ai-preview",
|
|
@@ -10476,10 +10612,10 @@ function StepHeader({
|
|
|
10476
10612
|
subtitle
|
|
10477
10613
|
}) {
|
|
10478
10614
|
return /* @__PURE__ */ jsxs27("div", { className: "se-import-section-title", children: [
|
|
10479
|
-
/* @__PURE__ */
|
|
10615
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-section-title__num", children: number }),
|
|
10480
10616
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-section-title__content", children: [
|
|
10481
|
-
/* @__PURE__ */
|
|
10482
|
-
subtitle && /* @__PURE__ */
|
|
10617
|
+
/* @__PURE__ */ jsx38("h3", { children: title }),
|
|
10618
|
+
subtitle && /* @__PURE__ */ jsx38("p", { children: subtitle })
|
|
10483
10619
|
] })
|
|
10484
10620
|
] });
|
|
10485
10621
|
}
|
|
@@ -10540,8 +10676,8 @@ function ModeCard({
|
|
|
10540
10676
|
e.currentTarget.style.transform = "translateY(0)";
|
|
10541
10677
|
},
|
|
10542
10678
|
children: [
|
|
10543
|
-
icon && /* @__PURE__ */
|
|
10544
|
-
/* @__PURE__ */
|
|
10679
|
+
icon && /* @__PURE__ */ jsx38("span", { className: "se-import-mode-card__icon", children: /* @__PURE__ */ jsx38("img", { src: icon, alt: "" }) }),
|
|
10680
|
+
/* @__PURE__ */ jsx38(
|
|
10545
10681
|
"div",
|
|
10546
10682
|
{
|
|
10547
10683
|
style: {
|
|
@@ -10552,7 +10688,7 @@ function ModeCard({
|
|
|
10552
10688
|
children: title
|
|
10553
10689
|
}
|
|
10554
10690
|
),
|
|
10555
|
-
/* @__PURE__ */
|
|
10691
|
+
/* @__PURE__ */ jsx38(
|
|
10556
10692
|
"div",
|
|
10557
10693
|
{
|
|
10558
10694
|
style: {
|
|
@@ -10564,7 +10700,7 @@ function ModeCard({
|
|
|
10564
10700
|
children: body
|
|
10565
10701
|
}
|
|
10566
10702
|
),
|
|
10567
|
-
caveat && /* @__PURE__ */
|
|
10703
|
+
caveat && /* @__PURE__ */ jsx38("div", { style: { fontSize: 12, color: "var(--se-muted)", marginTop: "auto" }, children: caveat })
|
|
10568
10704
|
]
|
|
10569
10705
|
}
|
|
10570
10706
|
);
|
|
@@ -10575,7 +10711,7 @@ function StepModePicker({
|
|
|
10575
10711
|
onOpenFullImport
|
|
10576
10712
|
}) {
|
|
10577
10713
|
return /* @__PURE__ */ jsxs27("div", { className: panelClass("se-import-panel--wide"), children: [
|
|
10578
|
-
/* @__PURE__ */
|
|
10714
|
+
/* @__PURE__ */ jsx38(
|
|
10579
10715
|
StepHeader,
|
|
10580
10716
|
{
|
|
10581
10717
|
number: 1,
|
|
@@ -10593,19 +10729,19 @@ function StepModePicker({
|
|
|
10593
10729
|
marginTop: onOpenFullImport ? 18 : 8
|
|
10594
10730
|
},
|
|
10595
10731
|
children: [
|
|
10596
|
-
onOpenFullImport && /* @__PURE__ */
|
|
10732
|
+
onOpenFullImport && /* @__PURE__ */ jsx38(
|
|
10597
10733
|
ModeCard,
|
|
10598
10734
|
{
|
|
10599
10735
|
title: "Move your full StreamElements setup",
|
|
10600
10736
|
icon: source_se_default,
|
|
10601
10737
|
body: /* @__PURE__ */ jsxs27(Fragment14, { children: [
|
|
10602
|
-
/* @__PURE__ */
|
|
10603
|
-
/* @__PURE__ */
|
|
10738
|
+
/* @__PURE__ */ jsx38("div", { style: { marginBottom: 12 }, children: "Open the dedicated Lumia Stream import page for counters, commands, loyalty, timers, tips, and activity." }),
|
|
10739
|
+
/* @__PURE__ */ jsx38("ul", { className: "se-import-mode-card__features", children: FULL_IMPORT_FEATURES.map((feat) => /* @__PURE__ */ jsx38("li", { children: feat }, feat)) })
|
|
10604
10740
|
] }),
|
|
10605
10741
|
onClick: onOpenFullImport
|
|
10606
10742
|
}
|
|
10607
10743
|
),
|
|
10608
|
-
/* @__PURE__ */
|
|
10744
|
+
/* @__PURE__ */ jsx38(
|
|
10609
10745
|
ModeCard,
|
|
10610
10746
|
{
|
|
10611
10747
|
primary: true,
|
|
@@ -10613,18 +10749,18 @@ function StepModePicker({
|
|
|
10613
10749
|
icon: assets_default,
|
|
10614
10750
|
body: /* @__PURE__ */ jsxs27(Fragment14, { children: [
|
|
10615
10751
|
"Paste a single overlay's public preview URL to bring just that overlay over.",
|
|
10616
|
-
/* @__PURE__ */
|
|
10752
|
+
/* @__PURE__ */ jsx38("div", { style: { marginTop: 10, color: "var(--se-muted)" }, children: "No login required \u2014 perfect for trying one overlay before deciding whether to migrate your whole account." })
|
|
10617
10753
|
] }),
|
|
10618
10754
|
onClick: onChooseUrl
|
|
10619
10755
|
}
|
|
10620
10756
|
),
|
|
10621
|
-
!onOpenFullImport && /* @__PURE__ */
|
|
10757
|
+
!onOpenFullImport && /* @__PURE__ */ jsx38(
|
|
10622
10758
|
ModeCard,
|
|
10623
10759
|
{
|
|
10624
10760
|
title: "Import everything from StreamElements",
|
|
10625
10761
|
body: /* @__PURE__ */ jsxs27(Fragment14, { children: [
|
|
10626
|
-
/* @__PURE__ */
|
|
10627
|
-
/* @__PURE__ */
|
|
10762
|
+
/* @__PURE__ */ jsx38("div", { style: { marginBottom: 10 }, children: "Connect once and bring over your entire SE setup:" }),
|
|
10763
|
+
/* @__PURE__ */ jsx38(
|
|
10628
10764
|
"ul",
|
|
10629
10765
|
{
|
|
10630
10766
|
style: {
|
|
@@ -10634,7 +10770,7 @@ function StepModePicker({
|
|
|
10634
10770
|
gap: 6,
|
|
10635
10771
|
fontSize: 13
|
|
10636
10772
|
},
|
|
10637
|
-
children: JWT_FEATURES.map((feat) => /* @__PURE__ */
|
|
10773
|
+
children: JWT_FEATURES.map((feat) => /* @__PURE__ */ jsx38("li", { children: feat }, feat))
|
|
10638
10774
|
}
|
|
10639
10775
|
)
|
|
10640
10776
|
] }),
|
|
@@ -10658,7 +10794,7 @@ function StepConnect({
|
|
|
10658
10794
|
onUseUrl
|
|
10659
10795
|
}) {
|
|
10660
10796
|
return /* @__PURE__ */ jsxs27("div", { className: panelClass("se-import-panel--narrow"), children: [
|
|
10661
|
-
/* @__PURE__ */
|
|
10797
|
+
/* @__PURE__ */ jsx38(
|
|
10662
10798
|
StepHeader,
|
|
10663
10799
|
{
|
|
10664
10800
|
number: 1,
|
|
@@ -10666,7 +10802,7 @@ function StepConnect({
|
|
|
10666
10802
|
subtitle: "Paste your StreamElements JWT to import overlays, live counters, chat commands, loyalty points, watch time, and recent events. The token is read in your browser only. Lumia never sends it to our servers."
|
|
10667
10803
|
}
|
|
10668
10804
|
),
|
|
10669
|
-
/* @__PURE__ */
|
|
10805
|
+
/* @__PURE__ */ jsx38(
|
|
10670
10806
|
Field,
|
|
10671
10807
|
{
|
|
10672
10808
|
label: "StreamElements JWT",
|
|
@@ -10677,15 +10813,15 @@ function StepConnect({
|
|
|
10677
10813
|
}
|
|
10678
10814
|
),
|
|
10679
10815
|
busy && /* @__PURE__ */ jsxs27("div", { className: "se-import-token-loading", "aria-live": "polite", children: [
|
|
10680
|
-
/* @__PURE__ */
|
|
10681
|
-
/* @__PURE__ */
|
|
10816
|
+
/* @__PURE__ */ jsx38("span", { className: "se-import-spinner" }),
|
|
10817
|
+
/* @__PURE__ */ jsx38("span", { children: "Checking your token and loading StreamElements data." })
|
|
10682
10818
|
] }),
|
|
10683
10819
|
channels && channels.length > 1 && /* @__PURE__ */ jsxs27("div", { className: "se-import-help se-import-help--info", children: [
|
|
10684
|
-
/* @__PURE__ */
|
|
10820
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-help__icon", children: "i" }),
|
|
10685
10821
|
/* @__PURE__ */ jsxs27("div", { children: [
|
|
10686
|
-
/* @__PURE__ */
|
|
10687
|
-
/* @__PURE__ */
|
|
10688
|
-
/* @__PURE__ */
|
|
10822
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-help__title", children: "Pick a channel" }),
|
|
10823
|
+
/* @__PURE__ */ jsx38("p", { children: "This account has multiple StreamElements channels. Choose which one to import from." }),
|
|
10824
|
+
/* @__PURE__ */ jsx38("div", { style: { display: "grid", gap: 8, marginTop: 12 }, children: channels.map((c) => /* @__PURE__ */ jsxs27(
|
|
10689
10825
|
"label",
|
|
10690
10826
|
{
|
|
10691
10827
|
style: {
|
|
@@ -10699,7 +10835,7 @@ function StepConnect({
|
|
|
10699
10835
|
cursor: "pointer"
|
|
10700
10836
|
},
|
|
10701
10837
|
children: [
|
|
10702
|
-
/* @__PURE__ */
|
|
10838
|
+
/* @__PURE__ */ jsx38(
|
|
10703
10839
|
"input",
|
|
10704
10840
|
{
|
|
10705
10841
|
type: "radio",
|
|
@@ -10708,7 +10844,7 @@ function StepConnect({
|
|
|
10708
10844
|
onChange: () => setSelectedChannelId(c._id)
|
|
10709
10845
|
}
|
|
10710
10846
|
),
|
|
10711
|
-
c.avatar && /* @__PURE__ */
|
|
10847
|
+
c.avatar && /* @__PURE__ */ jsx38(
|
|
10712
10848
|
"img",
|
|
10713
10849
|
{
|
|
10714
10850
|
src: c.avatar,
|
|
@@ -10719,7 +10855,7 @@ function StepConnect({
|
|
|
10719
10855
|
}
|
|
10720
10856
|
),
|
|
10721
10857
|
/* @__PURE__ */ jsxs27("div", { style: { display: "flex", flexDirection: "column" }, children: [
|
|
10722
|
-
/* @__PURE__ */
|
|
10858
|
+
/* @__PURE__ */ jsx38("span", { style: { fontWeight: 700 }, children: c.displayName ?? c.username }),
|
|
10723
10859
|
/* @__PURE__ */ jsxs27("span", { style: { fontSize: 12, color: "var(--se-muted)" }, children: [
|
|
10724
10860
|
c.provider,
|
|
10725
10861
|
" \xB7 ",
|
|
@@ -10733,16 +10869,16 @@ function StepConnect({
|
|
|
10733
10869
|
] })
|
|
10734
10870
|
] }),
|
|
10735
10871
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-help", children: [
|
|
10736
|
-
/* @__PURE__ */
|
|
10872
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-help__icon", children: "i" }),
|
|
10737
10873
|
/* @__PURE__ */ jsxs27("div", { children: [
|
|
10738
|
-
/* @__PURE__ */
|
|
10739
|
-
/* @__PURE__ */
|
|
10874
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-help__title", children: "How to find your JWT" }),
|
|
10875
|
+
/* @__PURE__ */ jsx38("ol", { children: getJwtInstructionSteps({ pasteHint: "above" }).map((step, i) => /* @__PURE__ */ jsx38("li", { children: step.content }, i)) })
|
|
10740
10876
|
] })
|
|
10741
10877
|
] }),
|
|
10742
10878
|
/* @__PURE__ */ jsxs27("div", { style: { marginTop: 16, fontSize: 13, color: "var(--se-muted)" }, children: [
|
|
10743
10879
|
"Prefer to import just a single overlay without logging in?",
|
|
10744
10880
|
" ",
|
|
10745
|
-
/* @__PURE__ */
|
|
10881
|
+
/* @__PURE__ */ jsx38(
|
|
10746
10882
|
"a",
|
|
10747
10883
|
{
|
|
10748
10884
|
href: "#",
|
|
@@ -10756,7 +10892,7 @@ function StepConnect({
|
|
|
10756
10892
|
),
|
|
10757
10893
|
"."
|
|
10758
10894
|
] }),
|
|
10759
|
-
error && /* @__PURE__ */
|
|
10895
|
+
error && /* @__PURE__ */ jsx38(ErrorPanel, { message: error.message, hint: error.hint })
|
|
10760
10896
|
] });
|
|
10761
10897
|
}
|
|
10762
10898
|
function StepPickOverlay({
|
|
@@ -10774,7 +10910,7 @@ function StepPickOverlay({
|
|
|
10774
10910
|
const allSelected = total > 0 && selectedCount === total;
|
|
10775
10911
|
const hasAnySelected = selectedCount > 0;
|
|
10776
10912
|
return /* @__PURE__ */ jsxs27("div", { className: panelClass("se-import-panel--wide"), children: [
|
|
10777
|
-
/* @__PURE__ */
|
|
10913
|
+
/* @__PURE__ */ jsx38(
|
|
10778
10914
|
StepHeader,
|
|
10779
10915
|
{
|
|
10780
10916
|
number: 2,
|
|
@@ -10783,18 +10919,18 @@ function StepPickOverlay({
|
|
|
10783
10919
|
}
|
|
10784
10920
|
),
|
|
10785
10921
|
loading && /* @__PURE__ */ jsxs27("div", { className: "se-import-help se-import-help--info", children: [
|
|
10786
|
-
/* @__PURE__ */
|
|
10787
|
-
/* @__PURE__ */
|
|
10922
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-help__icon", children: "\u2026" }),
|
|
10923
|
+
/* @__PURE__ */ jsx38("div", { children: "Fetching your StreamElements overlays." })
|
|
10788
10924
|
] }),
|
|
10789
10925
|
error && /* @__PURE__ */ jsxs27(Fragment14, { children: [
|
|
10790
|
-
/* @__PURE__ */
|
|
10791
|
-
/* @__PURE__ */
|
|
10926
|
+
/* @__PURE__ */ jsx38(ErrorPanel, { message: error.message, hint: error.hint }),
|
|
10927
|
+
/* @__PURE__ */ jsx38("div", { style: { marginTop: 12 }, children: /* @__PURE__ */ jsx38(LSButton, { type: "button", color: "secondary", onClick: onRetry, label: "Retry" }) })
|
|
10792
10928
|
] }),
|
|
10793
10929
|
!loading && !error && overlays && overlays.length === 0 && /* @__PURE__ */ jsxs27("div", { className: "se-import-help se-import-help--info", children: [
|
|
10794
|
-
/* @__PURE__ */
|
|
10930
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-help__icon", children: "i" }),
|
|
10795
10931
|
/* @__PURE__ */ jsxs27("div", { children: [
|
|
10796
|
-
/* @__PURE__ */
|
|
10797
|
-
/* @__PURE__ */
|
|
10932
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-help__title", children: "No overlays found" }),
|
|
10933
|
+
/* @__PURE__ */ jsx38("p", { children: "This StreamElements account doesn't have any overlays yet. Create one in the SE dashboard, or use the legacy preview URL flow from the Connect step." })
|
|
10798
10934
|
] })
|
|
10799
10935
|
] }),
|
|
10800
10936
|
!loading && !error && overlays && overlays.length > 0 && /* @__PURE__ */ jsxs27(Fragment14, { children: [
|
|
@@ -10822,7 +10958,7 @@ function StepPickOverlay({
|
|
|
10822
10958
|
fontWeight: 600
|
|
10823
10959
|
},
|
|
10824
10960
|
children: [
|
|
10825
|
-
/* @__PURE__ */
|
|
10961
|
+
/* @__PURE__ */ jsx38(
|
|
10826
10962
|
LSCheckbox,
|
|
10827
10963
|
{
|
|
10828
10964
|
checked: allSelected,
|
|
@@ -10842,11 +10978,11 @@ function StepPickOverlay({
|
|
|
10842
10978
|
]
|
|
10843
10979
|
}
|
|
10844
10980
|
),
|
|
10845
|
-
/* @__PURE__ */
|
|
10981
|
+
/* @__PURE__ */ jsx38("span", { style: { fontSize: 13, color: "var(--se-muted)" }, children: hasAnySelected ? selectedCount > 1 ? `${selectedCount} overlays selected. Each will be created as its own Lumia overlay.` : "1 overlay selected. It will open the full review flow." : "Click overlays below to select them." })
|
|
10846
10982
|
]
|
|
10847
10983
|
}
|
|
10848
10984
|
),
|
|
10849
|
-
/* @__PURE__ */
|
|
10985
|
+
/* @__PURE__ */ jsx38(
|
|
10850
10986
|
"div",
|
|
10851
10987
|
{
|
|
10852
10988
|
className: "se-import-grid",
|
|
@@ -10872,7 +11008,7 @@ function StepPickOverlay({
|
|
|
10872
11008
|
transition: "border-color 120ms, background 120ms"
|
|
10873
11009
|
},
|
|
10874
11010
|
children: [
|
|
10875
|
-
/* @__PURE__ */
|
|
11011
|
+
/* @__PURE__ */ jsx38(
|
|
10876
11012
|
LSCheckbox,
|
|
10877
11013
|
{
|
|
10878
11014
|
checked: selected,
|
|
@@ -10886,7 +11022,7 @@ function StepPickOverlay({
|
|
|
10886
11022
|
}
|
|
10887
11023
|
}
|
|
10888
11024
|
),
|
|
10889
|
-
o.preview ? /* @__PURE__ */
|
|
11025
|
+
o.preview ? /* @__PURE__ */ jsx38(
|
|
10890
11026
|
"img",
|
|
10891
11027
|
{
|
|
10892
11028
|
src: o.preview,
|
|
@@ -10900,7 +11036,7 @@ function StepPickOverlay({
|
|
|
10900
11036
|
},
|
|
10901
11037
|
loading: "lazy"
|
|
10902
11038
|
}
|
|
10903
|
-
) : /* @__PURE__ */
|
|
11039
|
+
) : /* @__PURE__ */ jsx38(
|
|
10904
11040
|
"div",
|
|
10905
11041
|
{
|
|
10906
11042
|
style: {
|
|
@@ -10911,7 +11047,7 @@ function StepPickOverlay({
|
|
|
10911
11047
|
}
|
|
10912
11048
|
}
|
|
10913
11049
|
),
|
|
10914
|
-
/* @__PURE__ */
|
|
11050
|
+
/* @__PURE__ */ jsx38(
|
|
10915
11051
|
"div",
|
|
10916
11052
|
{
|
|
10917
11053
|
style: {
|
|
@@ -10970,7 +11106,7 @@ function StepURL({
|
|
|
10970
11106
|
onSwitchToJwt
|
|
10971
11107
|
}) {
|
|
10972
11108
|
return /* @__PURE__ */ jsxs27("div", { className: panelClass("se-import-panel--narrow"), children: [
|
|
10973
|
-
/* @__PURE__ */
|
|
11109
|
+
/* @__PURE__ */ jsx38(
|
|
10974
11110
|
StepHeader,
|
|
10975
11111
|
{
|
|
10976
11112
|
number: 1,
|
|
@@ -10978,7 +11114,7 @@ function StepURL({
|
|
|
10978
11114
|
subtitle: "StreamElements (classic or Element). The wizard auto-detects which one you pasted."
|
|
10979
11115
|
}
|
|
10980
11116
|
),
|
|
10981
|
-
/* @__PURE__ */
|
|
11117
|
+
/* @__PURE__ */ jsx38(
|
|
10982
11118
|
LSInput,
|
|
10983
11119
|
{
|
|
10984
11120
|
label: "Overlay URL",
|
|
@@ -10989,14 +11125,14 @@ function StepURL({
|
|
|
10989
11125
|
}
|
|
10990
11126
|
),
|
|
10991
11127
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-help", children: [
|
|
10992
|
-
/* @__PURE__ */
|
|
11128
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-help__icon", children: "i" }),
|
|
10993
11129
|
/* @__PURE__ */ jsxs27("div", { children: [
|
|
10994
|
-
/* @__PURE__ */
|
|
11130
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-help__title", children: "How to find the overlay URL" }),
|
|
10995
11131
|
/* @__PURE__ */ jsxs27("ol", { children: [
|
|
10996
11132
|
/* @__PURE__ */ jsxs27("li", { children: [
|
|
10997
11133
|
"Open",
|
|
10998
11134
|
" ",
|
|
10999
|
-
/* @__PURE__ */
|
|
11135
|
+
/* @__PURE__ */ jsx38(
|
|
11000
11136
|
"a",
|
|
11001
11137
|
{
|
|
11002
11138
|
href: "https://streamelements.com/dashboard/overlays",
|
|
@@ -11007,14 +11143,14 @@ function StepURL({
|
|
|
11007
11143
|
),
|
|
11008
11144
|
"."
|
|
11009
11145
|
] }),
|
|
11010
|
-
/* @__PURE__ */
|
|
11011
|
-
/* @__PURE__ */
|
|
11012
|
-
/* @__PURE__ */
|
|
11146
|
+
/* @__PURE__ */ jsx38("li", { children: "Click the overlay you want to bring over." }),
|
|
11147
|
+
/* @__PURE__ */ jsx38("li", { children: "Click Copy URL in the top right of the editor." }),
|
|
11148
|
+
/* @__PURE__ */ jsx38("li", { children: "Paste it above." })
|
|
11013
11149
|
] })
|
|
11014
11150
|
] })
|
|
11015
11151
|
] }),
|
|
11016
|
-
error && /* @__PURE__ */
|
|
11017
|
-
error?.editorUrl && onSwitchToJwt && /* @__PURE__ */
|
|
11152
|
+
error && /* @__PURE__ */ jsx38(ErrorPanel, { message: error.message, hint: error.hint }),
|
|
11153
|
+
error?.editorUrl && onSwitchToJwt && /* @__PURE__ */ jsx38("div", { style: { marginTop: 12 }, children: /* @__PURE__ */ jsx38(
|
|
11018
11154
|
LSButton,
|
|
11019
11155
|
{
|
|
11020
11156
|
type: "button",
|
|
@@ -11080,14 +11216,14 @@ function StepDiscovery({
|
|
|
11080
11216
|
}
|
|
11081
11217
|
].filter((card) => card.value > 0);
|
|
11082
11218
|
return /* @__PURE__ */ jsxs27("div", { className: panelClass("se-import-panel--wide"), children: [
|
|
11083
|
-
/* @__PURE__ */
|
|
11219
|
+
/* @__PURE__ */ jsx38(
|
|
11084
11220
|
StepHeader,
|
|
11085
11221
|
{
|
|
11086
11222
|
number: 2,
|
|
11087
11223
|
title: overlayCount > 1 ? "Here's what we found in your overlays" : "Here's what we found in your overlay"
|
|
11088
11224
|
}
|
|
11089
11225
|
),
|
|
11090
|
-
topCards.length > 0 && /* @__PURE__ */
|
|
11226
|
+
topCards.length > 0 && /* @__PURE__ */ jsx38("div", { className: "se-import-grid se-import-grid--stats", children: topCards.map((card) => /* @__PURE__ */ jsx38(
|
|
11091
11227
|
StatusCard,
|
|
11092
11228
|
{
|
|
11093
11229
|
label: card.label,
|
|
@@ -11097,8 +11233,8 @@ function StepDiscovery({
|
|
|
11097
11233
|
},
|
|
11098
11234
|
card.key
|
|
11099
11235
|
)) }),
|
|
11100
|
-
/* @__PURE__ */
|
|
11101
|
-
reviewCount > 0 && /* @__PURE__ */
|
|
11236
|
+
/* @__PURE__ */ jsx38(CoverageCards, { coverage: result.coverage }),
|
|
11237
|
+
reviewCount > 0 && /* @__PURE__ */ jsx38("div", { className: "se-import-grid se-import-grid--two", children: /* @__PURE__ */ jsx38(
|
|
11102
11238
|
StatusCard,
|
|
11103
11239
|
{
|
|
11104
11240
|
label: "Review choices",
|
|
@@ -11117,18 +11253,18 @@ function StepOptions({
|
|
|
11117
11253
|
hideName = false
|
|
11118
11254
|
}) {
|
|
11119
11255
|
return /* @__PURE__ */ jsxs27("div", { className: panelClass("se-import-panel--medium"), children: [
|
|
11120
|
-
/* @__PURE__ */
|
|
11256
|
+
/* @__PURE__ */ jsx38(StepHeader, { number: 3, title: "Options", subtitle: "Choose how to handle your assets" }),
|
|
11121
11257
|
/* @__PURE__ */ jsxs27("label", { className: `se-import-option ${assetCount === 0 ? "se-import-option--disabled" : ""}`, children: [
|
|
11122
|
-
/* @__PURE__ */
|
|
11258
|
+
/* @__PURE__ */ jsx38("span", { className: "se-import-option__icon", children: /* @__PURE__ */ jsx38("img", { src: assets_default, alt: "" }) }),
|
|
11123
11259
|
/* @__PURE__ */ jsxs27("span", { className: "se-import-option__body", children: [
|
|
11124
|
-
/* @__PURE__ */
|
|
11125
|
-
/* @__PURE__ */
|
|
11260
|
+
/* @__PURE__ */ jsx38("span", { className: "se-import-option__title", children: "Mirror StreamElements assets to Lumia storage" }),
|
|
11261
|
+
/* @__PURE__ */ jsx38("span", { className: "se-import-option__copy", children: "Downloads every cdn.streamelements.com URL referenced in the overlay, uploads it to your Lumia asset library, then rewrites the URLs." })
|
|
11126
11262
|
] }),
|
|
11127
11263
|
/* @__PURE__ */ jsxs27("span", { className: "se-import-option__count", children: [
|
|
11128
11264
|
assetCount,
|
|
11129
11265
|
" files"
|
|
11130
11266
|
] }),
|
|
11131
|
-
/* @__PURE__ */
|
|
11267
|
+
/* @__PURE__ */ jsx38(
|
|
11132
11268
|
"input",
|
|
11133
11269
|
{
|
|
11134
11270
|
type: "checkbox",
|
|
@@ -11137,9 +11273,9 @@ function StepOptions({
|
|
|
11137
11273
|
onChange: (e) => setOptions({ ...options, mirrorAssets: e.target.checked })
|
|
11138
11274
|
}
|
|
11139
11275
|
),
|
|
11140
|
-
/* @__PURE__ */
|
|
11276
|
+
/* @__PURE__ */ jsx38("span", { className: "se-import-toggle" })
|
|
11141
11277
|
] }),
|
|
11142
|
-
!hideName && /* @__PURE__ */
|
|
11278
|
+
!hideName && /* @__PURE__ */ jsx38(
|
|
11143
11279
|
LSInput,
|
|
11144
11280
|
{
|
|
11145
11281
|
label: "Overlay name",
|
|
@@ -11170,9 +11306,9 @@ function AssetTransferAnimation({ complete }) {
|
|
|
11170
11306
|
className: `se-import-transfer ${complete ? "se-import-transfer--complete" : ""}`,
|
|
11171
11307
|
"aria-hidden": "true",
|
|
11172
11308
|
children: [
|
|
11173
|
-
/* @__PURE__ */
|
|
11309
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-transfer__source se-import-transfer__source--se", children: /* @__PURE__ */ jsx38("img", { src: source_se_default, alt: "" }) }),
|
|
11174
11310
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-transfer__files", children: [
|
|
11175
|
-
/* @__PURE__ */
|
|
11311
|
+
/* @__PURE__ */ jsx38(
|
|
11176
11312
|
"img",
|
|
11177
11313
|
{
|
|
11178
11314
|
className: "se-import-transfer__file se-import-transfer__file--one",
|
|
@@ -11180,7 +11316,7 @@ function AssetTransferAnimation({ complete }) {
|
|
|
11180
11316
|
alt: ""
|
|
11181
11317
|
}
|
|
11182
11318
|
),
|
|
11183
|
-
/* @__PURE__ */
|
|
11319
|
+
/* @__PURE__ */ jsx38(
|
|
11184
11320
|
"img",
|
|
11185
11321
|
{
|
|
11186
11322
|
className: "se-import-transfer__file se-import-transfer__file--two",
|
|
@@ -11188,7 +11324,7 @@ function AssetTransferAnimation({ complete }) {
|
|
|
11188
11324
|
alt: ""
|
|
11189
11325
|
}
|
|
11190
11326
|
),
|
|
11191
|
-
/* @__PURE__ */
|
|
11327
|
+
/* @__PURE__ */ jsx38(
|
|
11192
11328
|
"img",
|
|
11193
11329
|
{
|
|
11194
11330
|
className: "se-import-transfer__file se-import-transfer__file--three",
|
|
@@ -11196,7 +11332,7 @@ function AssetTransferAnimation({ complete }) {
|
|
|
11196
11332
|
alt: ""
|
|
11197
11333
|
}
|
|
11198
11334
|
),
|
|
11199
|
-
/* @__PURE__ */
|
|
11335
|
+
/* @__PURE__ */ jsx38(
|
|
11200
11336
|
"img",
|
|
11201
11337
|
{
|
|
11202
11338
|
className: "se-import-transfer__file se-import-transfer__file--four",
|
|
@@ -11206,8 +11342,8 @@ function AssetTransferAnimation({ complete }) {
|
|
|
11206
11342
|
)
|
|
11207
11343
|
] }),
|
|
11208
11344
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-transfer__source se-import-transfer__source--lumia", children: [
|
|
11209
|
-
/* @__PURE__ */
|
|
11210
|
-
complete && /* @__PURE__ */
|
|
11345
|
+
/* @__PURE__ */ jsx38("img", { src: source_lumia_default, alt: "" }),
|
|
11346
|
+
complete && /* @__PURE__ */ jsx38("span", { className: "se-import-transfer__done", children: "\u2713" })
|
|
11211
11347
|
] })
|
|
11212
11348
|
]
|
|
11213
11349
|
}
|
|
@@ -11227,7 +11363,7 @@ function StepMirror({
|
|
|
11227
11363
|
const complete = !running && completed >= rows.length;
|
|
11228
11364
|
const summary = running ? `Downloading... (${done + reused + keptOnCdn}/${rows.length})` : `Finished. ${done} mirrored${reused ? `, ${reused} reused` : ""}${keptOnCdn ? `, ${keptOnCdn} kept on CDN` : ""}${failed ? `, ${failed} failed` : ""}.`;
|
|
11229
11365
|
return /* @__PURE__ */ jsxs27("div", { className: panelClass("se-import-panel--wide"), children: [
|
|
11230
|
-
/* @__PURE__ */
|
|
11366
|
+
/* @__PURE__ */ jsx38(
|
|
11231
11367
|
StepHeader,
|
|
11232
11368
|
{
|
|
11233
11369
|
number: 4,
|
|
@@ -11235,20 +11371,20 @@ function StepMirror({
|
|
|
11235
11371
|
subtitle: "We're downloading your assets from StreamElements and preparing them for import."
|
|
11236
11372
|
}
|
|
11237
11373
|
),
|
|
11238
|
-
/* @__PURE__ */
|
|
11374
|
+
/* @__PURE__ */ jsx38(AssetTransferAnimation, { complete }),
|
|
11239
11375
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-mirror-head", children: [
|
|
11240
|
-
/* @__PURE__ */
|
|
11241
|
-
/* @__PURE__ */
|
|
11376
|
+
/* @__PURE__ */ jsx38("span", { children: summary }),
|
|
11377
|
+
/* @__PURE__ */ jsx38(ProgressBar, { value: completed, max: rows.length }),
|
|
11242
11378
|
/* @__PURE__ */ jsxs27("strong", { children: [
|
|
11243
11379
|
percent,
|
|
11244
11380
|
"%"
|
|
11245
11381
|
] })
|
|
11246
11382
|
] }),
|
|
11247
|
-
/* @__PURE__ */
|
|
11248
|
-
/* @__PURE__ */
|
|
11249
|
-
/* @__PURE__ */
|
|
11250
|
-
/* @__PURE__ */
|
|
11251
|
-
row.state === "failed" && /* @__PURE__ */
|
|
11383
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-asset-list", children: rows.map((row, index) => /* @__PURE__ */ jsxs27("div", { className: `se-import-asset-row se-import-asset-row--${row.state}`, children: [
|
|
11384
|
+
/* @__PURE__ */ jsx38("img", { className: "se-import-asset-row__icon", src: fileTypeIcon(row.url), alt: "" }),
|
|
11385
|
+
/* @__PURE__ */ jsx38("span", { className: "se-import-asset-row__url", title: row.url, children: row.url }),
|
|
11386
|
+
/* @__PURE__ */ jsx38("span", { className: "se-import-asset-row__state", children: mirrorLabel(row.state) }),
|
|
11387
|
+
row.state === "failed" && /* @__PURE__ */ jsx38(
|
|
11252
11388
|
LSButton,
|
|
11253
11389
|
{
|
|
11254
11390
|
type: "button",
|
|
@@ -11260,7 +11396,7 @@ function StepMirror({
|
|
|
11260
11396
|
label: "Retry"
|
|
11261
11397
|
}
|
|
11262
11398
|
),
|
|
11263
|
-
row.error && /* @__PURE__ */
|
|
11399
|
+
row.error && /* @__PURE__ */ jsx38("span", { className: "se-import-asset-row__error", children: row.error })
|
|
11264
11400
|
] }, row.url)) })
|
|
11265
11401
|
] });
|
|
11266
11402
|
}
|
|
@@ -11284,7 +11420,7 @@ function StepReview({
|
|
|
11284
11420
|
marketplaceAvailable
|
|
11285
11421
|
}) {
|
|
11286
11422
|
return /* @__PURE__ */ jsxs27("div", { className: panelClass("se-import-panel--medium"), children: [
|
|
11287
|
-
/* @__PURE__ */
|
|
11423
|
+
/* @__PURE__ */ jsx38(
|
|
11288
11424
|
StepHeader,
|
|
11289
11425
|
{
|
|
11290
11426
|
number: 4,
|
|
@@ -11294,10 +11430,10 @@ function StepReview({
|
|
|
11294
11430
|
),
|
|
11295
11431
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-review-card", children: [
|
|
11296
11432
|
/* @__PURE__ */ jsxs27("div", { children: [
|
|
11297
|
-
/* @__PURE__ */
|
|
11298
|
-
/* @__PURE__ */
|
|
11433
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-review-card__type", children: item.seWidget.type }),
|
|
11434
|
+
/* @__PURE__ */ jsx38("p", { children: item.reason })
|
|
11299
11435
|
] }),
|
|
11300
|
-
/* @__PURE__ */
|
|
11436
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-review-card__status", children: item.flaggedOff ? "Auto-import disabled" : item.status })
|
|
11301
11437
|
] }),
|
|
11302
11438
|
remainingCount > 1 && /* Bulk-action row — shortcut to wrap up the review step when there are still
|
|
11303
11439
|
several unactioned widgets and the user doesn't want to walk each one. */
|
|
@@ -11306,7 +11442,7 @@ function StepReview({
|
|
|
11306
11442
|
remainingCount,
|
|
11307
11443
|
" remaining"
|
|
11308
11444
|
] }),
|
|
11309
|
-
/* @__PURE__ */
|
|
11445
|
+
/* @__PURE__ */ jsx38(
|
|
11310
11446
|
LSButton,
|
|
11311
11447
|
{
|
|
11312
11448
|
type: "button",
|
|
@@ -11316,7 +11452,7 @@ function StepReview({
|
|
|
11316
11452
|
label: "Keep all placeholders"
|
|
11317
11453
|
}
|
|
11318
11454
|
),
|
|
11319
|
-
/* @__PURE__ */
|
|
11455
|
+
/* @__PURE__ */ jsx38(
|
|
11320
11456
|
LSButton,
|
|
11321
11457
|
{
|
|
11322
11458
|
type: "button",
|
|
@@ -11327,12 +11463,12 @@ function StepReview({
|
|
|
11327
11463
|
}
|
|
11328
11464
|
)
|
|
11329
11465
|
] }),
|
|
11330
|
-
state === "generating" && /* @__PURE__ */
|
|
11466
|
+
state === "generating" && /* @__PURE__ */ jsx38("div", { className: "se-import-muted", children: "Generating with AI. This can take 30-90 seconds." }),
|
|
11331
11467
|
state === "generated" && generated && /* @__PURE__ */ jsxs27("div", { className: "se-import-generated", children: [
|
|
11332
|
-
/* @__PURE__ */
|
|
11468
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-generated__title", children: "Preview" }),
|
|
11333
11469
|
(() => {
|
|
11334
11470
|
const landing = getAILandingBounds(item.seWidget, canvas);
|
|
11335
|
-
return /* @__PURE__ */
|
|
11471
|
+
return /* @__PURE__ */ jsx38(
|
|
11336
11472
|
CustomOverlayPreview,
|
|
11337
11473
|
{
|
|
11338
11474
|
html: generated.html ?? "",
|
|
@@ -11345,8 +11481,8 @@ function StepReview({
|
|
|
11345
11481
|
);
|
|
11346
11482
|
})(),
|
|
11347
11483
|
/* @__PURE__ */ jsxs27("details", { className: "se-import-code", children: [
|
|
11348
|
-
/* @__PURE__ */
|
|
11349
|
-
/* @__PURE__ */
|
|
11484
|
+
/* @__PURE__ */ jsx38("summary", { children: "Generated code" }),
|
|
11485
|
+
/* @__PURE__ */ jsx38("pre", { children: JSON.stringify(
|
|
11350
11486
|
{
|
|
11351
11487
|
html: generated.html ?? "",
|
|
11352
11488
|
css: generated.css ?? "",
|
|
@@ -11357,15 +11493,15 @@ function StepReview({
|
|
|
11357
11493
|
) })
|
|
11358
11494
|
] })
|
|
11359
11495
|
] }),
|
|
11360
|
-
error && /* @__PURE__ */
|
|
11496
|
+
error && /* @__PURE__ */ jsx38(ErrorPanel, { message: error }),
|
|
11361
11497
|
/* @__PURE__ */ jsxs27("details", { className: "se-import-code", children: [
|
|
11362
|
-
/* @__PURE__ */
|
|
11363
|
-
/* @__PURE__ */
|
|
11498
|
+
/* @__PURE__ */ jsx38("summary", { children: "Original StreamElements config" }),
|
|
11499
|
+
/* @__PURE__ */ jsx38("pre", { children: JSON.stringify(item.seWidget.variables ?? {}, null, 2) })
|
|
11364
11500
|
] }),
|
|
11365
|
-
/* @__PURE__ */
|
|
11366
|
-
/* @__PURE__ */
|
|
11367
|
-
/* @__PURE__ */
|
|
11368
|
-
/* @__PURE__ */
|
|
11501
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-actions se-import-actions--inline", children: state === "generated" ? /* @__PURE__ */ jsxs27(Fragment14, { children: [
|
|
11502
|
+
/* @__PURE__ */ jsx38(LSButton, { type: "button", color: "secondary", onClick: onRetry, label: "Try again" }),
|
|
11503
|
+
/* @__PURE__ */ jsx38(LSButton, { type: "button", color: "secondary", onClick: onSkip, label: "Skip this widget" }),
|
|
11504
|
+
/* @__PURE__ */ jsx38(
|
|
11369
11505
|
LSButton,
|
|
11370
11506
|
{
|
|
11371
11507
|
type: "button",
|
|
@@ -11375,7 +11511,7 @@ function StepReview({
|
|
|
11375
11511
|
}
|
|
11376
11512
|
)
|
|
11377
11513
|
] }) : /* @__PURE__ */ jsxs27(Fragment14, { children: [
|
|
11378
|
-
!item.flaggedOff && /* @__PURE__ */
|
|
11514
|
+
!item.flaggedOff && /* @__PURE__ */ jsx38(
|
|
11379
11515
|
LSButton,
|
|
11380
11516
|
{
|
|
11381
11517
|
type: "button",
|
|
@@ -11385,7 +11521,7 @@ function StepReview({
|
|
|
11385
11521
|
label: "Keep placeholder"
|
|
11386
11522
|
}
|
|
11387
11523
|
),
|
|
11388
|
-
/* @__PURE__ */
|
|
11524
|
+
/* @__PURE__ */ jsx38(
|
|
11389
11525
|
LSButton,
|
|
11390
11526
|
{
|
|
11391
11527
|
type: "button",
|
|
@@ -11395,7 +11531,7 @@ function StepReview({
|
|
|
11395
11531
|
label: "Skip"
|
|
11396
11532
|
}
|
|
11397
11533
|
),
|
|
11398
|
-
marketplaceAvailable && /* @__PURE__ */
|
|
11534
|
+
marketplaceAvailable && /* @__PURE__ */ jsx38(
|
|
11399
11535
|
LSButton,
|
|
11400
11536
|
{
|
|
11401
11537
|
type: "button",
|
|
@@ -11405,7 +11541,7 @@ function StepReview({
|
|
|
11405
11541
|
label: "Pick from Marketplace"
|
|
11406
11542
|
}
|
|
11407
11543
|
),
|
|
11408
|
-
/* @__PURE__ */
|
|
11544
|
+
/* @__PURE__ */ jsx38(
|
|
11409
11545
|
LSButton,
|
|
11410
11546
|
{
|
|
11411
11547
|
type: "button",
|
|
@@ -11416,7 +11552,7 @@ function StepReview({
|
|
|
11416
11552
|
}
|
|
11417
11553
|
)
|
|
11418
11554
|
] }) }),
|
|
11419
|
-
item.flaggedOff && !marketplaceAvailable && state !== "generated" && /* @__PURE__ */
|
|
11555
|
+
item.flaggedOff && !marketplaceAvailable && state !== "generated" && /* @__PURE__ */ jsx38("div", { className: "se-import-muted", children: "No curated Marketplace replacement is configured for this widget yet." })
|
|
11420
11556
|
] });
|
|
11421
11557
|
}
|
|
11422
11558
|
var CUSTOM_WIDGET_TABS = [
|
|
@@ -11442,8 +11578,8 @@ function CustomWidgetCard({ widget }) {
|
|
|
11442
11578
|
}, [value]);
|
|
11443
11579
|
if (tabs.length === 0) return null;
|
|
11444
11580
|
return /* @__PURE__ */ jsxs27("div", { className: "se-import-cw", children: [
|
|
11445
|
-
/* @__PURE__ */
|
|
11446
|
-
/* @__PURE__ */
|
|
11581
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-cw__title", children: widget.title }),
|
|
11582
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-cw__tabs", role: "tablist", children: tabs.map(({ key, label }) => /* @__PURE__ */ jsx38(
|
|
11447
11583
|
"button",
|
|
11448
11584
|
{
|
|
11449
11585
|
type: "button",
|
|
@@ -11456,17 +11592,17 @@ function CustomWidgetCard({ widget }) {
|
|
|
11456
11592
|
key
|
|
11457
11593
|
)) }),
|
|
11458
11594
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-cw__body", children: [
|
|
11459
|
-
/* @__PURE__ */
|
|
11460
|
-
/* @__PURE__ */
|
|
11595
|
+
/* @__PURE__ */ jsx38("button", { type: "button", className: "se-import-cw__copy", onClick: handleCopy, children: copied ? "Copied!" : "Copy" }),
|
|
11596
|
+
/* @__PURE__ */ jsx38("pre", { className: "se-import-cw__code", children: value })
|
|
11461
11597
|
] })
|
|
11462
11598
|
] });
|
|
11463
11599
|
}
|
|
11464
11600
|
function CustomWidgetReview({ widgets }) {
|
|
11465
11601
|
if (widgets.length === 0) return null;
|
|
11466
11602
|
return /* @__PURE__ */ jsxs27("div", { className: "se-import-cw-review", children: [
|
|
11467
|
-
/* @__PURE__ */
|
|
11468
|
-
/* @__PURE__ */
|
|
11469
|
-
widgets.map((widget, index) => /* @__PURE__ */
|
|
11603
|
+
/* @__PURE__ */ jsx38("h3", { children: "Custom widgets" }),
|
|
11604
|
+
/* @__PURE__ */ jsx38("p", { className: "se-import-cw-review__hint", children: widgets.length === 1 ? "This overlay includes a custom-code widget. Copy any field and paste it straight into the StreamElements editor \u2014 values are shown exactly as StreamElements stores them, with no escaping." : `This overlay includes ${widgets.length} custom-code widgets. Copy any field and paste it straight into the StreamElements editor \u2014 values are shown exactly as StreamElements stores them, with no escaping.` }),
|
|
11605
|
+
widgets.map((widget, index) => /* @__PURE__ */ jsx38(CustomWidgetCard, { widget }, `${widget.title}-${index}`))
|
|
11470
11606
|
] });
|
|
11471
11607
|
}
|
|
11472
11608
|
function StepConfirm({
|
|
@@ -11491,20 +11627,20 @@ function StepConfirm({
|
|
|
11491
11627
|
{}
|
|
11492
11628
|
);
|
|
11493
11629
|
return /* @__PURE__ */ jsxs27("div", { className: panelClass("se-import-panel--confirm"), children: [
|
|
11494
|
-
/* @__PURE__ */
|
|
11630
|
+
/* @__PURE__ */ jsx38(StepHeader, { number: 5, title: "Confirm", subtitle: "Review and confirm your import" }),
|
|
11495
11631
|
/* @__PURE__ */ jsxs27("div", { className: "se-import-overview", children: [
|
|
11496
|
-
/* @__PURE__ */
|
|
11497
|
-
/* @__PURE__ */
|
|
11632
|
+
/* @__PURE__ */ jsx38("h3", { children: "Overview" }),
|
|
11633
|
+
/* @__PURE__ */ jsx38(
|
|
11498
11634
|
Row,
|
|
11499
11635
|
{
|
|
11500
11636
|
label: overlayCount > 1 ? "Overlays to create" : "Overlay",
|
|
11501
11637
|
value: overlayCount > 1 ? `${overlayCount}` : options.name || result.overlay.name
|
|
11502
11638
|
}
|
|
11503
11639
|
),
|
|
11504
|
-
/* @__PURE__ */
|
|
11505
|
-
/* @__PURE__ */
|
|
11506
|
-
/* @__PURE__ */
|
|
11507
|
-
/* @__PURE__ */
|
|
11640
|
+
/* @__PURE__ */ jsx38(Row, { label: "Layers imported", value: `${layerCount}` }),
|
|
11641
|
+
/* @__PURE__ */ jsx38(Row, { label: "Widgets", value: `${widgets}` }),
|
|
11642
|
+
/* @__PURE__ */ jsx38(Row, { label: "Alerts", value: `${alertCount}` }),
|
|
11643
|
+
/* @__PURE__ */ jsx38(
|
|
11508
11644
|
Row,
|
|
11509
11645
|
{
|
|
11510
11646
|
label: "Assets to import",
|
|
@@ -11512,25 +11648,25 @@ function StepConfirm({
|
|
|
11512
11648
|
meta: options.mirrorAssets ? `Mirrored to Lumia storage (${mirrored})` : "Skipped"
|
|
11513
11649
|
}
|
|
11514
11650
|
),
|
|
11515
|
-
/* @__PURE__ */
|
|
11651
|
+
/* @__PURE__ */ jsx38(
|
|
11516
11652
|
Row,
|
|
11517
11653
|
{
|
|
11518
11654
|
label: "Import behavior",
|
|
11519
11655
|
value: options.mirrorAssets ? "Mirror assets and rewrite URLs" : "Keep original asset URLs"
|
|
11520
11656
|
}
|
|
11521
11657
|
),
|
|
11522
|
-
reviewBuckets.generated ? /* @__PURE__ */
|
|
11523
|
-
reviewBuckets.skipped ? /* @__PURE__ */
|
|
11524
|
-
reviewBuckets.kept ? /* @__PURE__ */
|
|
11658
|
+
reviewBuckets.generated ? /* @__PURE__ */ jsx38(Row, { label: "Generated with AI", value: `${reviewBuckets.generated}` }) : null,
|
|
11659
|
+
reviewBuckets.skipped ? /* @__PURE__ */ jsx38(Row, { label: "Skipped", value: `${reviewBuckets.skipped}` }) : null,
|
|
11660
|
+
reviewBuckets.kept ? /* @__PURE__ */ jsx38(Row, { label: "Kept as placeholder", value: `${reviewBuckets.kept}` }) : null
|
|
11525
11661
|
] }),
|
|
11526
|
-
isAdmin && result.customWidgets && result.customWidgets.length > 0 && /* @__PURE__ */
|
|
11662
|
+
isAdmin && result.customWidgets && result.customWidgets.length > 0 && /* @__PURE__ */ jsx38(CustomWidgetReview, { widgets: result.customWidgets })
|
|
11527
11663
|
] });
|
|
11528
11664
|
}
|
|
11529
11665
|
function Row({ label, value, meta }) {
|
|
11530
11666
|
return /* @__PURE__ */ jsxs27("div", { className: "se-import-row", children: [
|
|
11531
|
-
/* @__PURE__ */
|
|
11532
|
-
/* @__PURE__ */
|
|
11533
|
-
meta && /* @__PURE__ */
|
|
11667
|
+
/* @__PURE__ */ jsx38("span", { children: label }),
|
|
11668
|
+
/* @__PURE__ */ jsx38("strong", { children: value }),
|
|
11669
|
+
meta && /* @__PURE__ */ jsx38("em", { children: meta })
|
|
11534
11670
|
] });
|
|
11535
11671
|
}
|
|
11536
11672
|
function SEImportWizard({
|
|
@@ -12423,21 +12559,21 @@ function SEImportWizard({
|
|
|
12423
12559
|
return false;
|
|
12424
12560
|
})();
|
|
12425
12561
|
const activeIndex = visibleSteps.findIndex((item) => item.key === step);
|
|
12426
|
-
return /* @__PURE__ */
|
|
12427
|
-
visibleSteps.length > 0 && /* @__PURE__ */
|
|
12562
|
+
return /* @__PURE__ */ jsx38("div", { className: "se-import", children: /* @__PURE__ */ jsxs27("div", { className: "se-import__shell", children: [
|
|
12563
|
+
visibleSteps.length > 0 && /* @__PURE__ */ jsx38("header", { className: "se-import__header", children: /* @__PURE__ */ jsx38("div", { className: "se-import-stepper", children: visibleSteps.map((item, index) => /* @__PURE__ */ jsxs27(
|
|
12428
12564
|
"div",
|
|
12429
12565
|
{
|
|
12430
12566
|
className: stepClass(index < activeIndex, index === activeIndex),
|
|
12431
12567
|
children: [
|
|
12432
|
-
/* @__PURE__ */
|
|
12433
|
-
/* @__PURE__ */
|
|
12434
|
-
/* @__PURE__ */
|
|
12568
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-step__label", children: item.label }),
|
|
12569
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-step__line" }),
|
|
12570
|
+
/* @__PURE__ */ jsx38("div", { className: "se-import-step__dot", children: index < activeIndex ? "\u2713" : index + 1 })
|
|
12435
12571
|
]
|
|
12436
12572
|
},
|
|
12437
12573
|
item.key
|
|
12438
12574
|
)) }) }),
|
|
12439
12575
|
/* @__PURE__ */ jsxs27("main", { className: "se-import__content", children: [
|
|
12440
|
-
step === "mode" && /* @__PURE__ */
|
|
12576
|
+
step === "mode" && /* @__PURE__ */ jsx38(
|
|
12441
12577
|
StepModePicker,
|
|
12442
12578
|
{
|
|
12443
12579
|
onChooseJwt: () => {
|
|
@@ -12451,7 +12587,7 @@ function SEImportWizard({
|
|
|
12451
12587
|
onOpenFullImport: bindings.onOpenFullImport
|
|
12452
12588
|
}
|
|
12453
12589
|
),
|
|
12454
|
-
step === "connect" && /* @__PURE__ */
|
|
12590
|
+
step === "connect" && /* @__PURE__ */ jsx38(
|
|
12455
12591
|
StepConnect,
|
|
12456
12592
|
{
|
|
12457
12593
|
jwt,
|
|
@@ -12467,7 +12603,7 @@ function SEImportWizard({
|
|
|
12467
12603
|
}
|
|
12468
12604
|
}
|
|
12469
12605
|
),
|
|
12470
|
-
step === "pick" && /* @__PURE__ */
|
|
12606
|
+
step === "pick" && /* @__PURE__ */ jsx38(
|
|
12471
12607
|
StepPickOverlay,
|
|
12472
12608
|
{
|
|
12473
12609
|
overlays: overlayList,
|
|
@@ -12480,7 +12616,7 @@ function SEImportWizard({
|
|
|
12480
12616
|
onRetry: () => seClient && void loadOverlayList(seClient)
|
|
12481
12617
|
}
|
|
12482
12618
|
),
|
|
12483
|
-
step === "url" && /* @__PURE__ */
|
|
12619
|
+
step === "url" && /* @__PURE__ */ jsx38(
|
|
12484
12620
|
StepURL,
|
|
12485
12621
|
{
|
|
12486
12622
|
url,
|
|
@@ -12494,7 +12630,7 @@ function SEImportWizard({
|
|
|
12494
12630
|
}
|
|
12495
12631
|
}
|
|
12496
12632
|
),
|
|
12497
|
-
step === "discovery" && result && /* @__PURE__ */
|
|
12633
|
+
step === "discovery" && result && /* @__PURE__ */ jsx38(
|
|
12498
12634
|
StepDiscovery,
|
|
12499
12635
|
{
|
|
12500
12636
|
result,
|
|
@@ -12502,7 +12638,7 @@ function SEImportWizard({
|
|
|
12502
12638
|
overlayCount: Math.max(1, activeOverlaySummaries.length)
|
|
12503
12639
|
}
|
|
12504
12640
|
),
|
|
12505
|
-
step === "options" && /* @__PURE__ */
|
|
12641
|
+
step === "options" && /* @__PURE__ */ jsx38(
|
|
12506
12642
|
StepOptions,
|
|
12507
12643
|
{
|
|
12508
12644
|
options,
|
|
@@ -12511,8 +12647,8 @@ function SEImportWizard({
|
|
|
12511
12647
|
hideName: activeOverlaySummaries.length > 1
|
|
12512
12648
|
}
|
|
12513
12649
|
),
|
|
12514
|
-
step === "mirror" && /* @__PURE__ */
|
|
12515
|
-
step === "review" && currentItem && result && !marketplacePickerOpen && /* @__PURE__ */
|
|
12650
|
+
step === "mirror" && /* @__PURE__ */ jsx38(StepMirror, { rows: mirrorRows, running: mirrorRunning, onRetry: retryMirrorRow }),
|
|
12651
|
+
step === "review" && currentItem && result && !marketplacePickerOpen && /* @__PURE__ */ jsx38(
|
|
12516
12652
|
StepReview,
|
|
12517
12653
|
{
|
|
12518
12654
|
item: currentItem,
|
|
@@ -12539,7 +12675,7 @@ function SEImportWizard({
|
|
|
12539
12675
|
marketplaceAvailable: hasMarketplaceCandidates(currentItem.seWidget.type)
|
|
12540
12676
|
}
|
|
12541
12677
|
),
|
|
12542
|
-
step === "review" && currentItem && marketplacePickerOpen && /* @__PURE__ */
|
|
12678
|
+
step === "review" && currentItem && marketplacePickerOpen && /* @__PURE__ */ jsx38("div", { className: panelClass("se-import-panel--wide"), children: /* @__PURE__ */ jsx38(
|
|
12543
12679
|
MarketplacePicker,
|
|
12544
12680
|
{
|
|
12545
12681
|
seWidgetType: currentItem.seWidget.type,
|
|
@@ -12549,7 +12685,7 @@ function SEImportWizard({
|
|
|
12549
12685
|
onCancel: () => setMarketplacePickerOpen(false)
|
|
12550
12686
|
}
|
|
12551
12687
|
) }),
|
|
12552
|
-
step === "confirm" && result && /* @__PURE__ */
|
|
12688
|
+
step === "confirm" && result && /* @__PURE__ */ jsx38(
|
|
12553
12689
|
StepConfirm,
|
|
12554
12690
|
{
|
|
12555
12691
|
result,
|
|
@@ -12562,7 +12698,7 @@ function SEImportWizard({
|
|
|
12562
12698
|
)
|
|
12563
12699
|
] }),
|
|
12564
12700
|
/* @__PURE__ */ jsxs27("footer", { className: "se-import-actions", children: [
|
|
12565
|
-
step !== "mode" && /* @__PURE__ */
|
|
12701
|
+
step !== "mode" && /* @__PURE__ */ jsx38(
|
|
12566
12702
|
LSButton,
|
|
12567
12703
|
{
|
|
12568
12704
|
type: "button",
|
|
@@ -12573,7 +12709,7 @@ function SEImportWizard({
|
|
|
12573
12709
|
label: "Back"
|
|
12574
12710
|
}
|
|
12575
12711
|
),
|
|
12576
|
-
step !== "mode" && /* @__PURE__ */
|
|
12712
|
+
step !== "mode" && /* @__PURE__ */ jsx38(
|
|
12577
12713
|
LSButton,
|
|
12578
12714
|
{
|
|
12579
12715
|
type: "button",
|