@ui5/webcomponents-base 1.5.0 → 1.6.0
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/CHANGELOG.md +16 -0
- package/README.md +1 -0
- package/dist/assets/{bundle.esm.a812dc7f.js → bundle.esm.28d45785.js} +1 -1
- package/dist/generated/VersionInfo.js +3 -3
- package/dist/util/ColorConversion.js +30 -2
- package/dist/util/InvisibleMessage.js +9 -0
- package/package.json +2 -2
- package/src/util/ColorConversion.js +30 -2
- package/src/util/InvisibleMessage.js +9 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,22 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [1.6.0](https://github.com/SAP/ui5-webcomponents/compare/v1.5.0...v1.6.0) (2022-07-25)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **InvisibleMessage:** clear announcement after a while ([#5446](https://github.com/SAP/ui5-webcomponents/issues/5446)) ([af213f1](https://github.com/SAP/ui5-webcomponents/commit/af213f1))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
### Features
|
|
15
|
+
|
|
16
|
+
* **InvisibleMessage:** make it available for application usage ([#5468](https://github.com/SAP/ui5-webcomponents/issues/5468)) ([c6bcc02](https://github.com/SAP/ui5-webcomponents/commit/c6bcc02))
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
6
22
|
# [1.5.0](https://github.com/SAP/ui5-webcomponents/compare/v1.4.0...v1.5.0) (2022-07-03)
|
|
7
23
|
|
|
8
24
|
|
package/README.md
CHANGED
|
@@ -18,6 +18,7 @@ Contains the base files for all Web Components, most notably `@ui5/webcomponents
|
|
|
18
18
|
Components | `@ui5/webcomponents-base/dist/features/F6Navigation.js` | Adds support for F6 fast group navigation |
|
|
19
19
|
Components | `import applyDirection from "@ui5/webcomponents-base/dist/locale/applyDirection.js"`| Applies direction ("ltr"/"rtl") - re-renders all RTL-aware components |
|
|
20
20
|
Components | `import { setCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScope.js"`| Adds suffix to the tag names of all components |
|
|
21
|
+
Components | `@ui5/webcomponents-base/dist/util/InvisibleMessage.js` | Provides a way to expose dynamic content changes that can be announced by screen readers |
|
|
21
22
|
CSP compliance| `import { setPackageCSSRoot } from "@ui5/webcomponents-base/dist/CSP.js"`| Sets directory path where the CSS resources for given package will be served from |
|
|
22
23
|
CSP compliance| `import { setUseLinks } from "@ui5/webcomponents-base/dist/CSP.js"` | Enables or disables the usage of `<link>` tags instead of `<style>` tags |
|
|
23
24
|
CSP compliance| `import { setPreloadLinks } from "@ui5/webcomponents-base/dist/CSP.js"` | Enables or disables the preloading of `<link>` tags |
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const Cs=function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const r of document.querySelectorAll('link[rel="modulepreload"]'))n(r);new MutationObserver(r=>{for(const o of r)if(o.type==="childList")for(const i of o.addedNodes)i.tagName==="LINK"&&i.rel==="modulepreload"&&n(i)}).observe(document,{childList:!0,subtree:!0});function s(r){const o={};return r.integrity&&(o.integrity=r.integrity),r.referrerpolicy&&(o.referrerPolicy=r.referrerpolicy),r.crossorigin==="use-credentials"?o.credentials="include":r.crossorigin==="anonymous"?o.credentials="omit":o.credentials="same-origin",o}function n(r){if(r.ep)return;r.ep=!0;const o=s(r);fetch(r.href,o)}};Cs();const ut={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"]}},xt=ut.themes.default,Nt=ut.languages.default,E=ut.locales.default,ee=ut.locales.all;var ke=()=>{const e=navigator.languages,t=()=>navigator.language;return e&&e[0]||t()||navigator.userLanguage||navigator.browserLanguage||Nt},Be={},He=Be.hasOwnProperty,Es=Be.toString,Fe=He.toString,Ts=Fe.call(Object),se=function(e){var t,s;return!e||Es.call(e)!=="[object Object]"?!1:(t=Object.getPrototypeOf(e),t?(s=He.call(t,"constructor")&&t.constructor,typeof s=="function"&&Fe.call(s)===Ts):!0)},Ms=Object.create(null),je=function(){var e,t,s,n,r,o,i=arguments[2]||{},a=3,c=arguments.length,l=arguments[0]||!1,h=arguments[1]?void 0:Ms;for(typeof i!="object"&&typeof i!="function"&&(i={});a<c;a++)if((r=arguments[a])!=null)for(n in r)e=i[n],s=r[n],!(n==="__proto__"||i===s)&&(l&&s&&(se(s)||(t=Array.isArray(s)))?(t?(t=!1,o=e&&Array.isArray(e)?e:[]):o=e&&se(e)?e:{},i[n]=je(l,arguments[1],o,s)):s!==h&&(i[n]=s));return i},Zt=function(){var e=[!0,!1];return e.push.apply(e,arguments),je.apply(null,e)};const Ve=new Map,Ls=(e,t)=>{Ve.set(e,t)},_=e=>Ve.get(e);let ne=!1,m={animationMode:"full",theme:xt,rtl:null,language:null,calendarType:null,noConflict:!1,formatSettings:{},fetchDefaultLanguage:!1};const Os=()=>(A(),m.animationMode),Ps=()=>(A(),m.theme),Is=()=>(A(),m.rtl),Ds=()=>(A(),m.language),Rs=()=>(A(),m.fetchDefaultLanguage),xs=()=>(A(),m.noConflict),Ns=()=>(A(),m.calendarType),Us=()=>(A(),m.formatSettings),ot=new Map;ot.set("true",!0);ot.set("false",!1);const ks=()=>{const e=document.querySelector("[data-ui5-config]")||document.querySelector("[data-id='sap-ui-config']");let t;if(e){try{t=JSON.parse(e.innerHTML)}catch{console.warn("Incorrect data-sap-ui-config format. Please use JSON")}t&&(m=Zt(m,t))}},Bs=()=>{const e=new URLSearchParams(window.location.search);e.forEach((t,s)=>{const n=s.split("sap-").length;n===0||n===s.split("sap-ui-").length||re(s,t,"sap")}),e.forEach((t,s)=>{!s.startsWith("sap-ui")||re(s,t,"sap-ui")})},Hs=(e,t)=>e==="theme"&&t.includes("@")?t.split("@")[0]:t,re=(e,t,s)=>{const n=t.toLowerCase(),r=e.split(`${s}-`)[1];ot.has(t)&&(t=ot.get(n)),t=Hs(r,t),m[r]=t},Fs=()=>{const e=_("OpenUI5Support");if(!e||!e.isLoaded())return;const t=e.getConfigurationSettingsObject();m=Zt(m,t)},A=()=>{ne||(ks(),Bs(),Fs(),ne=!0)};class T{constructor(){this._eventRegistry=new Map}attachEvent(t,s){const n=this._eventRegistry,r=n.get(t);if(!Array.isArray(r)){n.set(t,[s]);return}r.includes(s)||r.push(s)}detachEvent(t,s){const n=this._eventRegistry,r=n.get(t);if(!r)return;const o=r.indexOf(s);o!==-1&&r.splice(o,1),r.length===0&&n.delete(t)}fireEvent(t,s){const r=this._eventRegistry.get(t);return r?r.map(o=>o.call(this,s)):[]}fireEventAsync(t,s){return Promise.all(this.fireEvent(t,s))}isHandlerAttached(t,s){const r=this._eventRegistry.get(t);return r?r.includes(s):!1}hasListeners(t){return!!this._eventRegistry.get(t)}}const js=new T,Vs="languageChange",ze=e=>{js.attachEvent(Vs,e)},oe=10;class zs{constructor(){this.list=[],this.lookup=new Set}add(t){this.lookup.has(t)||(this.list.push(t),this.lookup.add(t))}remove(t){!this.lookup.has(t)||(this.list=this.list.filter(s=>s!==t),this.lookup.delete(t))}shift(){const t=this.list.shift();if(t)return this.lookup.delete(t),t}isEmpty(){return this.list.length===0}isAdded(t){return this.lookup.has(t)}process(t){let s;const n=new Map;for(s=this.shift();s;){const r=n.get(s)||0;if(r>oe)throw new Error(`Web component processed too many times this task, max allowed is: ${oe}`);t(s),n.set(s,r+1),s=this.shift()}}}const We=e=>{const t=[];return e.forEach(s=>{t.push(s)}),t},Ze=(e,t=document.body)=>{let s=document.querySelector(e);return s||(s=document.createElement(e),t.insertBefore(s,t.firstChild))},Ws=()=>Ze("ui5-shared-resources",document.head),M=(e,t)=>{const s=e.split(".");let n=Ws();for(let r=0;r<s.length;r++){const o=s[r],i=r===s.length-1;Object.prototype.hasOwnProperty.call(n,o)||(n[o]=i?t:{}),n=n[o]}return n},ie={version:"1.
|
|
1
|
+
const Cs=function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const r of document.querySelectorAll('link[rel="modulepreload"]'))n(r);new MutationObserver(r=>{for(const o of r)if(o.type==="childList")for(const i of o.addedNodes)i.tagName==="LINK"&&i.rel==="modulepreload"&&n(i)}).observe(document,{childList:!0,subtree:!0});function s(r){const o={};return r.integrity&&(o.integrity=r.integrity),r.referrerpolicy&&(o.referrerPolicy=r.referrerpolicy),r.crossorigin==="use-credentials"?o.credentials="include":r.crossorigin==="anonymous"?o.credentials="omit":o.credentials="same-origin",o}function n(r){if(r.ep)return;r.ep=!0;const o=s(r);fetch(r.href,o)}};Cs();const ut={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"]}},xt=ut.themes.default,Nt=ut.languages.default,E=ut.locales.default,ee=ut.locales.all;var ke=()=>{const e=navigator.languages,t=()=>navigator.language;return e&&e[0]||t()||navigator.userLanguage||navigator.browserLanguage||Nt},Be={},He=Be.hasOwnProperty,Es=Be.toString,Fe=He.toString,Ts=Fe.call(Object),se=function(e){var t,s;return!e||Es.call(e)!=="[object Object]"?!1:(t=Object.getPrototypeOf(e),t?(s=He.call(t,"constructor")&&t.constructor,typeof s=="function"&&Fe.call(s)===Ts):!0)},Ms=Object.create(null),je=function(){var e,t,s,n,r,o,i=arguments[2]||{},a=3,c=arguments.length,l=arguments[0]||!1,h=arguments[1]?void 0:Ms;for(typeof i!="object"&&typeof i!="function"&&(i={});a<c;a++)if((r=arguments[a])!=null)for(n in r)e=i[n],s=r[n],!(n==="__proto__"||i===s)&&(l&&s&&(se(s)||(t=Array.isArray(s)))?(t?(t=!1,o=e&&Array.isArray(e)?e:[]):o=e&&se(e)?e:{},i[n]=je(l,arguments[1],o,s)):s!==h&&(i[n]=s));return i},Zt=function(){var e=[!0,!1];return e.push.apply(e,arguments),je.apply(null,e)};const Ve=new Map,Ls=(e,t)=>{Ve.set(e,t)},_=e=>Ve.get(e);let ne=!1,m={animationMode:"full",theme:xt,rtl:null,language:null,calendarType:null,noConflict:!1,formatSettings:{},fetchDefaultLanguage:!1};const Os=()=>(A(),m.animationMode),Ps=()=>(A(),m.theme),Is=()=>(A(),m.rtl),Ds=()=>(A(),m.language),Rs=()=>(A(),m.fetchDefaultLanguage),xs=()=>(A(),m.noConflict),Ns=()=>(A(),m.calendarType),Us=()=>(A(),m.formatSettings),ot=new Map;ot.set("true",!0);ot.set("false",!1);const ks=()=>{const e=document.querySelector("[data-ui5-config]")||document.querySelector("[data-id='sap-ui-config']");let t;if(e){try{t=JSON.parse(e.innerHTML)}catch{console.warn("Incorrect data-sap-ui-config format. Please use JSON")}t&&(m=Zt(m,t))}},Bs=()=>{const e=new URLSearchParams(window.location.search);e.forEach((t,s)=>{const n=s.split("sap-").length;n===0||n===s.split("sap-ui-").length||re(s,t,"sap")}),e.forEach((t,s)=>{!s.startsWith("sap-ui")||re(s,t,"sap-ui")})},Hs=(e,t)=>e==="theme"&&t.includes("@")?t.split("@")[0]:t,re=(e,t,s)=>{const n=t.toLowerCase(),r=e.split(`${s}-`)[1];ot.has(t)&&(t=ot.get(n)),t=Hs(r,t),m[r]=t},Fs=()=>{const e=_("OpenUI5Support");if(!e||!e.isLoaded())return;const t=e.getConfigurationSettingsObject();m=Zt(m,t)},A=()=>{ne||(ks(),Bs(),Fs(),ne=!0)};class T{constructor(){this._eventRegistry=new Map}attachEvent(t,s){const n=this._eventRegistry,r=n.get(t);if(!Array.isArray(r)){n.set(t,[s]);return}r.includes(s)||r.push(s)}detachEvent(t,s){const n=this._eventRegistry,r=n.get(t);if(!r)return;const o=r.indexOf(s);o!==-1&&r.splice(o,1),r.length===0&&n.delete(t)}fireEvent(t,s){const r=this._eventRegistry.get(t);return r?r.map(o=>o.call(this,s)):[]}fireEventAsync(t,s){return Promise.all(this.fireEvent(t,s))}isHandlerAttached(t,s){const r=this._eventRegistry.get(t);return r?r.includes(s):!1}hasListeners(t){return!!this._eventRegistry.get(t)}}const js=new T,Vs="languageChange",ze=e=>{js.attachEvent(Vs,e)},oe=10;class zs{constructor(){this.list=[],this.lookup=new Set}add(t){this.lookup.has(t)||(this.list.push(t),this.lookup.add(t))}remove(t){!this.lookup.has(t)||(this.list=this.list.filter(s=>s!==t),this.lookup.delete(t))}shift(){const t=this.list.shift();if(t)return this.lookup.delete(t),t}isEmpty(){return this.list.length===0}isAdded(t){return this.lookup.has(t)}process(t){let s;const n=new Map;for(s=this.shift();s;){const r=n.get(s)||0;if(r>oe)throw new Error(`Web component processed too many times this task, max allowed is: ${oe}`);t(s),n.set(s,r+1),s=this.shift()}}}const We=e=>{const t=[];return e.forEach(s=>{t.push(s)}),t},Ze=(e,t=document.body)=>{let s=document.querySelector(e);return s||(s=document.createElement(e),t.insertBefore(s,t.firstChild))},Ws=()=>Ze("ui5-shared-resources",document.head),M=(e,t)=>{const s=e.split(".");let n=Ws();for(let r=0;r<s.length;r++){const o=s[r],i=r===s.length-1;Object.prototype.hasOwnProperty.call(n,o)||(n[o]=i?t:{}),n=n[o]}return n},ie={version:"1.6.0",major:1,minor:6,patch:0,suffix:"",isNext:!1,buildTime:1658732752};let Q,Zs="";const yt=new Map,V=M("Runtimes",[]),qs=()=>{Q===void 0&&(Q=V.length,V.push({...ie,alias:Zs,description:`Runtime ${Q} - ver ${ie.version}`}))},qe=()=>Q,Gs=(e,t)=>{const s=`${e},${t}`;if(yt.has(s))return yt.get(s);const n=V[e],r=V[t];if(!n||!r)throw new Error("Invalid runtime index supplied");if(n.isNext||r.isNext)return n.buildTime-r.buildTime;const o=n.major-r.major;if(o)return o;const i=n.minor-r.minor;if(i)return i;const a=n.patch-r.patch;if(a)return a;const l=new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"}).compare(n.suffix,r.suffix);return yt.set(s,l),l},Ks=()=>V,Ge=M("Tags",new Map),qt=new Set;let C={},_t;const Ke="unknown",ae=e=>{qt.add(e),Ge.set(e,qe())},Js=e=>qt.has(e),Xs=()=>We(qt),Ys=e=>{let t=Ge.get(e);t===void 0&&(t=Ke),C[t]=C[t]||new Set,C[t].add(e),_t||(_t=setTimeout(()=>{Qs(),C={},_t=void 0},1e3))},Qs=()=>{const e=Ks(),t=qe(),s=e[t];let n="Multiple UI5 Web Components instances detected.";e.length>1&&(n=`${n}
|
|
2
2
|
Loading order (versions before 1.1.0 not listed): ${e.map(r=>`
|
|
3
3
|
${r.description}`).join("")}`),Object.keys(C).forEach(r=>{let o,i;r===Ke?(o=1,i={description:"Older unknown runtime"}):(o=Gs(t,r),i=e[r]);let a;o>0?a="an older":o<0?a="a newer":a="the same",n=`${n}
|
|
4
4
|
|
|
@@ -163,7 +163,7 @@ const getRGBColor = color => {
|
|
|
163
163
|
}
|
|
164
164
|
|
|
165
165
|
if (color.startsWith("rgb")) {
|
|
166
|
-
return
|
|
166
|
+
return RGBStringToRGBObject(color);
|
|
167
167
|
}
|
|
168
168
|
|
|
169
169
|
// HEX
|
|
@@ -209,7 +209,7 @@ const RGBAToRGB = color => {
|
|
|
209
209
|
* Return an object with the properties for each of the main colors(red, green, blue)
|
|
210
210
|
* @param {String} color Receives a color in the following format: "rgb(0, 0, 0)
|
|
211
211
|
*/
|
|
212
|
-
const
|
|
212
|
+
const RGBStringToRGBObject = color => {
|
|
213
213
|
const openingBracketIndex = color.indexOf("("),
|
|
214
214
|
closingBraketIndex = color.indexOf(")"),
|
|
215
215
|
commasIndexes = [];
|
|
@@ -319,6 +319,32 @@ const HEXToRGB = hex => {
|
|
|
319
319
|
return rgbValues;
|
|
320
320
|
};
|
|
321
321
|
|
|
322
|
+
/**
|
|
323
|
+
* Returns the hex value of the color as string
|
|
324
|
+
* @param {Object} color Receives an object with the properties for each of the main colors(r, g, b)
|
|
325
|
+
*/
|
|
326
|
+
const RGBtoHEX = color => {
|
|
327
|
+
const hexMap = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E"];
|
|
328
|
+
let hexValue = "#";
|
|
329
|
+
|
|
330
|
+
let divisionNumber = color.r / 16;
|
|
331
|
+
let remainder = color.r % 16;
|
|
332
|
+
hexValue += String(hexMap[Math.floor(divisionNumber)]);
|
|
333
|
+
hexValue += String(hexMap[remainder]);
|
|
334
|
+
|
|
335
|
+
divisionNumber = color.g / 16;
|
|
336
|
+
remainder = color.g % 16;
|
|
337
|
+
hexValue += String(hexMap[Math.floor(divisionNumber)]);
|
|
338
|
+
hexValue += String(hexMap[remainder]);
|
|
339
|
+
|
|
340
|
+
divisionNumber = color.b / 16;
|
|
341
|
+
remainder = color.b % 16;
|
|
342
|
+
hexValue += String(hexMap[Math.floor(divisionNumber)]);
|
|
343
|
+
hexValue += String(hexMap[remainder]);
|
|
344
|
+
|
|
345
|
+
return hexValue;
|
|
346
|
+
};
|
|
347
|
+
|
|
322
348
|
const RGBToHSL = (color = {
|
|
323
349
|
r: undefined,
|
|
324
350
|
g: undefined,
|
|
@@ -367,4 +393,6 @@ export {
|
|
|
367
393
|
HSLToRGB,
|
|
368
394
|
HEXToRGB,
|
|
369
395
|
RGBToHSL,
|
|
396
|
+
RGBStringToRGBObject,
|
|
397
|
+
RGBtoHEX,
|
|
370
398
|
};
|
|
@@ -43,6 +43,7 @@ attachBoot(() => {
|
|
|
43
43
|
*
|
|
44
44
|
* @param {string} message String to be announced by the screen reader.
|
|
45
45
|
* @param {sap.ui.core.InvisibleMessageMode} mode The mode to be inserted in the aria-live attribute.
|
|
46
|
+
* @public
|
|
46
47
|
*/
|
|
47
48
|
const announce = (message, mode) => {
|
|
48
49
|
// If no type is presented, fallback to polite announcement.
|
|
@@ -55,6 +56,14 @@ const announce = (message, mode) => {
|
|
|
55
56
|
if (mode !== InvisibleMessageMode.Assertive && mode !== InvisibleMessageMode.Polite) {
|
|
56
57
|
console.warn(`You have entered an invalid mode. Valid values are: "Polite" and "Assertive". The framework will automatically set the mode to "Polite".`); // eslint-disable-line
|
|
57
58
|
}
|
|
59
|
+
|
|
60
|
+
// clear the span in order to avoid reading it out while in JAWS reading node
|
|
61
|
+
setTimeout(() => {
|
|
62
|
+
// ensure that we clear the text node only if no announce is made in the meantime
|
|
63
|
+
if (span.textContent === message) {
|
|
64
|
+
span.textContent = "";
|
|
65
|
+
}
|
|
66
|
+
}, 3000);
|
|
58
67
|
};
|
|
59
68
|
|
|
60
69
|
export default announce;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ui5/webcomponents-base",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.6.0",
|
|
4
4
|
"description": "UI5 Web Components: webcomponents.base",
|
|
5
5
|
"author": "SAP SE (https://www.sap.com)",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"devDependencies": {
|
|
37
37
|
"@buxlabs/amd-to-es6": "0.16.1",
|
|
38
38
|
"@openui5/sap.ui.core": "1.101.0",
|
|
39
|
-
"@ui5/webcomponents-tools": "1.
|
|
39
|
+
"@ui5/webcomponents-tools": "1.6.0",
|
|
40
40
|
"chromedriver": "102.0.0",
|
|
41
41
|
"clean-css": "^5.2.2",
|
|
42
42
|
"copy-and-watch": "^0.1.5",
|
|
@@ -163,7 +163,7 @@ const getRGBColor = color => {
|
|
|
163
163
|
}
|
|
164
164
|
|
|
165
165
|
if (color.startsWith("rgb")) {
|
|
166
|
-
return
|
|
166
|
+
return RGBStringToRGBObject(color);
|
|
167
167
|
}
|
|
168
168
|
|
|
169
169
|
// HEX
|
|
@@ -209,7 +209,7 @@ const RGBAToRGB = color => {
|
|
|
209
209
|
* Return an object with the properties for each of the main colors(red, green, blue)
|
|
210
210
|
* @param {String} color Receives a color in the following format: "rgb(0, 0, 0)
|
|
211
211
|
*/
|
|
212
|
-
const
|
|
212
|
+
const RGBStringToRGBObject = color => {
|
|
213
213
|
const openingBracketIndex = color.indexOf("("),
|
|
214
214
|
closingBraketIndex = color.indexOf(")"),
|
|
215
215
|
commasIndexes = [];
|
|
@@ -319,6 +319,32 @@ const HEXToRGB = hex => {
|
|
|
319
319
|
return rgbValues;
|
|
320
320
|
};
|
|
321
321
|
|
|
322
|
+
/**
|
|
323
|
+
* Returns the hex value of the color as string
|
|
324
|
+
* @param {Object} color Receives an object with the properties for each of the main colors(r, g, b)
|
|
325
|
+
*/
|
|
326
|
+
const RGBtoHEX = color => {
|
|
327
|
+
const hexMap = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E"];
|
|
328
|
+
let hexValue = "#";
|
|
329
|
+
|
|
330
|
+
let divisionNumber = color.r / 16;
|
|
331
|
+
let remainder = color.r % 16;
|
|
332
|
+
hexValue += String(hexMap[Math.floor(divisionNumber)]);
|
|
333
|
+
hexValue += String(hexMap[remainder]);
|
|
334
|
+
|
|
335
|
+
divisionNumber = color.g / 16;
|
|
336
|
+
remainder = color.g % 16;
|
|
337
|
+
hexValue += String(hexMap[Math.floor(divisionNumber)]);
|
|
338
|
+
hexValue += String(hexMap[remainder]);
|
|
339
|
+
|
|
340
|
+
divisionNumber = color.b / 16;
|
|
341
|
+
remainder = color.b % 16;
|
|
342
|
+
hexValue += String(hexMap[Math.floor(divisionNumber)]);
|
|
343
|
+
hexValue += String(hexMap[remainder]);
|
|
344
|
+
|
|
345
|
+
return hexValue;
|
|
346
|
+
};
|
|
347
|
+
|
|
322
348
|
const RGBToHSL = (color = {
|
|
323
349
|
r: undefined,
|
|
324
350
|
g: undefined,
|
|
@@ -367,4 +393,6 @@ export {
|
|
|
367
393
|
HSLToRGB,
|
|
368
394
|
HEXToRGB,
|
|
369
395
|
RGBToHSL,
|
|
396
|
+
RGBStringToRGBObject,
|
|
397
|
+
RGBtoHEX,
|
|
370
398
|
};
|
|
@@ -43,6 +43,7 @@ attachBoot(() => {
|
|
|
43
43
|
*
|
|
44
44
|
* @param {string} message String to be announced by the screen reader.
|
|
45
45
|
* @param {sap.ui.core.InvisibleMessageMode} mode The mode to be inserted in the aria-live attribute.
|
|
46
|
+
* @public
|
|
46
47
|
*/
|
|
47
48
|
const announce = (message, mode) => {
|
|
48
49
|
// If no type is presented, fallback to polite announcement.
|
|
@@ -55,6 +56,14 @@ const announce = (message, mode) => {
|
|
|
55
56
|
if (mode !== InvisibleMessageMode.Assertive && mode !== InvisibleMessageMode.Polite) {
|
|
56
57
|
console.warn(`You have entered an invalid mode. Valid values are: "Polite" and "Assertive". The framework will automatically set the mode to "Polite".`); // eslint-disable-line
|
|
57
58
|
}
|
|
59
|
+
|
|
60
|
+
// clear the span in order to avoid reading it out while in JAWS reading node
|
|
61
|
+
setTimeout(() => {
|
|
62
|
+
// ensure that we clear the text node only if no announce is made in the meantime
|
|
63
|
+
if (span.textContent === message) {
|
|
64
|
+
span.textContent = "";
|
|
65
|
+
}
|
|
66
|
+
}, 3000);
|
|
58
67
|
};
|
|
59
68
|
|
|
60
69
|
export default announce;
|