@@ -16,146 +16,131 @@ import androidx.compose.foundation.background
1616import androidx.compose.foundation.layout.Arrangement
1717import androidx.compose.foundation.layout.Box
1818import androidx.compose.foundation.layout.Column
19- import androidx.compose.foundation.layout.consumeWindowInsets
2019import androidx.compose.foundation.layout.fillMaxSize
2120import androidx.compose.foundation.layout.fillMaxWidth
2221import androidx.compose.foundation.layout.padding
23- import androidx.compose.foundation.rememberScrollState
24- import androidx.compose.foundation.verticalScroll
2522import androidx.compose.material3.ExperimentalMaterial3Api
2623import androidx.compose.material3.Text
27- import androidx.compose.material3.rememberBottomSheetScaffoldState
2824import androidx.compose.runtime.Composable
2925import androidx.compose.ui.Alignment
3026import androidx.compose.ui.Modifier
3127import androidx.compose.ui.res.stringResource
28+ import androidx.compose.ui.tooling.preview.PreviewLightDark
3229import com.orange.ouds.app.R
3330import com.orange.ouds.app.ui.components.Component
31+ import com.orange.ouds.app.ui.components.labelArgument
3432import com.orange.ouds.app.ui.components.onClickArgument
35- import com.orange.ouds.app.ui.components.textArgument
36- import com.orange.ouds.app.ui.utilities.composable.CodeSnippet
37- import com.orange.ouds.app.ui.utilities.composable.CustomizationBottomSheetScaffold
33+ import com.orange.ouds.app.ui.utilities.Code
3834import com.orange.ouds.app.ui.utilities.composable.CustomizationDropdownMenu
3935import com.orange.ouds.app.ui.utilities.composable.DemoScreen
40- import com.orange.ouds.app.ui.utilities.composable.DetailScreenDescription
4136import com.orange.ouds.app.ui.utilities.formattedName
4237import com.orange.ouds.core.component.OudsButton
4338import com.orange.ouds.core.component.OudsColoredBox
4439import com.orange.ouds.core.component.OudsLink
4540import com.orange.ouds.core.theme.OudsTheme
46- import com.orange.ouds.core.theme.OudsThemeTweak
4741import com.orange.ouds.core.utilities.OudsPreview
48- import com.orange.ouds.foundation.utilities.UiModePreviews
4942
5043@OptIn(ExperimentalMaterial3Api ::class )
5144@Composable
52- fun ColoredBackgroundDemoScreen () = DemoScreen (rememberColoredBackgroundDemoState()) {
53- CustomizationBottomSheetScaffold (
54- bottomSheetScaffoldState = rememberBottomSheetScaffoldState(),
55- bottomSheetContent = {
56- val colors = OudsColoredBox .Color .entries
57- CustomizationDropdownMenu (
58- label = stringResource(id = R .string.app_components_coloredBackground_color_label),
59- itemLabels = colors.map { it.formattedName },
60- selectedItemIndex = colors.indexOf(color),
61- onSelectionChange = { color = colors[it] },
62- itemLeadingIcons = colors.map { color ->
63- {
64- Box (
65- modifier = Modifier
66- .fillMaxSize()
67- .background(color.value)
68- )
69- }
45+ fun ColoredBackgroundDemoScreen () {
46+ val state = rememberColoredBackgroundDemoState()
47+ DemoScreen (
48+ description = stringResource(id = Component .ColoredBackground .descriptionRes),
49+ bottomSheetContent = { ColoredBackgroundDemoBottomSheetContent (state = state) },
50+ codeSnippet = { coloredBackgroundDemoCodeSnippet(state = state) },
51+ demoContent = { ColoredBackgroundDemoContent (state = state) }
52+ )
53+ }
54+
55+ @Composable
56+ private fun ColoredBackgroundDemoBottomSheetContent (state : ColoredBackgroundDemoState ) {
57+ with (state) {
58+ val colors = OudsColoredBox .Color .entries
59+ CustomizationDropdownMenu (
60+ label = stringResource(id = R .string.app_components_coloredBackground_color_label),
61+ itemLabels = colors.map { it.formattedName },
62+ selectedItemIndex = colors.indexOf(color),
63+ onSelectionChange = { color = colors[it] },
64+ itemLeadingIcons = colors.map { color ->
65+ {
66+ Box (
67+ modifier = Modifier
68+ .fillMaxSize()
69+ .background(color.value)
70+ )
7071 }
71- )
72- }
73- ) {
74- DetailScreenDescription (
75- modifier = Modifier .padding(all = OudsTheme .spaces.fixed.medium),
76- descriptionRes = Component .ColoredBackground .descriptionRes
77- )
78- ColoredBackgroundDemo (state = this @DemoScreen)
79- OudsThemeTweak (OudsTheme .Tweak .Invert ) {
80- ColoredBackgroundDemo (state = this @DemoScreen)
81- }
82- ColoredBackgroundDemoCodeSnippet (
83- state = this @DemoScreen,
84- modifier = Modifier
85- .padding(all = OudsTheme .spaces.fixed.medium)
86- .padding(top = OudsTheme .spaces.fixed.medium)
72+ }
8773 )
8874 }
8975}
9076
9177@Composable
92- private fun ColoredBackgroundDemo (state : ColoredBackgroundDemoState ) {
93- Box (
94- modifier = Modifier
95- .background(OudsTheme .colorScheme.background.primary)
96- .padding(all = OudsTheme .spaces.fixed.medium)
97- .fillMaxWidth(),
98- contentAlignment = Alignment .Center ,
99- ) {
100- with (state) {
101- OudsColoredBox (
102- modifier = Modifier .fillMaxWidth(),
103- color = color
104- ) {
105- Column (
106- modifier = Modifier
107- .padding(all = OudsTheme .spaces.fixed.medium)
108- .fillMaxWidth(),
109- verticalArrangement = Arrangement .spacedBy(OudsTheme .spaces.fixed.medium),
110- horizontalAlignment = Alignment .CenterHorizontally
78+ private fun ColoredBackgroundDemoContent (state : ColoredBackgroundDemoState ) {
79+ with (state) {
80+ Box (
81+ modifier = Modifier
82+ .background(OudsTheme .colorScheme.background.primary)
83+ .padding(all = OudsTheme .spaces.fixed.medium)
84+ .fillMaxWidth(),
85+ contentAlignment = Alignment .Center ,
86+ ) {
87+ with (state) {
88+ OudsColoredBox (
89+ modifier = Modifier .fillMaxWidth(),
90+ color = color
11191 ) {
112- Text (
113- text = color.formattedName,
114- color = OudsTheme .colorScheme.content.default
115- )
116- OudsButton (
117- text = stringResource(id = R .string.app_components_button_label),
118- onClick = {}
119- )
120- OudsLink (
121- text = stringResource(id = R .string.app_components_link_label),
122- arrow = OudsLink .Arrow .Next ,
123- onClick = {},
124- )
92+ Column (
93+ modifier = Modifier
94+ .padding(all = OudsTheme .spaces.fixed.medium)
95+ .fillMaxWidth(),
96+ verticalArrangement = Arrangement .spacedBy(OudsTheme .spaces.fixed.medium),
97+ horizontalAlignment = Alignment .CenterHorizontally
98+ ) {
99+ Text (
100+ text = color.formattedName,
101+ color = OudsTheme .colorScheme.content.default
102+ )
103+ OudsButton (
104+ label = stringResource(id = R .string.app_components_button_label),
105+ onClick = {}
106+ )
107+ OudsLink (
108+ label = stringResource(id = R .string.app_components_link_label),
109+ arrow = OudsLink .Arrow .Next ,
110+ onClick = {},
111+ )
112+ }
125113 }
126114 }
127115 }
128116 }
129117}
130118
131- @Composable
132- private fun ColoredBackgroundDemoCodeSnippet (state : ColoredBackgroundDemoState , modifier : Modifier = Modifier ) {
133- CodeSnippet (modifier = modifier) {
134- with (state) {
135- functionCall(OudsColoredBox ::class .simpleName.orEmpty()) {
136- trailingLambda = true
137- typedArgument(" color" , color)
138- lambdaArgument(null ) {
139- functionCall(" Text" ) {
140- typedArgument(" text" , color.formattedName)
141- rawArgument(" color" , " OudsTheme.colorScheme.content.default" )
142- }
143- functionCall(OudsButton ::class .java.simpleName) {
144- textArgument(R .string.app_components_button_label)
145- onClickArgument {}
146- }
147- functionCall(OudsLink ::class .java.simpleName) {
148- textArgument(R .string.app_components_link_label)
149- typedArgument(" arrow" , OudsLink .Arrow .Next )
150- onClickArgument {}
151- }
119+ private fun Code.Builder.coloredBackgroundDemoCodeSnippet (state : ColoredBackgroundDemoState ) {
120+ with (state) {
121+ functionCall(OudsColoredBox ::class .simpleName.orEmpty()) {
122+ trailingLambda = true
123+ typedArgument(" color" , color)
124+ lambdaArgument(null ) {
125+ functionCall(" Text" ) {
126+ typedArgument(" text" , color.formattedName)
127+ rawArgument(" color" , " OudsTheme.colorScheme.content.default" )
128+ }
129+ functionCall(OudsButton ::class .java.simpleName) {
130+ labelArgument(R .string.app_components_button_label)
131+ onClickArgument {}
132+ }
133+ functionCall(OudsLink ::class .java.simpleName) {
134+ labelArgument(R .string.app_components_link_label)
135+ typedArgument(" arrow" , OudsLink .Arrow .Next )
136+ onClickArgument {}
152137 }
153138 }
154139 }
155140 }
156141}
157142
158- @UiModePreviews. Default
143+ @PreviewLightDark
159144@Composable
160145private fun PreviewColoredBackgroundDemoScreen () = OudsPreview {
161146 ColoredBackgroundDemoScreen ()
0 commit comments