Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit8723fe9

Browse files
authored
feat: add slider to dynamic parameters (#17453)
This adds the slider to the dynamic parameters component and does someadditional styling cleanup for the dynamic parameters form<img width="630" alt="Screenshot 2025-04-17 at 16 54 05"src="https://github.com/user-attachments/assets/1640e8df-7483-4275-99ee-682ff6218658"/>
1 parent5e4050e commit8723fe9

File tree

2 files changed

+27
-4
lines changed

2 files changed

+27
-4
lines changed

‎site/src/components/Checkbox/Checkbox.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export const Checkbox = React.forwardRef<
1818
<CheckboxPrimitive.Root
1919
ref={ref}
2020
className={cn(
21-
`peer h-6 w-6 shrink-0 rounded-sm border border-border border-solid
21+
`peer h-5 w-5 shrink-0 rounded-sm border border-border border-solid
2222
focus-visible:outline-none focus-visible:ring-2
2323
focus-visible:ring-content-link focus-visible:ring-offset-4 focus-visible:ring-offset-surface-primary
2424
disabled:cursor-not-allowed disabled:bg-surface-primary disabled:data-[state=checked]:bg-surface-tertiary
@@ -34,10 +34,10 @@ export const Checkbox = React.forwardRef<
3434
>
3535
<divclassName="flex">
3636
{(props.checked===true||props.defaultChecked===true)&&(
37-
<CheckclassName="w-5 h-5"strokeWidth={2.5}/>
37+
<CheckclassName="w-4 h-4"strokeWidth={2.5}/>
3838
)}
3939
{props.checked==="indeterminate"&&(
40-
<MinusclassName="w-5 h-5"strokeWidth={2.5}/>
40+
<MinusclassName="w-4 h-4"strokeWidth={2.5}/>
4141
)}
4242
</div>
4343
</CheckboxPrimitive.Indicator>

‎site/src/modules/workspaces/DynamicParameter/DynamicParameter.tsx

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import {
2222
SelectTrigger,
2323
SelectValue,
2424
}from"components/Select/Select";
25+
import{Slider}from"components/Slider/Slider";
2526
import{Switch}from"components/Switch/Switch";
2627
import{
2728
Tooltip,
@@ -91,7 +92,7 @@ const ParameterLabel: FC<ParameterLabelProps> = ({ parameter, isPreset }) => {
9192
</span>
9293
)}
9394

94-
<divclassName="flex flex-colgap-1.5">
95+
<divclassName="flex flex-colw-full">
9596
<LabelclassName="flex gap-2 flex-wrap text-sm font-medium">
9697
{displayName}
9798

@@ -130,6 +131,11 @@ const ParameterLabel: FC<ParameterLabelProps> = ({ parameter, isPreset }) => {
130131
</Tooltip>
131132
</TooltipProvider>
132133
)}
134+
{parameter.form_type==="slider"&&(
135+
<outputclassName="ml-auto font-semibold">
136+
{parameter.value.value}
137+
</output>
138+
)}
133139
</Label>
134140

135141
{hasDescription&&(
@@ -278,6 +284,23 @@ const ParameterField: FC<ParameterFieldProps> = ({
278284
</Label>
279285
</div>
280286
);
287+
288+
case"slider":
289+
return(
290+
<Slider
291+
className="mt-2"
292+
defaultValue={[
293+
Number(
294+
parameter.default_value.valid ?parameter.default_value.value :0,
295+
),
296+
]}
297+
onValueChange={([value])=>onChange(value.toString())}
298+
min={parameter.validations[0]?.validation_min??0}
299+
max={parameter.validations[0]?.validation_max??100}
300+
disabled={disabled}
301+
/>
302+
);
303+
281304
case"input":{
282305
constinputType=parameter.type==="number" ?"number" :"text";
283306
constinputProps:Record<string,unknown>={};

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp