@brightlayer-ui/react-native-themes 7.0.0-alpha.1 → 7.0.0-alpha.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -77,6 +77,50 @@ export declare const MD3BluiDarkTheme: {
77
77
  surfaceContainerHighest: string;
78
78
  disabledContainer: string;
79
79
  onDisabledContainer: string;
80
+ sliderTrack: string;
81
+ sliderTrackDisabled: string;
82
+ errorFilledContainer: string;
83
+ onErrorFilledContainer: string;
84
+ errorShadedContainer: string;
85
+ onErrorShadedContainer: string;
86
+ errorOutlinedContainerOutline: string;
87
+ onErrorOutlinedContainerOutline: string;
88
+ orangeFilledContainer: string;
89
+ onOrangeFilledContainer: string;
90
+ orangeShadedContainer: string;
91
+ onOrangeShadedContainer: string;
92
+ orangeOutlinedContainer: string;
93
+ onOrangeOutlinedContainer: string;
94
+ warningFilledContainer: string;
95
+ onWarningFilledContainer: string;
96
+ warningShadedContainer: string;
97
+ onWarningShadedContainer: string;
98
+ warningOutlinedContainerOutline: string;
99
+ onWarningOutlinedContainer: string;
100
+ successFilledContainer: string;
101
+ onSuccessFilledContainer: string;
102
+ successShadedContainer: string;
103
+ successShadedLabel: string;
104
+ successOutlinedContainerOutline: string;
105
+ onSuccessOutlinedContainer: string;
106
+ primaryFilledContainer: string;
107
+ onPrimaryFilledContainer: string;
108
+ primaryShadedContainer: string;
109
+ onPrimaryShadedContainer: string;
110
+ primaryOutlinedContainerOutline: string;
111
+ onPrimaryOutlinedContainer: string;
112
+ purpleFilledContainer: string;
113
+ onPurpleFilledContainer: string;
114
+ purpleShadedContainer: string;
115
+ onPurpleShadedContainer: string;
116
+ purpleOutlinedContainerOutline: string;
117
+ onPurpleOutlinedContainer: string;
118
+ neutralFilledContainer: string;
119
+ onNeutralFilledContainer: string;
120
+ neutralShadedContainer: string;
121
+ onNeutralShadedContainer: string;
122
+ neutralOutlinedContainerOutline: string;
123
+ onNeutralOutlinedContainer: string;
80
124
  backdrop: string;
81
125
  };
82
126
  dark: boolean;
