@ui5/webcomponents-base 0.0.0-6ef02a35f → 0.0.0-701b14e36
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/.eslintignore +3 -2
- package/CHANGELOG.md +199 -0
- package/README.md +26 -2
- package/bundle.esm.js +6 -2
- package/dist/Boot.js +34 -18
- package/dist/CSP.js +59 -0
- package/dist/CustomElementsRegistry.js +60 -4
- package/dist/CustomElementsScope.js +20 -98
- package/dist/CustomElementsScopeUtils.js +108 -0
- package/dist/Device.js +20 -1
- package/dist/EventProvider.js +19 -25
- package/dist/FeaturesRegistry.js +4 -1
- package/dist/FontFace.js +7 -95
- package/dist/InitialConfiguration.js +11 -7
- package/dist/Keys.js +56 -0
- package/dist/ManagedStyles.js +83 -0
- package/dist/Render.js +3 -1
- package/dist/Runtimes.js +107 -0
- package/dist/StaticAreaItem.js +15 -10
- package/dist/SystemCSSVars.js +4 -25
- package/dist/UI5Element.js +59 -60
- package/dist/UI5ElementMetadata.js +18 -2
- package/dist/asset-registries/Icons.js +22 -8
- package/dist/asset-registries/Illustrations.js +10 -3
- package/dist/asset-registries/LocaleData.js +17 -3
- package/dist/asset-registries/Themes.js +6 -2
- package/dist/assets-meta/IconCollectionsAlias.js +18 -0
- package/dist/config/Icons.js +52 -0
- package/dist/config/Theme.js +25 -0
- package/dist/css/BusyIndicator.css +76 -0
- package/dist/css/FontFace.css +75 -0
- package/dist/css/OverrideFontFace.css +32 -0
- package/dist/css/SystemCSSVars.css +17 -0
- package/dist/delegate/ItemNavigation.js +66 -0
- package/dist/features/F6Navigation.js +106 -0
- package/dist/features/OpenUI5Enablement.js +119 -0
- package/dist/generated/AssetParameters.js +1 -1
- package/dist/generated/VersionInfo.js +10 -0
- package/dist/generated/css/BusyIndicator.css.js +5 -0
- package/dist/generated/css/FontFace.css.js +5 -0
- package/dist/generated/css/OverrideFontFace.css.js +5 -0
- package/dist/generated/css/SystemCSSVars.css.js +5 -0
- package/dist/i18nBundle.js +33 -2
- package/dist/renderer/LitRenderer.js +33 -12
- package/dist/renderer/directives/style-map.js +72 -0
- package/dist/renderer/executeTemplate.js +19 -2
- package/dist/resources/bundle.esm.js +15 -9
- package/dist/resources/bundle.esm.js.map +1 -1
- package/dist/sap/base/Log.js +2 -10
- package/dist/sap/base/assert.js +1 -5
- package/dist/sap/base/security/encodeCSS.js +14 -0
- package/dist/sap/base/security/encodeXML.js +23 -0
- package/dist/sap/base/strings/toHex.js +8 -0
- package/dist/sap/ui/thirdparty/caja-html-sanitizer.js +1 -1
- package/dist/test-resources/elements/WithStaticArea.js +2 -1
- package/dist/test-resources/pages/AllTestElements.html +3 -0
- package/dist/test-resources/pages/i18n.html +1 -3
- package/dist/test-resources/specs/ConfigurationChange.spec.js +9 -9
- package/dist/test-resources/specs/ConfigurationScript.spec.js +24 -24
- package/dist/test-resources/specs/ConfigurationURL.spec.js +33 -33
- package/dist/test-resources/specs/CustomTheme.spec.js +7 -7
- package/dist/test-resources/specs/EventProvider.spec.js +63 -0
- package/dist/test-resources/specs/StaticArea.spec.js +55 -13
- package/dist/test-resources/specs/Theming.spec.js +22 -11
- package/dist/test-resources/specs/UI5ElementInvalidation.js +29 -29
- package/dist/test-resources/specs/UI5ElementLifecycle.js +11 -11
- package/dist/test-resources/specs/UI5ElementListenForChildPropChanges.spec.js +11 -11
- package/dist/test-resources/specs/UI5ElementMetadataExt.js +8 -8
- package/dist/test-resources/specs/UI5ElementPropertyValidation.js +6 -6
- package/dist/test-resources/specs/UI5ElementPropsAndAttrs.spec.js +36 -36
- package/dist/test-resources/specs/UI5ElementShadowDOM.js +9 -9
- package/dist/test-resources/specs/UI5ElementSlots.js +9 -9
- package/dist/theming/CustomStyle.js +23 -3
- package/dist/theming/applyTheme.js +11 -10
- package/dist/theming/getEffectiveLinksHrefs.js +27 -0
- package/dist/theming/getEffectiveStyle.js +9 -0
- package/dist/theming/getStylesString.js +4 -2
- package/dist/theming/getThemeDesignerTheme.js +25 -5
- package/dist/theming/preloadLinks.js +23 -0
- package/dist/types/DataType.js +12 -0
- package/dist/types/Float.js +4 -0
- package/dist/types/Integer.js +4 -0
- package/dist/updateShadowRoot.js +8 -4
- package/dist/util/FocusableElements.js +8 -6
- package/dist/util/InvisibleMessage.js +11 -9
- package/dist/util/TabbableElements.js +4 -0
- package/dist/util/createLinkInHead.js +19 -0
- package/dist/util/escapeRegex.js +10 -0
- package/dist/util/generateHighlightedMarkup.js +42 -0
- package/dist/util/getNormalizedTarget.js +16 -0
- package/dist/util/isNodeHidden.js +1 -1
- package/lib/generate-asset-parameters/index.js +8 -5
- package/lib/generate-styles/index.js +26 -0
- package/lib/generate-version-info/index.js +32 -0
- package/package-scripts.js +12 -16
- package/package.json +10 -12
- package/src/Boot.js +34 -18
- package/src/CSP.js +59 -0
- package/src/CustomElementsRegistry.js +60 -4
- package/src/CustomElementsScope.js +20 -98
- package/src/CustomElementsScopeUtils.js +108 -0
- package/src/Device.js +20 -1
- package/src/EventProvider.js +19 -25
- package/src/FeaturesRegistry.js +4 -1
- package/src/FontFace.js +7 -95
- package/src/InitialConfiguration.js +11 -7
- package/src/Keys.js +56 -0
- package/src/ManagedStyles.js +83 -0
- package/src/Render.js +3 -1
- package/src/Runtimes.js +107 -0
- package/src/StaticAreaItem.js +15 -10
- package/src/SystemCSSVars.js +4 -25
- package/src/UI5Element.js +59 -60
- package/src/UI5ElementMetadata.js +18 -2
- package/src/asset-registries/Icons.js +22 -8
- package/src/asset-registries/Illustrations.js +10 -3
- package/src/asset-registries/LocaleData.js +17 -3
- package/src/asset-registries/Themes.js +6 -2
- package/src/assets-meta/IconCollectionsAlias.js +18 -0
- package/src/config/Icons.js +52 -0
- package/src/config/Theme.js +25 -0
- package/src/css/BusyIndicator.css +76 -0
- package/src/css/FontFace.css +75 -0
- package/src/css/OverrideFontFace.css +32 -0
- package/src/css/SystemCSSVars.css +17 -0
- package/src/delegate/ItemNavigation.js +66 -0
- package/src/features/F6Navigation.js +106 -0
- package/src/features/OpenUI5Enablement.js +119 -0
- package/src/i18nBundle.js +33 -2
- package/src/renderer/LitRenderer.js +33 -12
- package/src/renderer/directives/style-map.js +72 -0
- package/src/renderer/executeTemplate.js +19 -2
- package/src/theming/CustomStyle.js +23 -3
- package/src/theming/applyTheme.js +11 -10
- package/src/theming/getEffectiveLinksHrefs.js +27 -0
- package/src/theming/getEffectiveStyle.js +9 -0
- package/src/theming/getStylesString.js +4 -2
- package/src/theming/getThemeDesignerTheme.js +25 -5
- package/src/theming/preloadLinks.js +23 -0
- package/src/types/DataType.js +12 -0
- package/src/types/Float.js +4 -0
- package/src/types/Integer.js +4 -0
- package/src/updateShadowRoot.js +8 -4
- package/src/util/FocusableElements.js +8 -6
- package/src/util/InvisibleMessage.js +11 -9
- package/src/util/TabbableElements.js +4 -0
- package/src/util/createLinkInHead.js +19 -0
- package/src/util/escapeRegex.js +10 -0
- package/src/util/generateHighlightedMarkup.js +42 -0
- package/src/util/getNormalizedTarget.js +16 -0
- package/src/util/isNodeHidden.js +1 -1
- package/used-modules.txt +4 -1
- package/dist/config/AssetsPath.js +0 -17
- package/dist/theming/createThemePropertiesStyleTag.js +0 -20
- package/dist/util/encodeCSS.js +0 -24
- package/hash.txt +0 -1
- package/src/config/AssetsPath.js +0 -17
- package/src/theming/createThemePropertiesStyleTag.js +0 -20
- package/src/util/encodeCSS.js +0 -24
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { getTheme, isThemeFamily } from "./Theme.js";
|
|
2
|
+
|
|
3
|
+
const IconCollectionConfiguration = new Map();
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Sets the default icon collection (v4 or v5) per theme,
|
|
7
|
+
* which will be applied in case icon collection is not specified.
|
|
8
|
+
*
|
|
9
|
+
* Note: by default SAP-icons-v5 is used in SAP Horizon and SAP-icons-v4 for all the rest.
|
|
10
|
+
* @param {String} theme
|
|
11
|
+
* @param {String} collectionName
|
|
12
|
+
*/
|
|
13
|
+
const setDefaultIconCollection = (theme, collectionName) => {
|
|
14
|
+
if (collectionName === "horizon") {
|
|
15
|
+
collectionName = "SAP-icons-v5";
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
IconCollectionConfiguration.set(theme, collectionName);
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* Returns the default icon collection (v4 or v5) for given theme,
|
|
23
|
+
* that is configured.
|
|
24
|
+
*
|
|
25
|
+
* @param {String} theme
|
|
26
|
+
* @returns {String}
|
|
27
|
+
*/
|
|
28
|
+
const getDefaultIconCollection = theme => {
|
|
29
|
+
return IconCollectionConfiguration.get(theme);
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* Returns the effective icon collection that will be applied for icon web components
|
|
34
|
+
* whenever namespace is not specified.
|
|
35
|
+
* @returns {String}
|
|
36
|
+
*/
|
|
37
|
+
const getEffectiveDefaultIconCollection = () => {
|
|
38
|
+
const currentTheme = getTheme();
|
|
39
|
+
const currentThemeConfiguration = IconCollectionConfiguration.get(currentTheme);
|
|
40
|
+
|
|
41
|
+
if (currentThemeConfiguration) {
|
|
42
|
+
return currentThemeConfiguration;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
return isThemeFamily("sap_horizon") ? "SAP-icons-v5" : "SAP-icons";
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
export {
|
|
49
|
+
setDefaultIconCollection,
|
|
50
|
+
getDefaultIconCollection,
|
|
51
|
+
getEffectiveDefaultIconCollection,
|
|
52
|
+
};
|
package/dist/config/Theme.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { getTheme as getConfiguredTheme } from "../InitialConfiguration.js";
|
|
2
|
+
import { reRenderAllUI5Elements } from "../Render.js";
|
|
2
3
|
import applyTheme from "../theming/applyTheme.js";
|
|
3
4
|
|
|
4
5
|
let theme;
|
|
@@ -20,9 +21,33 @@ const setTheme = async newTheme => {
|
|
|
20
21
|
|
|
21
22
|
// Update CSS Custom Properties
|
|
22
23
|
await applyTheme(theme);
|
|
24
|
+
await reRenderAllUI5Elements({ themeAware: true });
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Returns if the given theme name is the one currently applied.
|
|
29
|
+
* @private
|
|
30
|
+
* @param {String}
|
|
31
|
+
* @returns {boolean}
|
|
32
|
+
*/
|
|
33
|
+
const isTheme = _theme => {
|
|
34
|
+
const currentTheme = getTheme();
|
|
35
|
+
return currentTheme === _theme || currentTheme === `${_theme}_exp`;
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
/**
|
|
39
|
+
* Returns if the current theme is part of given theme family
|
|
40
|
+
* @private
|
|
41
|
+
* @param {String} the theme family
|
|
42
|
+
* @returns {boolean}
|
|
43
|
+
*/
|
|
44
|
+
const isThemeFamily = _theme => {
|
|
45
|
+
return getTheme().startsWith(_theme);
|
|
23
46
|
};
|
|
24
47
|
|
|
25
48
|
export {
|
|
26
49
|
getTheme,
|
|
27
50
|
setTheme,
|
|
51
|
+
isTheme,
|
|
52
|
+
isThemeFamily,
|
|
28
53
|
};
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
.busy-indicator-wrapper {
|
|
2
|
+
position: relative;
|
|
3
|
+
height: 100%;
|
|
4
|
+
width: 100%;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
.busy-indicator-overlay {
|
|
8
|
+
display: var(--ui5_web_components_busy_indicator_display);
|
|
9
|
+
position: absolute;
|
|
10
|
+
inset: 0;
|
|
11
|
+
background: var(--ui5_web_components_busy_indicator_background-color);
|
|
12
|
+
z-index: 99;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.busy-indicator-busy-area {
|
|
16
|
+
display: var(--ui5_web_components_busy_indicator_display);
|
|
17
|
+
position: absolute;
|
|
18
|
+
z-index: 99;
|
|
19
|
+
inset: 0;
|
|
20
|
+
justify-content: center;
|
|
21
|
+
align-items: center;
|
|
22
|
+
background-color: inherit;
|
|
23
|
+
flex-direction: column;
|
|
24
|
+
color: var(--_ui5_busy_indicator_color);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
:host([__is-busy]) .busy-indicator-wrapper > :not(.busy-indicator-busy-area):not(.busy-indicator-overlay):not([busy-indicator-before-span]) {
|
|
28
|
+
--ui5_web_components_busy_indicator_display: none;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.busy-indicator-busy-area:focus {
|
|
32
|
+
outline: var(--_ui5_busy_indicator_focus_outline);
|
|
33
|
+
outline-offset: -.125rem;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.busy-indicator-circle {
|
|
37
|
+
width: 1rem;
|
|
38
|
+
height: 1rem;
|
|
39
|
+
display: inline-block;
|
|
40
|
+
background-color: currentColor;
|
|
41
|
+
border-radius: 50%;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.circle-animation-0 {
|
|
45
|
+
animation: grow 1.6s infinite cubic-bezier(0.32, 0.06, 0.85, 1.11);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.circle-animation-1 {
|
|
49
|
+
animation: grow 1.6s infinite cubic-bezier(0.32, 0.06, 0.85, 1.11);
|
|
50
|
+
animation-delay: 200ms;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.circle-animation-2 {
|
|
54
|
+
animation: grow 1.6s infinite cubic-bezier(0.32, 0.06, 0.85, 1.11);
|
|
55
|
+
animation-delay: 400ms;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.sapUiLocalBusy {
|
|
59
|
+
--ui5_web_components_busy_indicator_display: none;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
@keyframes grow {
|
|
63
|
+
0%, 50%, 100% {
|
|
64
|
+
-webkit-transform: scale(0.5);
|
|
65
|
+
-moz-transform: scale(0.5);
|
|
66
|
+
-ms-transform: scale(0.5);
|
|
67
|
+
transform: scale(0.5);
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
25% {
|
|
71
|
+
-webkit-transform: scale(1);
|
|
72
|
+
-moz-transform: scale(1);
|
|
73
|
+
-ms-transform: scale(1);
|
|
74
|
+
transform: scale(1);
|
|
75
|
+
}
|
|
76
|
+
}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
@font-face {
|
|
2
|
+
font-family: "72";
|
|
3
|
+
font-style: normal;
|
|
4
|
+
font-weight: 400;
|
|
5
|
+
src: local("72"),
|
|
6
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular.woff2?ui5-webcomponents) format("woff2"),
|
|
7
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular.woff?ui5-webcomponents) format("woff");
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
@font-face {
|
|
11
|
+
font-family: "72full";
|
|
12
|
+
font-style: normal;
|
|
13
|
+
font-weight: 400;
|
|
14
|
+
src: local('72-full'),
|
|
15
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular-full.woff2?ui5-webcomponents) format("woff2"),
|
|
16
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular-full.woff?ui5-webcomponents) format("woff");
|
|
17
|
+
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
@font-face {
|
|
21
|
+
font-family: "72";
|
|
22
|
+
font-style: normal;
|
|
23
|
+
font-weight: 700;
|
|
24
|
+
src: local('72-Bold'),
|
|
25
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff2?ui5-webcomponents) format("woff2"),
|
|
26
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff?ui5-webcomponents) format("woff");
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
@font-face {
|
|
30
|
+
font-family: "72full";
|
|
31
|
+
font-style: normal;
|
|
32
|
+
font-weight: 700;
|
|
33
|
+
src: local('72-Bold-full'),
|
|
34
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff2?ui5-webcomponents) format("woff2"),
|
|
35
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff?ui5-webcomponents) format("woff");
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
@font-face {
|
|
39
|
+
font-family: '72-Bold';
|
|
40
|
+
font-style: normal;
|
|
41
|
+
src: local('72-Bold'),
|
|
42
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff2?ui5-webcomponents) format("woff2"),
|
|
43
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff?ui5-webcomponents) format("woff");
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
@font-face {
|
|
47
|
+
font-family: '72-Boldfull';
|
|
48
|
+
font-style: normal;
|
|
49
|
+
src: url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff2?ui5-webcomponents) format("woff2"),
|
|
50
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff?ui5-webcomponents) format("woff");
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
@font-face {
|
|
54
|
+
font-family: '72-Light';
|
|
55
|
+
font-style: normal;
|
|
56
|
+
src: local('72-Light'),
|
|
57
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light.woff2?ui5-webcomponents) format("woff2"),
|
|
58
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light.woff?ui5-webcomponents) format("woff");
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
@font-face {
|
|
62
|
+
font-family: '72-Lightfull';
|
|
63
|
+
font-style: normal;
|
|
64
|
+
src: url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light-full.woff2?ui5-webcomponents) format("woff2"),
|
|
65
|
+
url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light-full.woff?ui5-webcomponents) format("woff");
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
@font-face {
|
|
69
|
+
font-family: "72Black";
|
|
70
|
+
font-style: bold;
|
|
71
|
+
font-weight: 900;
|
|
72
|
+
src: local('72Black'),
|
|
73
|
+
url(https://openui5nightly.hana.ondemand.com/resources/sap/ui/core/themes/sap_horizon/fonts/72-Black.woff2?ui5-webcomponents) format("woff2"),
|
|
74
|
+
url(https://openui5nightly.hana.ondemand.com/resources/sap/ui/core/themes/sap_horizon/fonts/72-Black.woff?ui5-webcomponents) format("woff");
|
|
75
|
+
}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Some diacritics are supported by the 72 font:
|
|
3
|
+
* * Grave
|
|
4
|
+
* * Acute
|
|
5
|
+
* * Circumflex
|
|
6
|
+
* * Tilde
|
|
7
|
+
*
|
|
8
|
+
* However, the following diacritics and the combination of multiple diacritics (including the supported ones) are not supported:
|
|
9
|
+
* * Breve
|
|
10
|
+
* * Horn
|
|
11
|
+
* * Dot below
|
|
12
|
+
* * Hook above
|
|
13
|
+
*
|
|
14
|
+
*
|
|
15
|
+
* Override for the characters that aren't covered by the '72' font to other system fonts
|
|
16
|
+
*
|
|
17
|
+
* U+0102-0103: A and a with Breve
|
|
18
|
+
* U+01A0-01A1: O and o with Horn
|
|
19
|
+
* U+01AF-01B0: U and u with Horn
|
|
20
|
+
* U+1EA0-1EB7: A and a with diacritics that are not supported by the font and combination of multiple diacritics
|
|
21
|
+
* U+1EB8-1EC7: E and e with diacritics that are not supported by the font and combination of multiple diacritics
|
|
22
|
+
* U+1EC8-1ECB: I and i with diacritics that are not supported by the font and combination of multiple diacritics
|
|
23
|
+
* U+1ECC-1EE3: O and o with diacritics that are not supported by the font and combination of multiple diacritics
|
|
24
|
+
* U+1EE4-1EF1: U and u with diacritics that are not supported by the font and combination of multiple diacritics
|
|
25
|
+
* U+1EF4-1EF7: Y and y with diacritics that are not supported by the font and combination of multiple diacritics
|
|
26
|
+
*
|
|
27
|
+
*/
|
|
28
|
+
@font-face {
|
|
29
|
+
font-family: '72override';
|
|
30
|
+
unicode-range: U+0102-0103, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EB7, U+1EB8-1EC7, U+1EC8-1ECB, U+1ECC-1EE3, U+1EE4-1EF1, U+1EF4-1EF7;
|
|
31
|
+
src: local('Arial'), local('Helvetica'), local('sans-serif');
|
|
32
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--_ui5_content_density:cozy;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
[data-ui5-compact-size],
|
|
6
|
+
.ui5-content-density-compact,
|
|
7
|
+
.sapUiSizeCompact {
|
|
8
|
+
--_ui5_content_density:compact;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
[dir="rtl"] {
|
|
12
|
+
--_ui5_dir:rtl;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
[dir="ltr"] {
|
|
16
|
+
--_ui5_dir:ltr;
|
|
17
|
+
}
|
|
@@ -5,6 +5,8 @@ import {
|
|
|
5
5
|
isRight,
|
|
6
6
|
isHome,
|
|
7
7
|
isEnd,
|
|
8
|
+
isPageDown,
|
|
9
|
+
isPageUp,
|
|
8
10
|
} from "../Keys.js";
|
|
9
11
|
import getActiveElement from "../util/getActiveElement.js";
|
|
10
12
|
|
|
@@ -52,6 +54,7 @@ class ItemNavigation {
|
|
|
52
54
|
* - currentIndex: the index of the item that will be initially selected (from which navigation will begin)
|
|
53
55
|
* - navigationMode (Auto|Horizontal|Vertical): whether the items are displayed horizontally (Horizontal), vertically (Vertical) or as a matrix (Auto) meaning the user can navigate in both directions (up/down and left/right)
|
|
54
56
|
* - rowSize: tells how many items per row there are when the items are not rendered as a flat list but rather as a matrix. Relevant for navigationMode=Auto
|
|
57
|
+
* - skipItemsSize: tells how many items upon PAGE_UP and PAGE_DOWN should be skipped to applying the focus on the next item
|
|
55
58
|
* - behavior (Static|Cycling): tells what to do when trying to navigate beyond the first and last items
|
|
56
59
|
* Static means that nothing happens if the user tries to navigate beyond the first/last item.
|
|
57
60
|
* Cycling means that when the user navigates beyond the last item they go to the first and vice versa.
|
|
@@ -85,6 +88,7 @@ class ItemNavigation {
|
|
|
85
88
|
this._behavior = options.behavior || ItemNavigationBehavior.Static;
|
|
86
89
|
this._navigationMode = options.navigationMode || NavigationMode.Auto;
|
|
87
90
|
this._affectedPropertiesNames = options.affectedPropertiesNames || [];
|
|
91
|
+
this._skipItemsSize = options.skipItemsSize || null;
|
|
88
92
|
}
|
|
89
93
|
|
|
90
94
|
/**
|
|
@@ -142,6 +146,10 @@ class ItemNavigation {
|
|
|
142
146
|
this._handleHome();
|
|
143
147
|
} else if (isEnd(event)) {
|
|
144
148
|
this._handleEnd();
|
|
149
|
+
} else if (isPageUp(event)) {
|
|
150
|
+
this._handlePageUp();
|
|
151
|
+
} else if (isPageDown(event)) {
|
|
152
|
+
this._handlePageDown();
|
|
145
153
|
} else {
|
|
146
154
|
return; // if none of the supported keys is pressed, we don't want to prevent the event or update the item navigation
|
|
147
155
|
}
|
|
@@ -222,6 +230,64 @@ class ItemNavigation {
|
|
|
222
230
|
this._currentIndex += (homeEndRange - 1 - this._currentIndex % homeEndRange); // eslint-disable-line
|
|
223
231
|
}
|
|
224
232
|
|
|
233
|
+
_handlePageUp() {
|
|
234
|
+
if (this._rowSize > 1) {
|
|
235
|
+
// eslint-disable-next-line
|
|
236
|
+
// TODO: handle page up on matrix (grid) layout - ColorPalette, ProductSwitch.
|
|
237
|
+
return;
|
|
238
|
+
}
|
|
239
|
+
this._handlePageUpFlat();
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
_handlePageDown() {
|
|
243
|
+
if (this._rowSize > 1) {
|
|
244
|
+
// eslint-disable-next-line
|
|
245
|
+
// TODO: handle page up on matrix (grid) layout - ColorPalette, ProductSwitch.
|
|
246
|
+
return;
|
|
247
|
+
}
|
|
248
|
+
this._handlePageDownFlat();
|
|
249
|
+
}
|
|
250
|
+
|
|
251
|
+
/**
|
|
252
|
+
* Handles PAGE_UP in a flat list-like structure, both vertically and horizontally.
|
|
253
|
+
*/
|
|
254
|
+
_handlePageUpFlat() {
|
|
255
|
+
if (this._skipItemsSize === null) {
|
|
256
|
+
// Move the focus to the very top (as Home).
|
|
257
|
+
this._currentIndex -= this._currentIndex;
|
|
258
|
+
}
|
|
259
|
+
|
|
260
|
+
if (this._currentIndex + 1 > this._skipItemsSize) {
|
|
261
|
+
// When there are more than "skipItemsSize" number of items to the top,
|
|
262
|
+
// move the focus up/left with the predefined number.
|
|
263
|
+
this._currentIndex -= this._skipItemsSize;
|
|
264
|
+
} else {
|
|
265
|
+
// Otherwise, move the focus to the very top (as Home).
|
|
266
|
+
this._currentIndex -= this._currentIndex;
|
|
267
|
+
}
|
|
268
|
+
}
|
|
269
|
+
|
|
270
|
+
/**
|
|
271
|
+
* Handles PAGE_DOWN in a flat list-like structure, both vertically and horizontally.
|
|
272
|
+
*/
|
|
273
|
+
_handlePageDownFlat() {
|
|
274
|
+
if (this._skipItemsSize === null) {
|
|
275
|
+
// Move the focus to the very bottom (as End).
|
|
276
|
+
this._currentIndex = this._getItems().length - 1;
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
const currentToEndRange = this._getItems().length - this._currentIndex - 1;
|
|
280
|
+
|
|
281
|
+
if (currentToEndRange > this._skipItemsSize) {
|
|
282
|
+
// When there are more than "skipItemsSize" number of items until the bottom,
|
|
283
|
+
// move the focus down/right with the predefined number.
|
|
284
|
+
this._currentIndex += this._skipItemsSize;
|
|
285
|
+
} else {
|
|
286
|
+
// Otherwise, move the focus to the very bottom (as End).
|
|
287
|
+
this._currentIndex = this._getItems().length - 1;
|
|
288
|
+
}
|
|
289
|
+
}
|
|
290
|
+
|
|
225
291
|
_applyTabIndex() {
|
|
226
292
|
const items = this._getItems();
|
|
227
293
|
for (let i = 0; i < items.length; i++) {
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
import { registerFeature } from "../FeaturesRegistry.js";
|
|
2
|
+
import { isF6Next, isF6Previous } from "../Keys.js";
|
|
3
|
+
import { getFirstFocusableElement } from "../util/FocusableElements.js";
|
|
4
|
+
|
|
5
|
+
class F6Navigation {
|
|
6
|
+
init() {
|
|
7
|
+
this.keydownHandler = this._keydownHandler.bind(this);
|
|
8
|
+
this.attachEventListeners();
|
|
9
|
+
this.selectedGroup = null;
|
|
10
|
+
this.groups = [];
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
attachEventListeners() {
|
|
14
|
+
document.addEventListener("keydown", this.keydownHandler);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
async _keydownHandler(event) {
|
|
18
|
+
if (isF6Next(event)) {
|
|
19
|
+
this.updateGroups();
|
|
20
|
+
if (this.groups.length < 1) {
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
const nextIndex = this.groups.indexOf(this.selectedGroup);
|
|
25
|
+
let nextElement = null;
|
|
26
|
+
|
|
27
|
+
if (nextIndex > -1) {
|
|
28
|
+
if (nextIndex + 1 >= this.groups.length) {
|
|
29
|
+
nextElement = this.groups[0];
|
|
30
|
+
} else {
|
|
31
|
+
nextElement = this.groups[nextIndex + 1];
|
|
32
|
+
}
|
|
33
|
+
} else {
|
|
34
|
+
nextElement = this.groups[0];
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
const elementToFocus = await getFirstFocusableElement(nextElement.isUI5Element ? nextElement.getDomRef() : nextElement, true);
|
|
38
|
+
elementToFocus.focus();
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
if (isF6Previous(event)) {
|
|
42
|
+
this.updateGroups();
|
|
43
|
+
if (this.groups.length < 1) {
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
const nextIndex = this.groups.indexOf(this.selectedGroup);
|
|
48
|
+
let nextElement = null;
|
|
49
|
+
|
|
50
|
+
if (nextIndex > -1) {
|
|
51
|
+
if (nextIndex - 1 < 0) {
|
|
52
|
+
nextElement = this.groups[this.groups.length - 1];
|
|
53
|
+
} else {
|
|
54
|
+
// Handle the situation where the first focusable element of two neighbor groups is the same
|
|
55
|
+
// For example:
|
|
56
|
+
// <ui5-flexible-column-layout>
|
|
57
|
+
// <ui5-list>
|
|
58
|
+
// <ui5-li>List Item</ui5-li>
|
|
59
|
+
// </ui5-list>
|
|
60
|
+
// </ui5-flexible-column-layout>
|
|
61
|
+
// Here for both FCL & List the firstFoccusableElement is the same (the ui5-li)
|
|
62
|
+
|
|
63
|
+
const firstFocusable = await getFirstFocusableElement(this.groups[nextIndex - 1], true);
|
|
64
|
+
const shouldSkipParent = firstFocusable === await getFirstFocusableElement(this.groups[nextIndex], true);
|
|
65
|
+
|
|
66
|
+
nextElement = this.groups[shouldSkipParent ? nextIndex - 2 : nextIndex - 1];
|
|
67
|
+
}
|
|
68
|
+
} else {
|
|
69
|
+
nextElement = this.groups[this.groups.length - 1];
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
const elementToFocus = await getFirstFocusableElement(nextElement.isUI5Element ? nextElement.getDomRef() : nextElement, true);
|
|
73
|
+
elementToFocus.focus();
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
removeEventListeners() {
|
|
78
|
+
document.removeEventListener("keydown", this.keydownHandler);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
updateGroups() {
|
|
82
|
+
this.setSelectedGroup(document.activeElement);
|
|
83
|
+
this.setGroups();
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
setGroups() {
|
|
87
|
+
this.groups = Array.from(document.querySelectorAll("[data-sap-ui-fastnavgroup='true']")).filter(group => group.clientWidth && window.getComputedStyle(group).visibility !== "hidden");
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
setSelectedGroup(element) {
|
|
91
|
+
while (element && element.getAttribute("data-sap-ui-fastnavgroup") !== "true" && element !== document.querySelector("html")) {
|
|
92
|
+
element = element.parentElement ? element.parentNode : element.parentNode.host;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
this.selectedGroup = element;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
destroy() {
|
|
99
|
+
this.removeEventListeners();
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
const F6HelperInstance = new F6Navigation();
|
|
104
|
+
registerFeature("F6Navigation", F6HelperInstance);
|
|
105
|
+
|
|
106
|
+
export default F6Navigation;
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
import { registerFeature } from "../FeaturesRegistry.js";
|
|
2
|
+
import BusyIndicatorStyles from "../generated/css/BusyIndicator.css.js";
|
|
3
|
+
import merge from "../thirdparty/merge.js";
|
|
4
|
+
import {
|
|
5
|
+
isTabPrevious,
|
|
6
|
+
} from "../Keys.js";
|
|
7
|
+
|
|
8
|
+
const busyIndicatorMetadata = {
|
|
9
|
+
properties: {
|
|
10
|
+
__isBusy: {
|
|
11
|
+
type: Boolean,
|
|
12
|
+
},
|
|
13
|
+
},
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
const getBusyIndicatorStyles = () => {
|
|
17
|
+
return BusyIndicatorStyles;
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
const wrapTemplateResultInBusyMarkup = (html, host, templateResult) => {
|
|
21
|
+
if (host.isOpenUI5Component && host.__isBusy) {
|
|
22
|
+
templateResult = html`
|
|
23
|
+
<div class="busy-indicator-wrapper">
|
|
24
|
+
<span tabindex="0" busy-indicator-before-span @focusin=${host.__suppressFocusIn}></span>
|
|
25
|
+
${templateResult}
|
|
26
|
+
<div class="busy-indicator-overlay"></div>
|
|
27
|
+
<div busy-indicator
|
|
28
|
+
class="busy-indicator-busy-area"
|
|
29
|
+
tabindex="0"
|
|
30
|
+
role="progressbar"
|
|
31
|
+
@keydown=${host.__suppressFocusBack}
|
|
32
|
+
aria-valuemin="0"
|
|
33
|
+
aria-valuemax="100"
|
|
34
|
+
aria-valuetext="Busy">
|
|
35
|
+
<div>
|
|
36
|
+
<div class="busy-indicator-circle circle-animation-0"></div>
|
|
37
|
+
<div class="busy-indicator-circle circle-animation-1"></div>
|
|
38
|
+
<div class="busy-indicator-circle circle-animation-2"></div>
|
|
39
|
+
</div>
|
|
40
|
+
</div>
|
|
41
|
+
</div>`;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
return templateResult;
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
const enrichBusyIndicatorMetadata = UI5Element => {
|
|
48
|
+
UI5Element.metadata = merge(UI5Element.metadata, busyIndicatorMetadata);
|
|
49
|
+
};
|
|
50
|
+
|
|
51
|
+
const enrichBusyIndicatorMethods = UI5ElementPrototype => {
|
|
52
|
+
Object.defineProperties(UI5ElementPrototype, {
|
|
53
|
+
"__redirectFocus": { value: true, writable: true },
|
|
54
|
+
"__suppressFocusBack": {
|
|
55
|
+
get() {
|
|
56
|
+
const that = this;
|
|
57
|
+
|
|
58
|
+
return {
|
|
59
|
+
handleEvent: e => {
|
|
60
|
+
if (isTabPrevious(e)) {
|
|
61
|
+
const beforeElem = that.shadowRoot.querySelector("[busy-indicator-before-span]");
|
|
62
|
+
that.__redirectFocus = false;
|
|
63
|
+
beforeElem.focus();
|
|
64
|
+
that.__redirectFocus = true;
|
|
65
|
+
}
|
|
66
|
+
},
|
|
67
|
+
capture: true,
|
|
68
|
+
passive: false,
|
|
69
|
+
};
|
|
70
|
+
},
|
|
71
|
+
},
|
|
72
|
+
"isOpenUI5Component": { get: () => { return true; } },
|
|
73
|
+
});
|
|
74
|
+
|
|
75
|
+
UI5ElementPrototype.__suppressFocusIn = function handleFocusIn() {
|
|
76
|
+
const busyIndicator = this.shadowRoot.querySelector("[busy-indicator]");
|
|
77
|
+
if (busyIndicator && this.__redirectFocus) {
|
|
78
|
+
busyIndicator.focus();
|
|
79
|
+
}
|
|
80
|
+
};
|
|
81
|
+
|
|
82
|
+
UI5ElementPrototype.getDomRef = function getDomRef() {
|
|
83
|
+
// If a component set _getRealDomRef to its children, use the return value of this function
|
|
84
|
+
if (typeof this._getRealDomRef === "function") {
|
|
85
|
+
return this._getRealDomRef();
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
if (!this.shadowRoot || this.shadowRoot.children.length === 0) {
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
const children = [...this.shadowRoot.children].filter(child => !["link", "style"].includes(child.localName));
|
|
93
|
+
|
|
94
|
+
if (children.length !== 1) {
|
|
95
|
+
console.warn(`The shadow DOM for ${this.constructor.getMetadata().getTag()} does not have a top level element, the getDomRef() method might not work as expected`); // eslint-disable-line
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
if (this.__isBusy) {
|
|
99
|
+
return children[0].querySelector(".busy-indicator-wrapper > :not([busy-indicator-before-span]):not(.busy-indicator-overlay):not(.busy-indicator-busy-area)");
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
return children[0];
|
|
103
|
+
};
|
|
104
|
+
};
|
|
105
|
+
|
|
106
|
+
const enrichBusyIndicatorSettings = UI5Element => {
|
|
107
|
+
enrichBusyIndicatorMetadata(UI5Element);
|
|
108
|
+
enrichBusyIndicatorMethods(UI5Element.prototype);
|
|
109
|
+
};
|
|
110
|
+
|
|
111
|
+
const OpenUI5Enablement = {
|
|
112
|
+
enrichBusyIndicatorSettings,
|
|
113
|
+
wrapTemplateResultInBusyMarkup,
|
|
114
|
+
getBusyIndicatorStyles,
|
|
115
|
+
};
|
|
116
|
+
|
|
117
|
+
export default OpenUI5Enablement;
|
|
118
|
+
|
|
119
|
+
registerFeature("OpenUI5Enablement", OpenUI5Enablement);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const assetParameters = {"themes":{"default":"sap_fiori_3","all":["sap_fiori_3","sap_fiori_3_dark","sap_belize","sap_belize_hcb","sap_belize_hcw","sap_fiori_3_hcb","sap_fiori_3_hcw"]},"languages":{"default":"en","all":["ar","bg","ca","cs","cy","da","de","el","en","en_GB","en_US_sappsd","en_US_saprigi","en_US_saptrc","es","es_MX","et","fi","fr","fr_CA","hi","hr","hu","in","it","iw","ja","kk","ko","lt","lv","ms","nl","no","pl","pt_PT","pt","ro","ru","sh","sk","sl","sv","th","tr","uk","vi","zh_CN","zh_TW"]},"locales":{"default":"en","all":["ar","ar_EG","ar_SA","bg","ca","cs","da","de","de_AT","de_CH","el","el_CY","en","en_AU","en_GB","en_HK","en_IE","en_IN","en_NZ","en_PG","en_SG","en_ZA","es","es_AR","es_BO","es_CL","es_CO","es_MX","es_PE","es_UY","es_VE","et","fa","fi","fr","fr_BE","fr_CA","fr_CH","fr_LU","he","hi","hr","hu","id","it","it_CH","ja","kk","ko","lt","lv","ms","nb","nl","nl_BE","pl","pt","pt_PT","ro","ru","ru_UA","sk","sl","sr","sv","th","tr","uk","vi","zh_CN","zh_HK","zh_SG","zh_TW"]}};
|
|
1
|
+
const assetParameters = {"themes":{"default":"sap_fiori_3","all":["sap_fiori_3","sap_fiori_3_dark","sap_belize","sap_belize_hcb","sap_belize_hcw","sap_fiori_3_hcb","sap_fiori_3_hcw","sap_horizon","sap_horizon_dark","sap_horizon_hcb","sap_horizon_hcw","sap_horizon_exp"]},"languages":{"default":"en","all":["ar","bg","ca","cs","cy","da","de","el","en","en_GB","en_US_sappsd","en_US_saprigi","en_US_saptrc","es","es_MX","et","fi","fr","fr_CA","hi","hr","hu","in","it","iw","ja","kk","ko","lt","lv","ms","nl","no","pl","pt_PT","pt","ro","ru","sh","sk","sl","sv","th","tr","uk","vi","zh_CN","zh_TW"]},"locales":{"default":"en","all":["ar","ar_EG","ar_SA","bg","ca","cs","da","de","de_AT","de_CH","el","el_CY","en","en_AU","en_GB","en_HK","en_IE","en_IN","en_NZ","en_PG","en_SG","en_ZA","es","es_AR","es_BO","es_CL","es_CO","es_MX","es_PE","es_UY","es_VE","et","fa","fi","fr","fr_BE","fr_CA","fr_CH","fr_LU","he","hi","hr","hu","id","it","it_CH","ja","kk","ko","lt","lv","ms","nb","nl","nl_BE","pl","pt","pt_PT","ro","ru","ru_UA","sk","sl","sr","sr_Latn","sv","th","tr","uk","vi","zh_CN","zh_HK","zh_SG","zh_TW"]}};
|
|
2
2
|
|
|
3
3
|
const DEFAULT_THEME = assetParameters.themes.default;
|
|
4
4
|
const DEFAULT_LANGUAGE = assetParameters.languages.default;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
packageName: "@ui5/webcomponents-base",
|
|
3
|
+
fileName: "BusyIndicator.css",
|
|
4
|
+
content: `.busy-indicator-wrapper{position:relative;height:100%;width:100%}.busy-indicator-overlay{display:var(--ui5_web_components_busy_indicator_display);position:absolute;inset:0;background:var(--ui5_web_components_busy_indicator_background-color);z-index:99}.busy-indicator-busy-area{display:var(--ui5_web_components_busy_indicator_display);position:absolute;z-index:99;inset:0;justify-content:center;align-items:center;background-color:inherit;flex-direction:column;color:var(--_ui5_busy_indicator_color)}:host([__is-busy]) .busy-indicator-wrapper>:not(.busy-indicator-busy-area):not(.busy-indicator-overlay):not([busy-indicator-before-span]){--ui5_web_components_busy_indicator_display:none}.busy-indicator-busy-area:focus{outline:var(--_ui5_busy_indicator_focus_outline);outline-offset:-.125rem}.busy-indicator-circle{width:1rem;height:1rem;display:inline-block;background-color:currentColor;border-radius:50%}.circle-animation-0{animation:grow 1.6s infinite cubic-bezier(.32,.06,.85,1.11)}.circle-animation-1{animation:grow 1.6s infinite cubic-bezier(.32,.06,.85,1.11);animation-delay:.2s}.circle-animation-2{animation:grow 1.6s infinite cubic-bezier(.32,.06,.85,1.11);animation-delay:.4s}.sapUiLocalBusy{--ui5_web_components_busy_indicator_display:none}@keyframes grow{0%,100%,50%{-webkit-transform:scale(.5);-moz-transform:scale(.5);-ms-transform:scale(.5);transform:scale(.5)}25%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}`
|
|
5
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
packageName: "@ui5/webcomponents-base",
|
|
3
|
+
fileName: "FontFace.css",
|
|
4
|
+
content: `@font-face{font-family:"72";font-style:normal;font-weight:400;src:local("72"),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular.woff2?ui5-webcomponents) format("woff2"),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular.woff?ui5-webcomponents) format("woff")}@font-face{font-family:"72full";font-style:normal;font-weight:400;src:local('72-full'),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular-full.woff2?ui5-webcomponents) format("woff2"),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular-full.woff?ui5-webcomponents) format("woff")}@font-face{font-family:"72";font-style:normal;font-weight:700;src:local('72-Bold'),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff2?ui5-webcomponents) format("woff2"),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff?ui5-webcomponents) format("woff")}@font-face{font-family:"72full";font-style:normal;font-weight:700;src:local('72-Bold-full'),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff2?ui5-webcomponents) format("woff2"),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff?ui5-webcomponents) format("woff")}@font-face{font-family:'72-Bold';font-style:normal;src:local('72-Bold'),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff2?ui5-webcomponents) format("woff2"),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff?ui5-webcomponents) format("woff")}@font-face{font-family:'72-Boldfull';font-style:normal;src:url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff2?ui5-webcomponents) format("woff2"),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff?ui5-webcomponents) format("woff")}@font-face{font-family:'72-Light';font-style:normal;src:local('72-Light'),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light.woff2?ui5-webcomponents) format("woff2"),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light.woff?ui5-webcomponents) format("woff")}@font-face{font-family:'72-Lightfull';font-style:normal;src:url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light-full.woff2?ui5-webcomponents) format("woff2"),url(https://ui5.sap.com/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light-full.woff?ui5-webcomponents) format("woff")}@font-face{font-family:"72Black";font-style:bold;font-weight:900;src:local('72Black'),url(https://openui5nightly.hana.ondemand.com/resources/sap/ui/core/themes/sap_horizon/fonts/72-Black.woff2?ui5-webcomponents) format("woff2"),url(https://openui5nightly.hana.ondemand.com/resources/sap/ui/core/themes/sap_horizon/fonts/72-Black.woff?ui5-webcomponents) format("woff")}`
|
|
5
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
packageName: "@ui5/webcomponents-base",
|
|
3
|
+
fileName: "OverrideFontFace.css",
|
|
4
|
+
content: `@font-face{font-family:'72override';unicode-range:U+0102-0103,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EB7,U+1EB8-1EC7,U+1EC8-1ECB,U+1ECC-1EE3,U+1EE4-1EF1,U+1EF4-1EF7;src:local('Arial'),local('Helvetica'),local('sans-serif')}`
|
|
5
|
+
};
|