diff --git a/NOTICE.txt b/NOTICE.txt index 846ef9264..82e44190e 100644 --- a/NOTICE.txt +++ b/NOTICE.txt @@ -62,16 +62,22 @@ app/src/main/res/drawable-xxxhdpi/il_tokens_grid_min_width_dark.png app/src/prod/res/drawable/ic_launcher_background.xml app/src/prod/res/drawable/ic_launcher_foreground.xml -core/src/main/res/drawable/checkbox_indeterminate.xml -core/src/main/res/drawable/checkbox_selected.xml -core/src/main/res/drawable/chevron_left.xml -core/src/main/res/drawable/chip_tick.xml -core/src/main/res/drawable/radiobutton_selected.xml -core/src/main/res/drawable/switch_selected.xml - docs/assets/banner.png docs/assets/logo-icon.svg +theme-contract/src/main/res/drawable/ic_checkbox_indeterminate.xml +theme-contract/src/main/res/drawable/ic_checkbox_selected.xml +theme-contract/src/main/res/drawable/ic_chevron_left.xml +theme-contract/src/main/res/drawable/ic_tick.xml +theme-contract/src/main/res/drawable/ic_radio_button_selected.xml +theme-contract/src/main/res/drawable/ic_switch_selected.xml + +theme-sosh/src/main/res/drawable/sosh_checkbox_indeterminate.xml +theme-sosh/src/main/res/drawable/sosh_checkbox_selected.xml +theme-sosh/src/main/res/drawable/sosh_chevron_left.xml +theme-sosh/src/main/res/drawable/sosh_tick.xml +theme-sosh/src/main/res/drawable/sosh_radio_button_selected.xml +theme-sosh/src/main/res/drawable/sosh_switch_selected.xml theme-sosh/src/main/res/font/sosh_black.ttf theme-sosh/src/main/res/font/sosh_bold.ttf theme-sosh/src/main/res/font/sosh_medium.ttf diff --git a/core/src/main/java/com/orange/ouds/core/component/OudsButton.kt b/core/src/main/java/com/orange/ouds/core/component/OudsButton.kt index 1554242c2..177c7da1c 100644 --- a/core/src/main/java/com/orange/ouds/core/component/OudsButton.kt +++ b/core/src/main/java/com/orange/ouds/core/component/OudsButton.kt @@ -72,7 +72,6 @@ import com.orange.ouds.core.utilities.getPreviewEnumEntry import com.orange.ouds.foundation.extensions.ifNotNull import com.orange.ouds.foundation.extensions.orElse import com.orange.ouds.foundation.utilities.BasicPreviewParameterProvider -import com.orange.ouds.theme.tokens.components.OudsButtonTokens import kotlinx.parcelize.Parcelize /** @@ -84,7 +83,7 @@ import kotlinx.parcelize.Parcelize * Other layouts are available for this component: *text + icon* and *icon only*. * * Note that in the case it is placed in an [OudsColoredBox], its monochrome variant is automatically displayed. - * Some tokens associated with these specific colors can be customized and are identified with the `Mono` suffix (for instance [OudsButtonTokens.colorBgDefaultEnabledMono]). + * The tokens associated with these specific colors can be customized by overriding [OudsButtonMonoTokens]. * * @param label Label displayed in the button which describes the button action. Use action verbs or phrases to tell the user what will happen next. * @param onClick Callback invoked when the button is clicked. @@ -134,7 +133,7 @@ fun OudsButton( * Other layouts are available for this component: *text only* and *text + icon*. * * Note that in the case it is placed in an [OudsColoredBox], its monochrome variant is automatically displayed. - * Some tokens associated with these specific colors can be customized and are identified with the `Mono` suffix (for instance [OudsButtonTokens.colorBgDefaultEnabledMono]). + * The tokens associated with these specific colors can be customized by overriding [OudsButtonMonoTokens]. * * @param icon Icon displayed in the button. Use an icon to add additional affordance where the icon has a clear and well-established meaning. * @param onClick Callback invoked when the button is clicked. @@ -185,7 +184,7 @@ fun OudsButton( * Other layouts are available for this component: *text only* and *icon only*. * * Note that in the case it is placed in an [OudsColoredBox], its monochrome variant is automatically displayed. - * Some tokens associated with these specific colors can be customized and are identified with the `Mono` suffix (for instance [OudsButtonTokens.colorBgDefaultEnabledMono]). + * The tokens associated with these specific colors can be customized by overriding [OudsButtonMonoTokens]. * * @param icon Icon displayed in the button. Use an icon to add additional affordance where the icon has a clear and well-established meaning. * @param label Label displayed in the button which describes the button action. Use action verbs or phrases to tell the user what will happen next. diff --git a/core/src/main/java/com/orange/ouds/core/component/OudsCheckbox.kt b/core/src/main/java/com/orange/ouds/core/component/OudsCheckbox.kt index 2db1cfb80..303955bd0 100644 --- a/core/src/main/java/com/orange/ouds/core/component/OudsCheckbox.kt +++ b/core/src/main/java/com/orange/ouds/core/component/OudsCheckbox.kt @@ -38,7 +38,6 @@ import androidx.compose.ui.state.ToggleableState import androidx.compose.ui.tooling.preview.PreviewLightDark import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.unit.Dp -import com.orange.ouds.core.R import com.orange.ouds.core.component.common.outerBorder import com.orange.ouds.core.extensions.collectInteractionStateAsState import com.orange.ouds.core.theme.LocalHighContrastModeEnabled @@ -188,9 +187,9 @@ internal fun OudsCheckboxIndicator( .indicatorBorder(state = state, selected = selected, error = error, shape = shape) ) { val indicatorResource = when (value) { - ToggleableState.On -> R.drawable.checkbox_selected + ToggleableState.On -> OudsTheme.drawableResources.checkboxSelected ToggleableState.Off -> null - ToggleableState.Indeterminate -> R.drawable.checkbox_indeterminate + ToggleableState.Indeterminate -> OudsTheme.drawableResources.checkboxIndeterminate } indicatorResource?.let { resource -> diff --git a/core/src/main/java/com/orange/ouds/core/component/OudsChip.kt b/core/src/main/java/com/orange/ouds/core/component/OudsChip.kt index 30a78b194..184d92ae2 100644 --- a/core/src/main/java/com/orange/ouds/core/component/OudsChip.kt +++ b/core/src/main/java/com/orange/ouds/core/component/OudsChip.kt @@ -45,7 +45,6 @@ import androidx.compose.ui.semantics.semantics import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.dp -import com.orange.ouds.core.R import com.orange.ouds.core.component.common.outerBorder import com.orange.ouds.core.component.content.OudsComponentContent import com.orange.ouds.core.component.content.OudsComponentIcon @@ -140,7 +139,7 @@ internal fun OudsChip( if (selected) { tickColor.value?.let { tickColor -> Icon( - painter = painterResource(id = R.drawable.chip_tick), + painter = painterResource(id = OudsTheme.drawableResources.tick), tint = tickColor, contentDescription = null ) diff --git a/core/src/main/java/com/orange/ouds/core/component/OudsLink.kt b/core/src/main/java/com/orange/ouds/core/component/OudsLink.kt index 19a2dd250..28d883031 100644 --- a/core/src/main/java/com/orange/ouds/core/component/OudsLink.kt +++ b/core/src/main/java/com/orange/ouds/core/component/OudsLink.kt @@ -47,7 +47,6 @@ import androidx.compose.ui.tooling.preview.PreviewLightDark import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.dp -import com.orange.ouds.core.R import com.orange.ouds.core.component.OudsLink.Icon.ExtraParameters import com.orange.ouds.core.component.common.outerBorder import com.orange.ouds.core.component.content.OudsComponentContent @@ -62,7 +61,6 @@ import com.orange.ouds.core.utilities.PreviewEnumEntries import com.orange.ouds.core.utilities.getPreviewEnumEntry import com.orange.ouds.foundation.extensions.orElse import com.orange.ouds.foundation.utilities.BasicPreviewParameterProvider -import com.orange.ouds.theme.tokens.components.OudsLinkTokens /** * **OUDS Link design guidelines** @@ -73,7 +71,7 @@ import com.orange.ouds.theme.tokens.components.OudsLinkTokens * If you need a navigation link, you can use the other API available for this component which display a text with a *back* or *next* chevron. * * Note that in the case it is placed in an [OudsColoredBox], its monochrome variant is automatically displayed. - * Some tokens associated with these specific colors can be customized and are identified with the `Mono` suffix (for instance [OudsLinkTokens.colorContentEnabledMono]). + * The tokens associated with this variant can be customized by overriding [OudsLinkMonoTokens]. * * @sample com.orange.ouds.core.component.samples.OudsLinkSample * @@ -110,7 +108,7 @@ fun OudsLink( * An OUDS link which displays an [arrow] before ([OudsLink.Arrow.Back]) or after ([OudsLink.Arrow.Next]) a label. * * In the case it is used in an [OudsColoredBox], its monochrome variant is automatically displayed. - * The tokens associated with this variant can be customized and are identified with the `Mono` suffix (for instance [OudsLinkTokens.colorContentEnabledMono]). + * The tokens associated with this variant can be customized by overriding [OudsLinkMonoTokens]. * * @sample com.orange.ouds.core.component.samples.OudsLinkWithArrowSample * @@ -233,7 +231,7 @@ private fun OudsLink( verticalAlignment = Alignment.CenterVertically ) { if (icon != null || arrow == OudsLink.Arrow.Back) { - icon.orElse { OudsLink.Icon(painterResource(R.drawable.chevron_left)) }.Content( + icon.orElse { OudsLink.Icon(painterResource(OudsTheme.drawableResources.chevronLeft)) }.Content( modifier = Modifier.size(iconSize), extraParameters = ExtraParameters(tint = iconTint) ) @@ -245,7 +243,7 @@ private fun OudsLink( style = textStyle ) if (arrow == OudsLink.Arrow.Next) { - OudsLink.Icon(painterResource(R.drawable.chevron_left)).Content( + OudsLink.Icon(painterResource(OudsTheme.drawableResources.chevronLeft)).Content( modifier = Modifier .size(iconSize) .rotate(180f) diff --git a/core/src/main/java/com/orange/ouds/core/component/OudsRadioButton.kt b/core/src/main/java/com/orange/ouds/core/component/OudsRadioButton.kt index 0eb5068d2..fa4722e6e 100644 --- a/core/src/main/java/com/orange/ouds/core/component/OudsRadioButton.kt +++ b/core/src/main/java/com/orange/ouds/core/component/OudsRadioButton.kt @@ -36,7 +36,6 @@ import androidx.compose.ui.semantics.Role import androidx.compose.ui.tooling.preview.PreviewLightDark import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.unit.Dp -import com.orange.ouds.core.R import com.orange.ouds.core.component.common.outerBorder import com.orange.ouds.core.extensions.collectInteractionStateAsState import com.orange.ouds.core.theme.LocalHighContrastModeEnabled @@ -128,7 +127,7 @@ internal fun OudsRadioButtonIndicator(state: OudsControl.State, selected: Boolea if (selected) { Icon( modifier = Modifier.fillMaxSize(), - painter = painterResource(R.drawable.radiobutton_selected), + painter = painterResource(OudsTheme.drawableResources.radioButtonSelected), tint = indicatorColor(state = state, selected = true, error = error), contentDescription = null ) diff --git a/core/src/main/java/com/orange/ouds/core/component/OudsSwitch.kt b/core/src/main/java/com/orange/ouds/core/component/OudsSwitch.kt index 00527d282..5ac6b2206 100644 --- a/core/src/main/java/com/orange/ouds/core/component/OudsSwitch.kt +++ b/core/src/main/java/com/orange/ouds/core/component/OudsSwitch.kt @@ -50,7 +50,6 @@ import androidx.compose.ui.semantics.Role import androidx.compose.ui.tooling.preview.PreviewLightDark import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.unit.dp -import com.orange.ouds.core.R import com.orange.ouds.core.component.common.outerBorder import com.orange.ouds.core.extensions.collectInteractionStateAsState import com.orange.ouds.core.theme.OudsTheme @@ -161,7 +160,7 @@ internal fun OudsSwitchIndicator(state: OudsControl.State, checked: Boolean, mod modifier = Modifier .alpha(switchTokens.opacityCheck.value) .alpha(checkAlpha), - painter = painterResource(id = R.drawable.switch_selected), + painter = painterResource(id = OudsTheme.drawableResources.switchSelected), contentDescription = null, tint = checkColor ) diff --git a/core/src/main/java/com/orange/ouds/core/theme/OudsTheme.kt b/core/src/main/java/com/orange/ouds/core/theme/OudsTheme.kt index 71c84b3d8..a1eb81bd6 100644 --- a/core/src/main/java/com/orange/ouds/core/theme/OudsTheme.kt +++ b/core/src/main/java/com/orange/ouds/core/theme/OudsTheme.kt @@ -22,6 +22,7 @@ import androidx.compose.runtime.compositionLocalOf import androidx.compose.runtime.staticCompositionLocalOf import androidx.compose.ui.platform.LocalContext import com.orange.ouds.core.extensions.isHighContrastModeEnabled +import com.orange.ouds.theme.OudsDrawableResources import com.orange.ouds.theme.OudsThemeContract import com.orange.ouds.theme.tokens.components.OudsComponentsTokens @@ -44,6 +45,7 @@ internal val LocalSizes = staticCompositionLocalOf { missingCompositi internal val LocalSpaces = staticCompositionLocalOf { missingCompositionLocalError("LocalSpaces") } internal val LocalComponentsTokens = staticCompositionLocalOf { missingCompositionLocalError("LocalComponentsTokens") } internal val LocalColorMode = staticCompositionLocalOf { null } +internal val LocalDrawableResources = staticCompositionLocalOf { missingCompositionLocalError("LocalDrawableResources") } /** * Object that stores tokens values for the current theme. @@ -103,6 +105,11 @@ object OudsTheme { @Composable @ReadOnlyComposable get() = LocalComponentsTokens.current + + internal val drawableResources: OudsDrawableResources + @Composable + @ReadOnlyComposable + get() = LocalDrawableResources.current } /** @@ -141,6 +148,7 @@ fun OudsTheme( LocalSizes provides sizeTokens.getSizes(windowWidthSizeClass), LocalSpaces provides spaceTokens.getSpaces(windowWidthSizeClass), LocalComponentsTokens provides componentsTokens, + LocalDrawableResources provides drawableResources ) { MaterialTheme( colorScheme = materialColorScheme, diff --git a/theme-contract/src/main/java/com/orange/ouds/theme/OudsDrawableResources.kt b/theme-contract/src/main/java/com/orange/ouds/theme/OudsDrawableResources.kt new file mode 100644 index 000000000..1be8dd4ba --- /dev/null +++ b/theme-contract/src/main/java/com/orange/ouds/theme/OudsDrawableResources.kt @@ -0,0 +1,32 @@ +/* + * Software Name: OUDS Android + * SPDX-FileCopyrightText: Copyright (c) Orange SA + * SPDX-License-Identifier: MIT + * + * This software is distributed under the MIT license, + * the text of which is available at https://opensource.org/license/MIT/ + * or see the "LICENSE" file for more details. + * + * Software description: Android library of reusable graphical components + */ + +package com.orange.ouds.theme + +import androidx.annotation.DrawableRes +import com.orange.ouds.foundation.InternalOudsApi + +@InternalOudsApi +open class OudsDrawableResources { + open val checkboxIndeterminate: Int + @DrawableRes get() = R.drawable.ic_checkbox_indeterminate + open val checkboxSelected: Int + @DrawableRes get() = R.drawable.ic_checkbox_selected + open val chevronLeft: Int + @DrawableRes get() = R.drawable.ic_chevron_left + open val radioButtonSelected: Int + @DrawableRes get() = R.drawable.ic_radio_button_selected + open val switchSelected: Int + @DrawableRes get() = R.drawable.ic_switch_selected + open val tick: Int + @DrawableRes get() = R.drawable.ic_tick +} \ No newline at end of file diff --git a/theme-contract/src/main/java/com/orange/ouds/theme/OudsThemeContract.kt b/theme-contract/src/main/java/com/orange/ouds/theme/OudsThemeContract.kt index 180347d27..c6a90e8cf 100644 --- a/theme-contract/src/main/java/com/orange/ouds/theme/OudsThemeContract.kt +++ b/theme-contract/src/main/java/com/orange/ouds/theme/OudsThemeContract.kt @@ -90,8 +90,19 @@ interface OudsThemeContract : Parcelable { val spaceTokens: OudsSpaceSemanticTokens /** - * Customization of the OUDS components if needed + * Allows customization of OUDS components. */ val componentsTokens: OudsComponentsTokens get() = OudsComponentsTokens() + + /** + * Allows customization of drawable resources used by OUDS components. + * OUDS includes a set of default drawable resources. You can replace these with your own drawable resources by overriding this property in your theme. + * + * Caution: + * To avoid resource conflicts, Android recommends using a prefix or other consistent naming scheme that is unique to the module (or is unique across all project modules). + * So, we strongly recommend that you prefix your resources with the name of your theme. For example, if your theme is called "LoremIpsum" you might name your resources as lorem_ipsum_checkbox_selected, lorem_ipsum_tick, etc. + */ + val drawableResources: OudsDrawableResources + get() = OudsDrawableResources() } \ No newline at end of file diff --git a/core/src/main/res/drawable/checkbox_indeterminate.xml b/theme-contract/src/main/res/drawable/ic_checkbox_indeterminate.xml similarity index 100% rename from core/src/main/res/drawable/checkbox_indeterminate.xml rename to theme-contract/src/main/res/drawable/ic_checkbox_indeterminate.xml diff --git a/core/src/main/res/drawable/checkbox_selected.xml b/theme-contract/src/main/res/drawable/ic_checkbox_selected.xml similarity index 100% rename from core/src/main/res/drawable/checkbox_selected.xml rename to theme-contract/src/main/res/drawable/ic_checkbox_selected.xml diff --git a/core/src/main/res/drawable/chevron_left.xml b/theme-contract/src/main/res/drawable/ic_chevron_left.xml similarity index 100% rename from core/src/main/res/drawable/chevron_left.xml rename to theme-contract/src/main/res/drawable/ic_chevron_left.xml diff --git a/core/src/main/res/drawable/radiobutton_selected.xml b/theme-contract/src/main/res/drawable/ic_radio_button_selected.xml similarity index 100% rename from core/src/main/res/drawable/radiobutton_selected.xml rename to theme-contract/src/main/res/drawable/ic_radio_button_selected.xml diff --git a/core/src/main/res/drawable/switch_selected.xml b/theme-contract/src/main/res/drawable/ic_switch_selected.xml similarity index 100% rename from core/src/main/res/drawable/switch_selected.xml rename to theme-contract/src/main/res/drawable/ic_switch_selected.xml diff --git a/core/src/main/res/drawable/chip_tick.xml b/theme-contract/src/main/res/drawable/ic_tick.xml similarity index 100% rename from core/src/main/res/drawable/chip_tick.xml rename to theme-contract/src/main/res/drawable/ic_tick.xml diff --git a/theme-sosh/src/main/java/com/orange/ouds/theme/sosh/SoshDrawableResources.kt b/theme-sosh/src/main/java/com/orange/ouds/theme/sosh/SoshDrawableResources.kt new file mode 100644 index 000000000..d85ddd77e --- /dev/null +++ b/theme-sosh/src/main/java/com/orange/ouds/theme/sosh/SoshDrawableResources.kt @@ -0,0 +1,30 @@ +/* + * Software Name: OUDS Android + * SPDX-FileCopyrightText: Copyright (c) Orange SA + * SPDX-License-Identifier: MIT + * + * This software is distributed under the MIT license, + * the text of which is available at https://opensource.org/license/MIT/ + * or see the "LICENSE" file for more details. + * + * Software description: Android library of reusable graphical components + */ + +package com.orange.ouds.theme.sosh + +import com.orange.ouds.theme.OudsDrawableResources + +class SoshDrawableResources : OudsDrawableResources() { + override val checkboxIndeterminate + get() = R.drawable.sosh_checkbox_indeterminate + override val checkboxSelected: Int + get() = R.drawable.sosh_checkbox_selected + override val chevronLeft: Int + get() = R.drawable.sosh_chevron_left + override val tick: Int + get() = R.drawable.sosh_tick + override val radioButtonSelected: Int + get() = R.drawable.sosh_radio_button_selected + override val switchSelected: Int + get() = R.drawable.sosh_switch_selected +} \ No newline at end of file diff --git a/theme-sosh/src/main/java/com/orange/ouds/theme/sosh/SoshTheme.kt b/theme-sosh/src/main/java/com/orange/ouds/theme/sosh/SoshTheme.kt index c846bf29a..d18287386 100644 --- a/theme-sosh/src/main/java/com/orange/ouds/theme/sosh/SoshTheme.kt +++ b/theme-sosh/src/main/java/com/orange/ouds/theme/sosh/SoshTheme.kt @@ -15,6 +15,7 @@ package com.orange.ouds.theme.sosh import androidx.compose.ui.text.font.Font import androidx.compose.ui.text.font.FontFamily import androidx.compose.ui.text.font.FontWeight +import com.orange.ouds.theme.OudsDrawableResources import com.orange.ouds.theme.OudsThemeContract import com.orange.ouds.theme.sosh.tokens.material.SoshMaterialColorTokens import com.orange.ouds.theme.sosh.tokens.semantic.SoshBorderSemanticTokens @@ -79,4 +80,7 @@ class SoshTheme : OudsThemeContract { override val spaceTokens: OudsSpaceSemanticTokens get() = SoshSpaceSemanticTokens() + + override val drawableResources: OudsDrawableResources + get() = SoshDrawableResources() } diff --git a/theme-sosh/src/main/res/drawable/sosh_checkbox_indeterminate.xml b/theme-sosh/src/main/res/drawable/sosh_checkbox_indeterminate.xml new file mode 100644 index 000000000..d80939ea4 --- /dev/null +++ b/theme-sosh/src/main/res/drawable/sosh_checkbox_indeterminate.xml @@ -0,0 +1,14 @@ + + + + + + diff --git a/theme-sosh/src/main/res/drawable/sosh_checkbox_selected.xml b/theme-sosh/src/main/res/drawable/sosh_checkbox_selected.xml new file mode 100644 index 000000000..e823b238a --- /dev/null +++ b/theme-sosh/src/main/res/drawable/sosh_checkbox_selected.xml @@ -0,0 +1,14 @@ + + + + + + diff --git a/theme-sosh/src/main/res/drawable/sosh_chevron_left.xml b/theme-sosh/src/main/res/drawable/sosh_chevron_left.xml new file mode 100644 index 000000000..d39b95937 --- /dev/null +++ b/theme-sosh/src/main/res/drawable/sosh_chevron_left.xml @@ -0,0 +1,10 @@ + + + diff --git a/theme-sosh/src/main/res/drawable/sosh_radio_button_selected.xml b/theme-sosh/src/main/res/drawable/sosh_radio_button_selected.xml new file mode 100644 index 000000000..59038ee26 --- /dev/null +++ b/theme-sosh/src/main/res/drawable/sosh_radio_button_selected.xml @@ -0,0 +1,14 @@ + + + + + + diff --git a/theme-sosh/src/main/res/drawable/sosh_switch_selected.xml b/theme-sosh/src/main/res/drawable/sosh_switch_selected.xml new file mode 100644 index 000000000..ccb51019c --- /dev/null +++ b/theme-sosh/src/main/res/drawable/sosh_switch_selected.xml @@ -0,0 +1,10 @@ + + + diff --git a/theme-sosh/src/main/res/drawable/sosh_tick.xml b/theme-sosh/src/main/res/drawable/sosh_tick.xml new file mode 100644 index 000000000..f806b78ed --- /dev/null +++ b/theme-sosh/src/main/res/drawable/sosh_tick.xml @@ -0,0 +1,10 @@ + + +