@@ -99,4 +99,94 @@ exports.MD3BluiDarkTheme = __assign(__assign({}, react_native_paper_1.MD3DarkThe
99
99
  // Highest-emphasis container color
100
100
  surfaceContainerHighest: colors_1.default.neutral[20],
101
101
  // This is alias for surface disabled, used as disabled container background
102
- disabledContainer: (0, color_1.default)(colors_1.default.neutral[95]).alpha(0.1).rgb().string(), onDisabledContainer: (0, color_1.default)(colors_1.default.neutral[95]).alpha(0.15).rgb().string() }) });
102
+ disabledContainer: (0, color_1.default)(colors_1.default.neutral[95]).alpha(0.1).rgb().string(),
103
+ // Text and icons against disable container
104
+ onDisabledContainer: (0, color_1.default)(colors_1.default.neutral[95]).alpha(0.15).rgb().string(),
105
+ // Can be used on slider and range selector track
106
+ sliderTrack: colors_1.default.neutral[30],
107
+ // Disabled version of slider track color variant
108
+ sliderTrackDisabled: (0, color_1.default)(colors_1.default.neutral[30]).alpha(0.5).rgb().string(),
109
+ // Attention-grabbing color against error filled surface
110
+ errorFilledContainer: colors_1.default.error[40],
111
+ // Text and icons against error filled container
112
+ onErrorFilledContainer: colors_1.default.error[100],
113
+ // Attention-grabbing color against error shaded surface
114
+ errorShadedContainer: (0, color_1.default)(colors_1.default.error[40]).alpha(0.3).rgb().string(),
115
+ // Text and icons against error shaded container
116
+ onErrorShadedContainer: colors_1.default.error[80],
117
+ // Attention-grabbing color against error outlined container
118
+ errorOutlinedContainerOutline: colors_1.default.error[60],
119
+ // Text and icons against error outlined container
120
+ onErrorOutlinedContainerOutline: colors_1.default.error[80],
121
+ // Orange color against orange filled surface
122
+ orangeFilledContainer: colors_1.default.orange[70],
123
+ // Text and icons against orange filled container
124
+ onOrangeFilledContainer: colors_1.default.orange[20],
125
+ // Orange color against orange shaded surface
126
+ orangeShadedContainer: (0, color_1.default)(colors_1.default.orange[70]).alpha(0.15).rgb().string(),
127
+ // Text and icons against orange shaded container
128
+ onOrangeShadedContainer: colors_1.default.orange[80],
129
+ // Orange color against orange outlined surface
130
+ orangeOutlinedContainer: colors_1.default.orange[70],
131
+ // Text and icons against orange outlined container
132
+ onOrangeOutlinedContainer: colors_1.default.orange[80],
133
+ // Warning color against warning filled surface
134
+ warningFilledContainer: colors_1.default.warning[80],
135
+ // Text and icons against warning filled container
136
+ onWarningFilledContainer: colors_1.default.warning[30],
137
+ // Warning color against warning shaded surface
138
+ warningShadedContainer: (0, color_1.default)(colors_1.default.warning[90]).alpha(0.1).rgb().string(),
139
+ // Text and icons against warning shaded container
140
+ onWarningShadedContainer: colors_1.default.warning[90],
141
+ // Warning color against warning outlined container surface
142
+ warningOutlinedContainerOutline: colors_1.default.warning[90],
143
+ // Text and icons against warning outlined container surface
144
+ onWarningOutlinedContainer: colors_1.default.warning[90],
145
+ // Attention-grabbing color against success filled container
146
+ successFilledContainer: colors_1.default.success[50],
147
+ // Text and icons against success filled container
148
+ onSuccessFilledContainer: colors_1.default.success[100],
149
+ // Attention-grabbing color against success shaded surface
150
+ successShadedContainer: (0, color_1.default)(colors_1.default.success[40]).alpha(0.3).rgb().string(),
151
+ // Attention-grabbing label color against success shaded surface
152
+ successShadedLabel: colors_1.default.success[90],
153
+ // Attention-grabbing color against success container
154
+ successOutlinedContainerOutline: colors_1.default.success[70],
155
+ // Text and icons against success outlined container
156
+ onSuccessOutlinedContainer: colors_1.default.success[80],
157
+ // Primary color against primary filled surface
158
+ primaryFilledContainer: colors_1.default.primary[50],
159
+ // Text and icons against primary filled container
160
+ onPrimaryFilledContainer: colors_1.default.primary[100],
161
+ // Primary color against primary shaded surface
162
+ primaryShadedContainer: (0, color_1.default)(colors_1.default.primary[40]).alpha(0.4).rgb().string(),
163
+ // Text and icons against primary shaded container
164
+ onPrimaryShadedContainer: colors_1.default.primary[80],
165
+ // Primary color against primary outlined container
166
+ primaryOutlinedContainerOutline: colors_1.default.primary[60],
167
+ // Text and icons against primary outlined container
168
+ onPrimaryOutlinedContainer: colors_1.default.primary[70],
169
+ // Purple color against purple filled surface
170
+ purpleFilledContainer: colors_1.default.purple[50],
171
+ // Text and icons against purple filled container
172
+ onPurpleFilledContainer: colors_1.default.purple[100],
173
+ // Purple color against purple shaded surface
174
+ purpleShadedContainer: (0, color_1.default)(colors_1.default.purple[40]).alpha(0.4).rgb().string(),
175
+ // Text and icons against purple shaded container
176
+ onPurpleShadedContainer: colors_1.default.purple[80],
177
+ // Purple color against purple outlined container
178
+ purpleOutlinedContainerOutline: colors_1.default.purple[50],
179
+ // Text and icons against purple outlined container
180
+ onPurpleOutlinedContainer: colors_1.default.purple[70],
181
+ // Neutral color against neutral filled surface
182
+ neutralFilledContainer: colors_1.default.neutral[50],
183
+ // Text and icons against neutral filled container
184
+ onNeutralFilledContainer: colors_1.default.neutral[100],
185
+ // Neutral color against neutral shaded surface
186
+ neutralShadedContainer: (0, color_1.default)(colors_1.default.neutral[50]).alpha(0.4).rgb().string(),
187
+ // Text and icons against neutral shaded container
188
+ onNeutralShadedContainer: colors_1.default.neutral[80],
189
+ // Neutral color against neutral outlined container
190
+ neutralOutlinedContainerOutline: colors_1.default.neutralVariant[60],
191
+ // Text and icons against Neutral outlined container
192
+ onNeutralOutlinedContainer: colors_1.default.neutralVariant[70] }) });
@@ -77,6 +77,50 @@ export declare const MD3BluiLightTheme: {
77
77
  surfaceContainerHighest: string;
78
78
  disabledContainer: string;
79
79
  onDisabledContainer: string;
80
+ sliderTrack: string;
81
+ sliderTrackDisabled: string;
82
+ errorFilledContainer: string;
83
+ onErrorFilledContainer: string;
84
+ errorShadedContainer: string;
85
+ onErrorShadedContainer: string;
86
+ errorOutlinedContainerOutline: string;
87
+ onErrorOutlinedContainer: string;
88
+ orangeFilledContainer: string;
89
+ onOrangeFilledContainer: string;
90
+ orangeShadedContainer: string;
91
+ onOrangeShadedContainer: string;
92
+ orangeOutlinedContainer: string;
93
+ onOrangeOutlinedContainer: string;
94
+ warningFilledContainer: string;
95
+ onWarningFilledContainer: string;
96
+ warningShadedContainer: string;
97
+ onWarningShadedContainer: string;
98
+ warningOutlinedContainerOutline: string;
99
+ onWarningOutlinedContainer: string;
100
+ successFilledContainer: string;
101
+ onSuccessFilledContainer: string;
102
+ successShadedContainer: string;
103
+ successShadedLabel: string;
104
+ successOutlinedContainerOutline: string;
105
+ onSuccessOutlinedContainer: string;
106
+ primaryFilledContainer: string;
107
+ onPrimaryFilledContainer: string;
108
+ primaryShadedContainer: string;
109
+ onPrimaryShadedContainer: string;
110
+ primaryOutlinedContainerOutline: string;
111
+ onPrimaryOutlinedContainer: string;
112
+ purpleFilledContainer: string;
113
+ onPurpleFilledContainer: string;
114
+ purpleShadedContainer: string;
115
+ onPurpleShadedContainer: string;
116
+ purpleOutlinedContainerOutline: string;
117
+ onPurpleOutlinedContainer: string;
118
+ neutralFilledContainer: string;
119
+ onNeutralFilledContainer: string;
120
+ neutralShadedContainer: string;
121
+ onNeutralShadedContainer: string;
122
+ neutralOutlinedContainerOutline: string;
123
+ onNeutralOutlinedContainer: string;
80
124
  backdrop: string;
81
125
  };
