@sbb-esta/lyne-elements-dev 5.7.0-dev.1788501288 → 5.7.0-dev.1788532472
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/development/icon.pure.js +22 -11
- package/icon.pure.js +1 -1
- package/package.json +2 -2
package/development/icon.pure.js
CHANGED
|
@@ -54,17 +54,28 @@ const getSvgContent = (namespace, name, sanitize) => {
|
|
|
54
54
|
let req = requests.get(url);
|
|
55
55
|
if (!req) {
|
|
56
56
|
if (typeof fetch !== "undefined" && !isServer) {
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
57
|
+
const interceptor = config.interceptor ?? ((i) => i.request());
|
|
58
|
+
let interceptorRequest;
|
|
59
|
+
try {
|
|
60
|
+
interceptorRequest = Promise.resolve(interceptor({
|
|
61
|
+
namespace,
|
|
62
|
+
name,
|
|
63
|
+
url,
|
|
64
|
+
request: () => fetch(url).then(async (response) => {
|
|
65
|
+
if (!response.ok) throw new Error(`Failed to load icon ${namespace}:${name}`);
|
|
66
|
+
return validateContent(await response.text(), sanitize);
|
|
67
|
+
})
|
|
68
|
+
}));
|
|
69
|
+
} catch (error) {
|
|
70
|
+
interceptorRequest = Promise.reject(error);
|
|
71
|
+
}
|
|
72
|
+
req = interceptorRequest.then((content) => {
|
|
73
|
+
if (!content && requests.get(url) === req) requests.delete(url);
|
|
74
|
+
return content;
|
|
75
|
+
}, (error) => {
|
|
76
|
+
if (requests.get(url) === req) requests.delete(url);
|
|
77
|
+
console.warn(error);
|
|
78
|
+
return "";
|
|
68
79
|
});
|
|
69
80
|
requests.set(url, req);
|
|
70
81
|
} else return Promise.resolve("");
|
package/icon.pure.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,isServer as r,nothing as i,unsafeCSS as a}from"lit";import{property as o,state as s}from"lit/decorators.js";import{unsafeHTML as c}from"lit/directives/unsafe-html.js";import{until as l}from"lit/directives/until.js";import{SbbElement as u,forceType as d,omitEmptyConverter as f,readConfig as p}from"./core.js";const m=e=>typeof e==`string`,h=e=>{if(e.nodeType===1){if(e.nodeName.toLowerCase()===`script`)return!1;for(let t=0;t<e.attributes.length;t++){let n=e.attributes[t].name;if(m(n)&&n.toLowerCase().indexOf(`on`)===0)return!1}for(let t=0;t<e.childNodes.length;t++)if(!h(e.childNodes[t]))return!1}return!0},g=(e,t=!0,n=!1)=>{let r=document.createElement(`div`);r.innerHTML=e;for(let e=r.childNodes.length-1;e>=0;e--)r.childNodes[e].nodeName.toLowerCase()!==`svg`&&r.removeChild(r.childNodes[e]);let i=r.firstElementChild;return i&&i.nodeName.toLowerCase()===`svg`&&(n&&!i.classList.contains(`color-immutable`)&&i.classList.add(`color-immutable`),!t||h(i))?r.innerHTML:``},_=`https://icons.app.sbb.ch/`,v=new Map().set(`default`,`${_}icons/`).set(`picto`,`${_}picto/`),y=new Map,b=(e,t,n)=>{let i=p().icon??{},a=i.namespaces?.get(e)??v.get(e);if(a==null)throw Error(`Unable to find the namespace "${e}". Please register your custom namespace.`);let o=`${a}${t}.svg`,s=y.get(o);if(!s){if(typeof fetch<`u`&&!r)
|
|
1
|
+
import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,isServer as r,nothing as i,unsafeCSS as a}from"lit";import{property as o,state as s}from"lit/decorators.js";import{unsafeHTML as c}from"lit/directives/unsafe-html.js";import{until as l}from"lit/directives/until.js";import{SbbElement as u,forceType as d,omitEmptyConverter as f,readConfig as p}from"./core.js";const m=e=>typeof e==`string`,h=e=>{if(e.nodeType===1){if(e.nodeName.toLowerCase()===`script`)return!1;for(let t=0;t<e.attributes.length;t++){let n=e.attributes[t].name;if(m(n)&&n.toLowerCase().indexOf(`on`)===0)return!1}for(let t=0;t<e.childNodes.length;t++)if(!h(e.childNodes[t]))return!1}return!0},g=(e,t=!0,n=!1)=>{let r=document.createElement(`div`);r.innerHTML=e;for(let e=r.childNodes.length-1;e>=0;e--)r.childNodes[e].nodeName.toLowerCase()!==`svg`&&r.removeChild(r.childNodes[e]);let i=r.firstElementChild;return i&&i.nodeName.toLowerCase()===`svg`&&(n&&!i.classList.contains(`color-immutable`)&&i.classList.add(`color-immutable`),!t||h(i))?r.innerHTML:``},_=`https://icons.app.sbb.ch/`,v=new Map().set(`default`,`${_}icons/`).set(`picto`,`${_}picto/`),y=new Map,b=(e,t,n)=>{let i=p().icon??{},a=i.namespaces?.get(e)??v.get(e);if(a==null)throw Error(`Unable to find the namespace "${e}". Please register your custom namespace.`);let o=`${a}${t}.svg`,s=y.get(o);if(!s){if(typeof fetch<`u`&&!r){let r=i.interceptor??(e=>e.request()),a;try{a=Promise.resolve(r({namespace:e,name:t,url:o,request:()=>fetch(o).then(async r=>{if(!r.ok)throw Error(`Failed to load icon ${e}:${t}`);return g(await r.text(),n)})}))}catch(e){a=Promise.reject(e)}s=a.then(e=>(!e&&y.get(o)===s&&y.delete(o),e),e=>(y.get(o)===s&&y.delete(o),console.warn(e),``)),y.set(o,s)}else return Promise.resolve(``)}return s};var x=`:host{-webkit-tap-highlight-color:transparent;line-height:0;display:inline-block}:host(:is(:state(empty),[state--empty])){--sbb-icon-default-dimension:0}:host(:is(:state(empty),[state--empty]):is(:state(namespace-default),[state--namespace-default])[name$=-extra-small]){--sbb-icon-default-dimension:var(--sbb-size-icon-ui-extra-small)}:host(:is(:state(empty),[state--empty]):is(:state(namespace-default),[state--namespace-default])[name$=-small]){--sbb-icon-default-dimension:var(--sbb-size-icon-ui-small)}:host(:is(:state(empty),[state--empty]):is(:state(namespace-default),[state--namespace-default])[name$=-medium]){--sbb-icon-default-dimension:var(--sbb-size-icon-ui-medium)}:host(:is(:state(empty),[state--empty]):is(:state(namespace-default),[state--namespace-default])[name$=-large]){--sbb-icon-default-dimension:var(--sbb-size-icon-ui-large)}svg{display:var(--sbb-icon-svg-display);width:var(--sbb-icon-svg-width,var(--sbb-icon-default-dimension));height:var(--sbb-icon-svg-height,var(--sbb-icon-default-dimension));stroke:var(--sbb-icon-svg-stroke-color);stroke-width:var(--sbb-icon-svg-stroke-width)}svg:not(.color-immutable) [fill]:not([fill=none]){fill:currentColor}svg:not(.color-immutable) [stroke]:not([stroke=none]){stroke:currentColor}svg:not(.color-immutable)>:where(path,polygon,polyline):where(:not([stroke]):not([fill])),svg:not(.color-immutable) :where(:not([stroke]):not([fill])) :where(path,polygon,polyline):where(:not([stroke]):not([fill])){fill:currentColor}
|
|
2
2
|
`;const S=`default`;let C=(()=>{let r=u,i,f=[],p=[],m,h=[],g=[],_,v=[],y=[];return class extends r{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;i=[s()],m=[s()],_=[d(),o({attribute:`no-sanitize`,type:Boolean})],e(this,null,i,{kind:`accessor`,name:`_svgNamespace`,static:!1,private:!1,access:{has:e=>`_svgNamespace`in e,get:e=>e._svgNamespace,set:(e,t)=>{e._svgNamespace=t}},metadata:t},f,p),e(this,null,m,{kind:`accessor`,name:`_svgIcon`,static:!1,private:!1,access:{has:e=>`_svgIcon`in e,get:e=>e._svgIcon,set:(e,t)=>{e._svgIcon=t}},metadata:t},h,g),e(this,null,_,{kind:`accessor`,name:`noSanitize`,static:!1,private:!1,access:{has:e=>`noSanitize`in e,get:e=>e.noSanitize,set:(e,t)=>{e.noSanitize=t}},metadata:t},v,y),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[a(x)]}static{this.role=`img`}#e=t(this,f,S);get _svgNamespace(){return this.#e}set _svgNamespace(e){this.#e=e}#t=(t(this,p),t(this,h,null));get _svgIcon(){return this.#t}set _svgIcon(e){this.#t=e}#n=(t(this,g),t(this,v,!1));get noSanitize(){return this.#n}set noSanitize(e){this.#n=e}constructor(){super(),t(this,y),this.internals.states.add(`empty`)}async loadSvgIcon(e){if(!e)return;let[t,n]=this._splitIconName(e);this._svgNamespace&&this.internals.states.delete(`namespace-${this._svgNamespace}`),this._svgNamespace=t,this._svgNamespace&&this.internals.states.add(`namespace-${this._svgNamespace}`);let r=this.fetchSvgIcon(this._svgNamespace,n);this.toggleState(`empty`,!0),this._svgIcon=r.then(e=>c(e));try{this.toggleState(`empty`,!await r)}catch{this.internals.states.add(`empty`)}}async fetchSvgIcon(e,t){return await b(e,t,!this.noSanitize)}_splitIconName(e){if(!e)return[``,``];let t=e.split(`:`);switch(t.length){case 1:return[S,t[0]];case 2:return t;default:throw Error(`Invalid icon name: "${e}"`)}}render(){return n`<span class="sbb-icon-inner"
|
|
3
3
|
>${l(this._svgIcon,n`<svg width="0" height="0"></svg>`)}</span
|
|
4
4
|
>`}}})(),w=(()=>{let r=C,i,a=[],c=[],l,u=[],p=[];return class extends r{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;i=[d(),o({reflect:!0,converter:f})],l=[s()],e(this,null,i,{kind:`accessor`,name:`name`,static:!1,private:!1,access:{has:e=>`name`in e,get:e=>e.name,set:(e,t)=>{e.name=t}},metadata:t},a,c),e(this,null,l,{kind:`accessor`,name:`_sbbAngularCompatibility`,static:!1,private:!1,access:{has:e=>`_sbbAngularCompatibility`in e,get:e=>e._sbbAngularCompatibility,set:(e,t)=>{e._sbbAngularCompatibility=t}},metadata:t},u,p),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-icon`}static get observedAttributes(){return super.observedAttributes.concat(`svgicon`)}#e=t(this,a,``);get name(){return this.#e}set name(e){this.#e=e}#t=(t(this,c),t(this,u,!1));get _sbbAngularCompatibility(){return this.#t}set _sbbAngularCompatibility(e){this.#t=e}constructor(){super(),t(this,p),this.internals.ariaHidden=`true`}async fetchSvgIcon(e,t){return this.internals.ariaLabel=`Icon ${t.replace(/-/g,` `)}`,super.fetchSvgIcon(e,t)}willUpdate(e){super.willUpdate(e),e.has(`name`)&&this.name&&this.loadSvgIcon(this.name)}attributeChangedCallback(e,t,n){e===`svgicon`?this._sbbAngularCompatibility=!!n:super.attributeChangedCallback(e,t,n)}render(){return this._sbbAngularCompatibility?n`<slot></slot>`:super.render()}}})();const T=r=>(()=>{let a=r,s,c=[],l=[];return class extends a{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(a[Symbol.metadata]??null):void 0;s=[d(),o({attribute:`icon-name`,converter:f})],e(this,null,s,{kind:`accessor`,name:`iconName`,static:!1,private:!1,access:{has:e=>`iconName`in e,get:e=>e.iconName,set:(e,t)=>{e.iconName=t}},metadata:t},c,l),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementDependencies=[w]}#e=t(this,c,``);get iconName(){return this.#e}set iconName(e){this.#e=e}renderIconSlot(e){let t=this._renderIconName();return n`
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sbb-esta/lyne-elements-dev",
|
|
3
|
-
"version": "5.7.0-dev.
|
|
3
|
+
"version": "5.7.0-dev.1788532472",
|
|
4
4
|
"description": "Lyne Design System",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"design system",
|
|
7
7
|
"web components",
|
|
8
8
|
"lit",
|
|
9
|
-
"https://github.com/sbb-design-systems/lyne-components/commit/
|
|
9
|
+
"https://github.com/sbb-design-systems/lyne-components/commit/ce8acb81fc287dd94a41894b4da905975542064c"
|
|
10
10
|
],
|
|
11
11
|
"type": "module",
|
|
12
12
|
"exports": {
|