@descope/web-components-ui 1.0.399 → 1.0.400-1
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.
- package/dist/cjs/index.cjs.js +28 -7
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +28 -7
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/descope-container-index-js.js +1 -1
- package/dist/umd/descope-grid-index-js.js +1 -1
- package/dist/umd/descope-new-password-descope-new-password-internal-index-js.js +1 -1
- package/dist/umd/descope-new-password-index-js.js +1 -1
- package/dist/umd/descope-policy-validation-index-js.js +1 -1
- package/dist/umd/descope-upload-file-index-js.js +1 -1
- package/package.json +2 -2
- package/src/components/descope-container/ContainerClass.js +6 -0
- package/src/components/descope-grid/helpers.js +1 -1
- package/src/components/descope-policy-validation/PolicyValidationClass.js +2 -2
- package/src/components/descope-upload-file/UploadFileClass.js +3 -3
- package/src/helpers/themeHelpers/index.js +8 -1
- package/src/theme/components/container.js +10 -2
|
@@ -148,7 +148,14 @@ export const themeToStyle = ({ globals, components }, themeName) => ({
|
|
|
148
148
|
components: createComponentsTheme(components),
|
|
149
149
|
});
|
|
150
150
|
|
|
151
|
-
|
|
151
|
+
// allows to generate css variables with nested fallbacks
|
|
152
|
+
export const useVar = (...varNames) => {
|
|
153
|
+
return varNames.reduceRight((acc, value) => {
|
|
154
|
+
if (value.startsWith('--')) return `var(${value}${acc ? `, ${acc}` : acc})`;
|
|
155
|
+
|
|
156
|
+
return `${value}${acc ? `, ${acc}` : acc}`;
|
|
157
|
+
}, '');
|
|
158
|
+
};
|
|
152
159
|
|
|
153
160
|
export const createHelperVars = (theme, prefix) => {
|
|
154
161
|
const res = transformTheme(theme, [], (path, value) => {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import globals from '../globals';
|
|
2
|
-
import { getThemeRefs, createHelperVars } from '../../helpers/themeHelpers';
|
|
3
1
|
import { ContainerClass, componentName } from '../../components/descope-container/ContainerClass';
|
|
2
|
+
import { createHelperVars, getThemeRefs } from '../../helpers/themeHelpers';
|
|
3
|
+
import globals from '../globals';
|
|
4
4
|
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
|
6
6
|
|
|
@@ -35,7 +35,15 @@ const container = {
|
|
|
35
35
|
[compVars.itemsGrow]: '0',
|
|
36
36
|
[compVars.hostWidth]: '100%',
|
|
37
37
|
[compVars.boxShadow]: 'none',
|
|
38
|
+
|
|
38
39
|
[compVars.backgroundColor]: globalRefs.colors.surface.main,
|
|
40
|
+
|
|
41
|
+
[compVars.backgroundImage]: '', // we need to set a value to avoid inner containers from inheriting the parent's background image
|
|
42
|
+
[compVars.backgroundPositionX]: 'center',
|
|
43
|
+
[compVars.backgroundPositionY]: 'center',
|
|
44
|
+
[compVars.backgroundSize]: 'cover',
|
|
45
|
+
[compVars.backgroundRepeat]: 'no-repeat',
|
|
46
|
+
|
|
39
47
|
[compVars.color]: globalRefs.colors.surface.contrast,
|
|
40
48
|
[compVars.borderRadius]: '0px',
|
|
41
49
|
[compVars.hostDirection]: globalRefs.direction,
|