82
126
  dark: boolean;
package/dist/blueTheme.js CHANGED
@@ -99,4 +99,94 @@ exports.MD3BluiLightTheme = __assign(__assign({}, react_native_paper_1.MD3LightT
99
99
  // Highest-emphasis container color
100
100
  surfaceContainerHighest: colors_1.default.neutral[90],
101
101
  // This is alias for surface disabled, used as disabled container background
102
- disabledContainer: (0, color_1.default)(colors_1.default.neutral[10]).alpha(0.05).rgb().string(), onDisabledContainer: (0, color_1.default)(colors_1.default.neutral[10]).alpha(0.25).rgb().string() }) });
102
+ disabledContainer: (0, color_1.default)(colors_1.default.neutral[10]).alpha(0.05).rgb().string(),
103
+ // Text and icons against disable container
104
+ onDisabledContainer: (0, color_1.default)(colors_1.default.neutral[10]).alpha(0.25).rgb().string(),
105
+ // Can be used on slider and range selector track
106
+ sliderTrack: colors_1.default.neutral[80],
107
+ // Disabled version of slider track color variant
108
+ sliderTrackDisabled: (0, color_1.default)(colors_1.default.neutral[80]).alpha(0.3).rgb().string(),
109
+ // Attention-grabbing color against error filled surface
110
+ errorFilledContainer: colors_1.default.error[40],
111
+ // Text and icons against error filled container
112
+ onErrorFilledContainer: colors_1.default.error[100],
113
+ // Attention-grabbing color against error shaded surface
114
+ errorShadedContainer: (0, color_1.default)(colors_1.default.error[40]).alpha(0.15).rgb().string(),
115
+ // Text and icons against error shaded container
116
+ onErrorShadedContainer: colors_1.default.error[30],
117
+ // Attention-grabbing color against error outlined container
118
+ errorOutlinedContainerOutline: colors_1.default.error[40],
119
+ // Text and icons against error outlined container
120
+ onErrorOutlinedContainer: colors_1.default.error[40],
121
+ // Orange color against orange filled surface
122
+ orangeFilledContainer: colors_1.default.orange[70],
123
+ // Text and icons against orange filled container
124
+ onOrangeFilledContainer: colors_1.default.orange[20],
125
+ // Orange color against orange shaded surface
126
+ orangeShadedContainer: (0, color_1.default)(colors_1.default.orange[70]).alpha(0.2).rgb().string(),
127
+ // Text and icons against orange shaded container
128
+ onOrangeShadedContainer: colors_1.default.orange[30],
129
+ // Orange color against orange outlined surface
130
+ orangeOutlinedContainer: colors_1.default.orange[70],
131
+ // Text and icons against orange outlined container
132
+ onOrangeOutlinedContainer: colors_1.default.orange[40],
133
+ // Warning color against warning filled surface
134
+ warningFilledContainer: colors_1.default.warning[90],
135
+ // Text and icons against warning filled container
136
+ onWarningFilledContainer: colors_1.default.warning[30],
137
+ // Warning color against warning shaded surface
138
+ warningShadedContainer: (0, color_1.default)(colors_1.default.warning[90]).alpha(0.5).rgb().string(),
139
+ // Text and icons against warning shaded container
140
+ onWarningShadedContainer: colors_1.default.warning[30],
141
+ // Warning color against warning outlined container
142
+ warningOutlinedContainerOutline: colors_1.default.warning[80],
143
+ // Text and icons against warning outlined container
144
+ onWarningOutlinedContainer: colors_1.default.warning[40],
145
+ // Attention-grabbing color against success filled container
146
+ successFilledContainer: colors_1.default.success[50],
147
+ // Text and icons against success filled container
148
+ onSuccessFilledContainer: colors_1.default.success[100],
149
+ // Attention-grabbing color against success shaded surface
150
+ successShadedContainer: (0, color_1.default)(colors_1.default.success[40]).alpha(0.15).rgb().string(),
151
+ // Attention-grabbing label color against success shaded surface
152
+ successShadedLabel: colors_1.default.success[30],
153
+ // Attention-grabbing color against success container
154
+ successOutlinedContainerOutline: colors_1.default.success[50],
155
+ // Text and icons against success outlined container
156
+ onSuccessOutlinedContainer: colors_1.default.success[40],
157
+ // Primary color against primary filled surface
158
+ primaryFilledContainer: colors_1.default.primary[50],
159
+ // Text and icons against primary filled container
160
+ onPrimaryFilledContainer: colors_1.default.primary[100],
161
+ // Primary color against primary shaded surface
162
+ primaryShadedContainer: (0, color_1.default)(colors_1.default.primary[40]).alpha(0.15).rgb().string(),
163
+ // Text and icons against primary shaded container
164
+ onPrimaryShadedContainer: colors_1.default.primary[30],
165
+ // Primary color against primary outlined container
166
+ primaryOutlinedContainerOutline: colors_1.default.primary[50],
167
+ // Text and icons against primary outlined container
168
+ onPrimaryOutlinedContainer: colors_1.default.primary[40],
169
+ // Purple color against purple filled surface
170
+ purpleFilledContainer: colors_1.default.purple[50],
171
+ // Text and icons against purple filled container
172
+ onPurpleFilledContainer: colors_1.default.purple[100],
173
+ // Purple color against purple shaded surface
174
+ purpleShadedContainer: (0, color_1.default)(colors_1.default.purple[40]).alpha(0.15).rgb().string(),
175
+ // Text and icons against purple shaded container
176
+ onPurpleShadedContainer: colors_1.default.purple[30],
177
+ // Purple color against purple outlined container
178
+ purpleOutlinedContainerOutline: colors_1.default.purple[50],
179
+ // Text and icons against purple outlined container
180
+ onPurpleOutlinedContainer: colors_1.default.purple[40],
181
+ // Neutral color against neutral filled surface
182
+ neutralFilledContainer: colors_1.default.neutral[50],
183
+ // Text and icons against neutral filled container
184
+ onNeutralFilledContainer: colors_1.default.neutral[100],
185
+ // Neutral color against neutral shaded surface
186
+ neutralShadedContainer: (0, color_1.default)(colors_1.default.neutral[50]).alpha(0.2).rgb().string(),
187
+ // Text and icons against neutral shaded container
188
+ onNeutralShadedContainer: colors_1.default.neutral[30],
189
+ // Neutral color against neutral outlined container
190
+ neutralOutlinedContainerOutline: colors_1.default.neutralVariant[50],
191
+ // Text and icons against Neutral outlined container
192
+ onNeutralOutlinedContainer: colors_1.default.neutralVariant[30] }) });
package/dist/shared.d.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  import { MD3Theme } from 'react-native-paper';
2
- import { MD3Type, MD3Typescale } from 'react-native-paper/lib/typescript/types';
3
2
  import { $DeepPartial } from '@callstack/react-theme-provider';
