New: react slider with button

This commit is contained in:
duckietm 2024-03-19 10:28:57 +01:00
parent e4658143fa
commit 27c3adbf06
16 changed files with 36 additions and 63 deletions

View File

@ -3,7 +3,7 @@ import { FC, useCallback, useEffect, useMemo, useState } from 'react';
import { FaSave, FaSearchMinus, FaSearchPlus, FaTrash } from 'react-icons/fa'; import { FaSave, FaSearchMinus, FaSearchPlus, FaTrash } from 'react-icons/fa';
import ReactSlider from 'react-slider'; import ReactSlider from 'react-slider';
import { CameraEditorTabs, CameraPicture, CameraPictureThumbnail, GetRoomCameraWidgetManager, LocalizeText } from '../../../../api'; import { CameraEditorTabs, CameraPicture, CameraPictureThumbnail, GetRoomCameraWidgetManager, LocalizeText } from '../../../../api';
import { Button, ButtonGroup, Column, Flex, Grid, LayoutImage, NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, NitroCardTabsView, NitroCardView, Text } from '../../../../common'; import { Button, ButtonGroup, Column, Flex, Grid, LayoutImage, NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, NitroCardTabsView, NitroCardView, Slider, Text } from '../../../../common';
import { CameraWidgetEffectListView } from './effect-list/CameraWidgetEffectListView'; import { CameraWidgetEffectListView } from './effect-list/CameraWidgetEffectListView';
export interface CameraWidgetEditorViewProps export interface CameraWidgetEditorViewProps
@ -189,8 +189,7 @@ export const CameraWidgetEditorView: FC<CameraWidgetEditorViewProps> = props =>
{ selectedEffectName && { selectedEffectName &&
<Column center fullWidth gap={ 1 }> <Column center fullWidth gap={ 1 }>
<Text>{ LocalizeText('camera.effect.name.' + selectedEffectName) }</Text> <Text>{ LocalizeText('camera.effect.name.' + selectedEffectName) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 0 } min={ 0 }
max={ 1 } max={ 1 }
step={ 0.01 } step={ 0.01 }

View File

@ -2,7 +2,7 @@ import { RoomEngineTriggerWidgetEvent } from '@nitrots/nitro-renderer';
import { FC, useEffect, useMemo, useState } from 'react'; import { FC, useEffect, useMemo, useState } from 'react';
import ReactSlider from 'react-slider'; import ReactSlider from 'react-slider';
import { ColorUtils, FurnitureDimmerUtilities, GetConfiguration, LocalizeText } from '../../../../api'; import { ColorUtils, FurnitureDimmerUtilities, GetConfiguration, LocalizeText } from '../../../../api';
import { Base, Button, classNames, Column, Flex, Grid, NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, NitroCardTabsView, NitroCardView, Text } from '../../../../common'; import { Base, Button, classNames, Column, Flex, Grid, NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, NitroCardTabsView, NitroCardView, Slider, Text } from '../../../../common';
import { useFurnitureDimmerWidget, useRoomEngineEvent } from '../../../../hooks'; import { useFurnitureDimmerWidget, useRoomEngineEvent } from '../../../../hooks';
export const FurnitureDimmerView: FC<{}> = props => export const FurnitureDimmerView: FC<{}> = props =>
@ -62,8 +62,7 @@ export const FurnitureDimmerView: FC<{}> = props =>
</Column> </Column>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text fontWeight="bold">{ LocalizeText('widget.backgroundcolor.lightness') }</Text> <Text fontWeight="bold">{ LocalizeText('widget.backgroundcolor.lightness') }</Text>
<ReactSlider <Slider
className="nitro-slider"
min={ FurnitureDimmerUtilities.MIN_BRIGHTNESS } min={ FurnitureDimmerUtilities.MIN_BRIGHTNESS }
max={ FurnitureDimmerUtilities.MAX_BRIGHTNESS } max={ FurnitureDimmerUtilities.MAX_BRIGHTNESS }
value={ selectedBrightness } value={ selectedBrightness }

View File

@ -2,7 +2,7 @@ import { FurnitureStackHeightComposer } from '@nitrots/nitro-renderer';
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider'; import ReactSlider from 'react-slider';
import { LocalizeText, SendMessageComposer } from '../../../../api'; import { LocalizeText, SendMessageComposer } from '../../../../api';
import { Button, Column, Flex, NitroCardContentView, NitroCardHeaderView, NitroCardView, Text } from '../../../../common'; import { Button, Column, Flex, NitroCardContentView, NitroCardHeaderView, NitroCardView, Slider, Text } from '../../../../common';
import { useFurnitureStackHeightWidget } from '../../../../hooks'; import { useFurnitureStackHeightWidget } from '../../../../hooks';
export const FurnitureStackHeightView: FC<{}> = props => export const FurnitureStackHeightView: FC<{}> = props =>
@ -34,8 +34,7 @@ export const FurnitureStackHeightView: FC<{}> = props =>
<NitroCardContentView justifyContent="between"> <NitroCardContentView justifyContent="between">
<Text>{ LocalizeText('widget.custom.stack.height.text') }</Text> <Text>{ LocalizeText('widget.custom.stack.height.text') }</Text>
<Flex gap={ 2 }> <Flex gap={ 2 }>
<ReactSlider <Slider
className="nitro-slider"
min={ 0 } min={ 0 }
max={ maxHeight } max={ maxHeight }
step={ 0.01 } step={ 0.01 }

View File

@ -1,8 +1,7 @@
import { WiredActionDefinition } from '@nitrots/nitro-renderer'; import { WiredActionDefinition } from '@nitrots/nitro-renderer';
import { FC, PropsWithChildren, useEffect } from 'react'; import { FC, PropsWithChildren, useEffect } from 'react';
import ReactSlider from 'react-slider';
import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api'; import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Button, Column, Flex, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredBaseView } from '../WiredBaseView'; import { WiredBaseView } from '../WiredBaseView';
@ -29,11 +28,11 @@ export const WiredActionBaseView: FC<PropsWithChildren<WiredActionBaseViewProps>
{ !!children && <hr className="m-0 bg-dark" /> } { !!children && <hr className="m-0 bg-dark" /> }
<Column> <Column>
<Text bold>{ LocalizeText('wiredfurni.params.delay', [ 'seconds' ], [ GetWiredTimeLocale(actionDelay) ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.delay', [ 'seconds' ], [ GetWiredTimeLocale(actionDelay) ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 0 } min={ 0 }
max={ 20 } max={ 20 }
value={ actionDelay } value={ actionDelay }
snapDragDisabled={ false }
onChange={ event => setActionDelay(event) } /> onChange={ event => setActionDelay(event) } />
</Column> </Column>
</WiredBaseView> </WiredBaseView>

View File

@ -1,8 +1,7 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import { FaPlus, FaTrash } from 'react-icons/fa'; import { FaPlus, FaTrash } from 'react-icons/fa';
import ReactSlider from 'react-slider';
import { LocalizeText, WiredFurniType } from '../../../../api'; import { LocalizeText, WiredFurniType } from '../../../../api';
import { Button, Column, Flex, Text } from '../../../../common'; import { Button, Column, Flex, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredActionBaseView } from './WiredActionBaseView'; import { WiredActionBaseView } from './WiredActionBaseView';
@ -102,8 +101,7 @@ export const WiredActionGiveRewardView: FC<{}> = props =>
Reward limit not set. Make sure rewards are badges or non-tradeable items. Reward limit not set. Make sure rewards are badges or non-tradeable items.
</Text> } </Text> }
{ limitEnabled && { limitEnabled &&
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 1000 } max={ 1000 }
value={ rewardsLimit } value={ rewardsLimit }

View File

@ -1,7 +1,7 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider'; import ReactSlider from 'react-slider';
import { LocalizeText, WiredFurniType } from '../../../../api'; import { LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Flex, Text } from '../../../../common'; import { Column, Flex, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredActionBaseView } from './WiredActionBaseView'; import { WiredActionBaseView } from './WiredActionBaseView';
@ -34,8 +34,7 @@ export const WiredActionGiveScoreToPredefinedTeamView: FC<{}> = props =>
<WiredActionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredActionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.setpoints', [ 'points' ], [ points.toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.setpoints', [ 'points' ], [ points.toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 100 } max={ 100 }
value={ points } value={ points }
@ -43,8 +42,7 @@ export const WiredActionGiveScoreToPredefinedTeamView: FC<{}> = props =>
</Column> </Column>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.settimesingame', [ 'times' ], [ time.toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.settimesingame', [ 'times' ], [ time.toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 10 } max={ 10 }
value={ time } value={ time }

View File

@ -1,7 +1,7 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider'; import ReactSlider from 'react-slider';
import { LocalizeText, WiredFurniType } from '../../../../api'; import { LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Column, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredActionBaseView } from './WiredActionBaseView'; import { WiredActionBaseView } from './WiredActionBaseView';
@ -31,8 +31,7 @@ export const WiredActionGiveScoreView: FC<{}> = props =>
<WiredActionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredActionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.setpoints', [ 'points' ], [ points.toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.setpoints', [ 'points' ], [ points.toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 100 } max={ 100 }
value={ points } value={ points }
@ -40,8 +39,7 @@ export const WiredActionGiveScoreView: FC<{}> = props =>
</Column> </Column>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.settimesingame', [ 'times' ], [ time.toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.settimesingame', [ 'times' ], [ time.toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 10 } max={ 10 }
value={ time } value={ time }

View File

@ -1,7 +1,7 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider'; import ReactSlider from 'react-slider';
import { LocalizeText, WiredFurniType } from '../../../../api'; import { LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Flex, Text } from '../../../../common'; import { Column, Flex, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredActionBaseView } from './WiredActionBaseView'; import { WiredActionBaseView } from './WiredActionBaseView';
@ -50,8 +50,7 @@ export const WiredActionMoveFurniToView: FC<{}> = props =>
<WiredActionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_BY_ID_OR_BY_TYPE } hasSpecialInput={ true } save={ save }> <WiredActionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_BY_ID_OR_BY_TYPE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.emptytiles', [ 'tiles' ], [ spacing.toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.emptytiles', [ 'tiles' ], [ spacing.toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 5 } max={ 5 }
value={ spacing } value={ spacing }

View File

@ -1,7 +1,7 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider'; import ReactSlider from 'react-slider';
import { GetConfiguration, LocalizeText, WiredFurniType } from '../../../../api'; import { GetConfiguration, LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Column, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredActionBaseView } from './WiredActionBaseView'; import { WiredActionBaseView } from './WiredActionBaseView';
@ -27,8 +27,7 @@ export const WiredActionMuteUserView: FC<{}> = props =>
<WiredActionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredActionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.length.minutes', [ 'minutes' ], [ time.toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.length.minutes', [ 'minutes' ], [ time.toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 10 } max={ 10 }
value={ time } value={ time }

View File

@ -1,7 +1,6 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider';
import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api'; import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Column, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredConditionBaseView } from './WiredConditionBaseView'; import { WiredConditionBaseView } from './WiredConditionBaseView';
@ -21,8 +20,7 @@ export const WiredConditionTimeElapsedLessView: FC<{}> = props =>
<WiredConditionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredConditionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.allowbefore', [ 'seconds' ], [ GetWiredTimeLocale(time) ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.allowbefore', [ 'seconds' ], [ GetWiredTimeLocale(time) ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 1200 } max={ 1200 }
value={ time } value={ time }

View File

@ -1,7 +1,6 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider';
import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api'; import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Column, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredConditionBaseView } from './WiredConditionBaseView'; import { WiredConditionBaseView } from './WiredConditionBaseView';
@ -21,8 +20,7 @@ export const WiredConditionTimeElapsedMoreView: FC<{}> = props =>
<WiredConditionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredConditionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.allowafter', [ 'seconds' ], [ GetWiredTimeLocale(time) ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.allowafter', [ 'seconds' ], [ GetWiredTimeLocale(time) ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 1200 } max={ 1200 }
value={ time } value={ time }

View File

@ -1,7 +1,6 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider';
import { LocalizeText, WiredFurniType } from '../../../../api'; import { LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Column, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredConditionBaseView } from './WiredConditionBaseView'; import { WiredConditionBaseView } from './WiredConditionBaseView';
@ -31,8 +30,7 @@ export const WiredConditionUserCountInRoomView: FC<{}> = props =>
<WiredConditionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredConditionBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.usercountmin', [ 'value' ], [ min.toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.usercountmin', [ 'value' ], [ min.toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 50 } max={ 50 }
value={ min } value={ min }
@ -40,8 +38,7 @@ export const WiredConditionUserCountInRoomView: FC<{}> = props =>
</Column> </Column>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.usercountmax', [ 'value' ], [ max.toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.usercountmax', [ 'value' ], [ max.toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 50 } max={ 50 }
value={ max } value={ max }

View File

@ -1,7 +1,6 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider';
import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api'; import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Column, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredTriggerBaseView } from './WiredTriggerBaseView'; import { WiredTriggerBaseView } from './WiredTriggerBaseView';
@ -21,8 +20,7 @@ export const WiredTriggeExecuteOnceView: FC<{}> = props =>
<WiredTriggerBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredTriggerBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.settime', [ 'seconds' ], [ GetWiredTimeLocale(time) ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.settime', [ 'seconds' ], [ GetWiredTimeLocale(time) ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 1200 } max={ 1200 }
value={ time } value={ time }

View File

@ -1,8 +1,7 @@
import { FriendlyTime } from '@nitrots/nitro-renderer'; import { FriendlyTime } from '@nitrots/nitro-renderer';
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider';
import { LocalizeText, WiredFurniType } from '../../../../api'; import { LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Column, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredTriggerBaseView } from './WiredTriggerBaseView'; import { WiredTriggerBaseView } from './WiredTriggerBaseView';
@ -22,8 +21,7 @@ export const WiredTriggeExecutePeriodicallyLongView: FC<{}> = props =>
<WiredTriggerBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredTriggerBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.setlongtime', [ 'time' ], [ FriendlyTime.format(time * 5).toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.setlongtime', [ 'time' ], [ FriendlyTime.format(time * 5).toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 120 } max={ 120 }
value={ time } value={ time }

View File

@ -1,7 +1,6 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider';
import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api'; import { GetWiredTimeLocale, LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Column, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredTriggerBaseView } from './WiredTriggerBaseView'; import { WiredTriggerBaseView } from './WiredTriggerBaseView';
@ -21,8 +20,7 @@ export const WiredTriggeExecutePeriodicallyView: FC<{}> = props =>
<WiredTriggerBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredTriggerBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.settime', [ 'seconds' ], [ GetWiredTimeLocale(time) ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.settime', [ 'seconds' ], [ GetWiredTimeLocale(time) ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 60 } max={ 60 }
value={ time } value={ time }

View File

@ -1,7 +1,6 @@
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import ReactSlider from 'react-slider';
import { LocalizeText, WiredFurniType } from '../../../../api'; import { LocalizeText, WiredFurniType } from '../../../../api';
import { Column, Text } from '../../../../common'; import { Column, Slider, Text } from '../../../../common';
import { useWired } from '../../../../hooks'; import { useWired } from '../../../../hooks';
import { WiredTriggerBaseView } from './WiredTriggerBaseView'; import { WiredTriggerBaseView } from './WiredTriggerBaseView';
@ -21,8 +20,7 @@ export const WiredTriggeScoreAchievedView: FC<{}> = props =>
<WiredTriggerBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }> <WiredTriggerBaseView requiresFurni={ WiredFurniType.STUFF_SELECTION_OPTION_NONE } hasSpecialInput={ true } save={ save }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text bold>{ LocalizeText('wiredfurni.params.setscore', [ 'points' ], [ points.toString() ]) }</Text> <Text bold>{ LocalizeText('wiredfurni.params.setscore', [ 'points' ], [ points.toString() ]) }</Text>
<ReactSlider <Slider
className={ 'nitro-slider' }
min={ 1 } min={ 1 }
max={ 1000 } max={ 1000 }
value={ points } value={ points }