Skip to content

[Feat]: #1466 Add disabled/placeholder styles for the main components #1815

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 12 commits into from
Jul 1, 2025
Merged

[Feat]: #1466 Add disabled/placeholder styles for the main components #1815

Changes from 1 commit
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
4cc299e
fix linter errrors
iamfaran Jun 26, 2025
2e0ec40
add button disabled styles
iamfaran Jun 26, 2025
ede27eb
add disabled styles for togglebtn
iamfaran Jun 26, 2025
59452d2
make a seperate section for disabled
iamfaran Jun 26, 2025
864a887
add disabled styles for toggled button
iamfaran Jun 26, 2025
56e71f6
add disabled input styles
iamfaran Jun 26, 2025
9ad28bb
remove border styles from disables
iamfaran Jun 26, 2025
3f516ab
add disable styles slider
iamfaran Jun 26, 2025
c9a8de4
add disabled styles on range slider fix
iamfaran Jun 26, 2025
c9cdee7
add placeholder styling for input
iamfaran Jun 26, 2025
54cc9b9
[Fix]: #1466 add disabled styles for the components / refactor
iamfaran Jun 27, 2025
b366ecb
[Fix]: #1466 add disabled/placeholder style for components
iamfaran Jun 27, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
add disabled styles for toggled button
  • Loading branch information
@iamfaran
iamfaran committed Jun 26, 2025
commit 864a887ff3afaa15da7573e8f97886c04b3786c3
5 changes: 4 additions & 1 deletion client/packages/lowcoder/src/comps/comps/buttonComp/toggleButtonComp.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import { trans } from "i18n";
import styled from "styled-components";
import { ChangeEventHandlerControl } from "../../controls/eventHandlerControl";
import { CommonNameConfig, NameConfig, withExposingConfigs } from "../../generators/withExposing";
import { Button100, ButtonCompWrapper, buttonRefMethods } from "./buttonCompConstants";
import { Button100, ButtonCompWrapper, buttonRefMethods, DisabledButtonStyleControl } from "./buttonCompConstants";
import { IconControl } from "comps/controls/iconControl";
import { AlignWithStretchControl, LeftRightControl } from "comps/controls/dropdownControl";
import { booleanExposingStateControl } from "comps/controls/codeStateControl";
Expand Down Expand Up @@ -63,6 +63,7 @@ const ToggleTmpComp = (function () {
iconPosition: LeftRightControl,
alignment: AlignWithStretchControl,
style: styleControl(ToggleButtonStyle , 'style'),
disabledStyle: DisabledButtonStyleControl,
animationStyle: styleControl(AnimationStyle , 'animationStyle'),
showBorder: withDefault(BoolControl, true),
viewRef: RefControl<HTMLElement>,
Expand All @@ -84,6 +85,7 @@ const ToggleTmpComp = (function () {
<Button100
ref={props.viewRef}
$buttonStyle={props.style}
$disabledStyle={props.disabledStyle}
loading={props.loading}
disabled={props.disabled}
onClick={() => {
Expand Down Expand Up @@ -153,6 +155,7 @@ const ToggleTmpComp = (function () {
</>
)}

<Section name="Disabled">{children.disabledStyle.getPropertyView()}</Section>
</>
))
.setExposeMethodConfigs(buttonRefMethods)
Expand Down