4
3
  export declare const fontConfig: {
5
4
  displaySmall: {
@@ -100,7 +99,7 @@ export declare const fontConfig: {
100
99
  letterSpacing: number;
101
100
  };
102
101
  };
103
- export type ExtendedTheme = Omit<MD3Theme, 'colors' | 'fonts'> & {
102
+ export type ExtendedTheme = Omit<MD3Theme, 'colors'> & {
104
103
  colors: {
105
104
  primary: string;
106
105
  primaryContainer: string;
@@ -172,6 +171,8 @@ export type ExtendedTheme = Omit<MD3Theme, 'colors' | 'fonts'> & {
172
171
  surfaceContainerHighest: string;
173
172
  disabledContainer: string;
174
173
  onDisabledContainer: string;
174
+ sliderTrack: string;
175
+ sliderTrackDisabled: string;
175
176
  errorFilledContainer: string;
176
177
  onErrorFilledContainer: string;
177
178
  errorShadedContainer: string;
@@ -215,8 +216,5 @@ export type ExtendedTheme = Omit<MD3Theme, 'colors' | 'fonts'> & {
215
216
  neutralOutlinedContainerOutline: string;
216
217
  onNeutralOutlinedContainer: string;
217
218
  };
218
- fonts: MD3Typescale & {
219
- customVariant: MD3Type;
220
- };
221
219
  };
222
220
  export declare const useExtendedTheme: (overrides?: $DeepPartial<ExtendedTheme>) => ExtendedTheme;
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@brightlayer-ui/react-native-themes",
3
3
  "author": "Brightlayer UI <brightlayer-ui@eaton.com>",
4
4
  "license": "BSD-3-Clause",
5
- "version": "7.0.0-alpha.1",
5
+ "version": "7.0.0-alpha.3",
6
6
  "description": "React Native themes for Brightlayer UI applications",
7
7
  "main": "./dist/index.js",
8
8
  "scripts": {