@hotosm/ui 0.10.1 → 0.10.2
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/chunks/{chunk.AD6PBOLJ.js → chunk.IASKXF74.js} +1 -1
- package/dist/chunks/chunk.WENKDNDZ.js +91 -0
- package/dist/components/announcement/announcement.component.d.ts +7 -1
- package/dist/components/announcement/announcement.component.js +1 -1
- package/dist/components/announcement/announcement.js +1 -1
- package/dist/hotosm-ui.js +1 -1
- package/package.json +1 -1
- package/dist/chunks/chunk.NZ24D6VL.js +0 -89
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as e}from"./chunk.
|
|
1
|
+
import{b as e}from"./chunk.WENKDNDZ.js";var t=e;customElements.get("hot-announcement")||customElements.define("hot-announcement",e);export{t as a};
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import{a as l,b as g}from"./chunk.ZETV7TDG.js";import{a as f,d as u,f as v}from"./chunk.QABMDRWR.js";import{d as s,e as r,f as a,g as o}from"./chunk.N2W26RCT.js";Promise.allSettled([import("@awesome.me/webawesome/dist/components/callout/callout.js"),import("@awesome.me/webawesome/dist/components/icon/icon.js"),import("@awesome.me/webawesome/dist/components/button/button.js")]);var $=["brand","success","neutral","warning"],N=new RegExp(`\\[([^\\]]+)\\]\\((https?:\\/\\/[^\\s)]+)\\)|(?<=^|[\\s(])(https?:\\/\\/[^\\s<"]+[^\\s<".,:;')\\]])`,"g");function y(h){if(typeof h!="string"||h.length===0)return null;let m=new Date(h);return Number.isNaN(m.getTime())?null:m}var w,x,A,k,C,S,V,e=class extends v{constructor(){super(...arguments);this.name="hot-announcement";a(this,w,"");a(this,x,"");a(this,A,"");a(this,k,"brand");a(this,C,"Dismiss");a(this,S,"hot-announcement");a(this,V,"");this.visible=!1;this.startsAt=null;this.endsAt=null;this.fetchAbort=null}get version(){return r(this,w)}set version(t){o(this,w,t)}get title(){return r(this,x)}set title(t){o(this,x,t)}get message(){return r(this,A)}set message(t){o(this,A,t)}get variant(){return r(this,k)}set variant(t){o(this,k,t)}get dismissLabel(){return r(this,C)}set dismissLabel(t){o(this,C,t)}get storageKey(){return r(this,S)}set storageKey(t){o(this,S,t)}get src(){return r(this,V)}set src(t){o(this,V,t)}storageFullKey(){return`${this.storageKey}-${this.version}-dismissed`}dismiss(){this.version.length>0&&localStorage.setItem(this.storageFullKey(),"true"),this.visible=!1,this.dispatchEvent(new CustomEvent("dismiss",{detail:{version:this.version},bubbles:!0,composed:!0}))}connectedCallback(){super.connectedCallback(),this._evaluateVisibility()}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.fetchAbort)==null||t.abort(),this.fetchAbort=null}willUpdate(t){if(t.has("src")&&this.src.length>0){this._loadRemoteConfig();return}(t.has("version")||t.has("storageKey"))&&this._evaluateVisibility()}async _loadRemoteConfig(){var i;(i=this.fetchAbort)==null||i.abort();let t=new AbortController;this.fetchAbort=t,this.visible=!1;try{let n=await fetch(this.src,{signal:t.signal});if(!n.ok)return;let d=await n.text();if(d.trim().length===0)return;let c=JSON.parse(d);this._applyRemoteConfig(c)}catch(n){if(n.name==="AbortError")return}finally{this.fetchAbort===t&&(this.fetchAbort=null)}}_applyRemoteConfig(t){typeof t.version=="string"&&(this.version=t.version),typeof t.title=="string"&&(this.title=t.title),typeof t.message=="string"&&(this.message=t.message),typeof t.variant=="string"&&$.includes(t.variant)&&(this.variant=t.variant),this.startsAt=y(t.startsAt),this.endsAt=y(t.endsAt),this._evaluateVisibility()}_evaluateVisibility(){if(this.version.length===0){this.src.length===0&&console.warn("[hot-announcement] `version` is required so dismissal can be keyed per release. Banner hidden."),this.visible=!1;return}let t=Date.now();if(this.startsAt&&t<this.startsAt.getTime()){this.visible=!1;return}if(this.endsAt&&t>this.endsAt.getTime()){this.visible=!1;return}let i=localStorage.getItem(this.storageFullKey())==="true";this.visible=!i}renderMessage(){let t=[],i=0;for(let n of this.message.matchAll(N)){let[d,c,p,b]=n,R=p!=null?p:b;t.push(this.message.slice(i,n.index)),t.push(u`<a href="${R}" target="_blank" rel="noopener noreferrer"
|
|
2
|
+
>${c!=null?c:b}</a
|
|
3
|
+
>`),i=n.index+d.length}return t.length===0?this.message:(t.push(this.message.slice(i)),t)}render(){return this.visible?u`
|
|
4
|
+
<div class="announcement-banner" role="status">
|
|
5
|
+
<wa-callout variant="${this.variant}" appearance="outlined filled" size="medium">
|
|
6
|
+
<wa-icon slot="icon" family="classic" variant="solid" name="circle-info"></wa-icon>
|
|
7
|
+
<div class="announcement-content">
|
|
8
|
+
<div class="announcement-body">
|
|
9
|
+
${this.title.length>0?u`<strong>${this.title}</strong>`:null}
|
|
10
|
+
<slot>${this.renderMessage()}</slot>
|
|
11
|
+
</div>
|
|
12
|
+
<button
|
|
13
|
+
type="button"
|
|
14
|
+
class="announcement-dismiss"
|
|
15
|
+
aria-label="${this.dismissLabel}"
|
|
16
|
+
@click=${()=>this.dismiss()}
|
|
17
|
+
>
|
|
18
|
+
<wa-icon name="xmark"></wa-icon>
|
|
19
|
+
</button>
|
|
20
|
+
</div>
|
|
21
|
+
</wa-callout>
|
|
22
|
+
</div>
|
|
23
|
+
`:null}};w=new WeakMap,x=new WeakMap,A=new WeakMap,k=new WeakMap,C=new WeakMap,S=new WeakMap,V=new WeakMap,e.styles=f`
|
|
24
|
+
:host {
|
|
25
|
+
display: block;
|
|
26
|
+
font-family: var(--hot-font-sans);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.announcement-banner {
|
|
30
|
+
position: sticky;
|
|
31
|
+
top: 0;
|
|
32
|
+
z-index: 1000;
|
|
33
|
+
width: 100%;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
wa-callout {
|
|
37
|
+
border-radius: 0;
|
|
38
|
+
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.announcement-content {
|
|
42
|
+
display: flex;
|
|
43
|
+
align-items: center;
|
|
44
|
+
gap: var(--hot-spacing-small);
|
|
45
|
+
width: 100%;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.announcement-body {
|
|
49
|
+
padding: 0 var(--hot-spacing-x-small);
|
|
50
|
+
flex: 1;
|
|
51
|
+
min-width: 0;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.announcement-body strong {
|
|
55
|
+
display: block;
|
|
56
|
+
margin-bottom: var(--hot-spacing-3x-small);
|
|
57
|
+
font-weight: var(--hot-font-weight-semibold);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.announcement-body ::slotted(a),
|
|
61
|
+
.announcement-body a {
|
|
62
|
+
color: var(--hot-color-primary-600);
|
|
63
|
+
text-decoration: underline;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
.announcement-dismiss {
|
|
67
|
+
flex-shrink: 0;
|
|
68
|
+
display: inline-flex;
|
|
69
|
+
align-items: center;
|
|
70
|
+
justify-content: center;
|
|
71
|
+
width: 1.75rem;
|
|
72
|
+
height: 1.75rem;
|
|
73
|
+
padding: 0;
|
|
74
|
+
border: none;
|
|
75
|
+
border-radius: var(--hot-border-radius-medium);
|
|
76
|
+
background: transparent;
|
|
77
|
+
color: inherit;
|
|
78
|
+
cursor: pointer;
|
|
79
|
+
font-size: 1rem;
|
|
80
|
+
line-height: 1;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.announcement-dismiss:hover {
|
|
84
|
+
background: rgba(0, 0, 0, 0.06);
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.announcement-dismiss:focus-visible {
|
|
88
|
+
outline: 2px solid var(--hot-color-primary-500);
|
|
89
|
+
outline-offset: 2px;
|
|
90
|
+
}
|
|
91
|
+
`,s([l({type:String})],e.prototype,"version",1),s([l({type:String})],e.prototype,"title",1),s([l({type:String})],e.prototype,"message",1),s([l({type:String})],e.prototype,"variant",1),s([l({type:String,attribute:"dismiss-label"})],e.prototype,"dismissLabel",1),s([l({type:String,attribute:"storage-key"})],e.prototype,"storageKey",1),s([l({type:String})],e.prototype,"src",1),s([g()],e.prototype,"visible",2),s([g()],e.prototype,"startsAt",2),s([g()],e.prototype,"endsAt",2);var T=e;export{e as a,T as b};
|
|
@@ -8,7 +8,11 @@ export declare class Announcement extends LitElement {
|
|
|
8
8
|
accessor version: string;
|
|
9
9
|
/** Optional bold headline shown before the body content. */
|
|
10
10
|
accessor title: string;
|
|
11
|
-
/**
|
|
11
|
+
/**
|
|
12
|
+
* Body shown when no slotted content is provided. Links may be written as
|
|
13
|
+
* markdown `[label](url)` or as a bare URL; all other markup is shown as
|
|
14
|
+
* literal text, since a remote `src` config is not a trusted HTML source.
|
|
15
|
+
*/
|
|
12
16
|
accessor message: string;
|
|
13
17
|
/** Visual variant mapped onto wa-callout. */
|
|
14
18
|
accessor variant: AnnouncementVariant;
|
|
@@ -42,6 +46,8 @@ export declare class Announcement extends LitElement {
|
|
|
42
46
|
private _loadRemoteConfig;
|
|
43
47
|
private _applyRemoteConfig;
|
|
44
48
|
private _evaluateVisibility;
|
|
49
|
+
/** Render `message` as text, turning any links it contains into anchors. */
|
|
50
|
+
private renderMessage;
|
|
45
51
|
protected render(): import("lit").TemplateResult<1> | null;
|
|
46
52
|
}
|
|
47
53
|
export default Announcement;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a,b}from"../../chunks/chunk.
|
|
1
|
+
import{a,b}from"../../chunks/chunk.WENKDNDZ.js";import"../../chunks/chunk.ZETV7TDG.js";import"../../chunks/chunk.QABMDRWR.js";import"../../chunks/chunk.N2W26RCT.js";export{a as Announcement,b as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a}from"../../chunks/chunk.
|
|
1
|
+
import{a}from"../../chunks/chunk.IASKXF74.js";import"../../chunks/chunk.WENKDNDZ.js";import"../../chunks/chunk.ZETV7TDG.js";import"../../chunks/chunk.QABMDRWR.js";import"../../chunks/chunk.N2W26RCT.js";export{a as default};
|
package/dist/hotosm-ui.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as p}from"./chunks/chunk.ZG2J5SU5.js";import"./chunks/chunk.34AG3B2Y.js";import"./chunks/chunk.ZKUACKKG.js";import{a as y}from"./chunks/chunk.V7C4W6GD.js";import"./chunks/chunk.24HG5LKA.js";import"./chunks/chunk.DCR6GEE6.js";import{a as u}from"./chunks/chunk.V5BQICX2.js";import"./chunks/chunk.DNXHV7I7.js";import{a as S}from"./chunks/chunk.NZMGMJCM.js";import{a as m}from"./chunks/chunk.L2GREEZE.js";import"./chunks/chunk.LLGJXBVH.js";import"./chunks/chunk.UB7NXUCE.js";import{a as f}from"./chunks/chunk.
|
|
1
|
+
import{a as p}from"./chunks/chunk.ZG2J5SU5.js";import"./chunks/chunk.34AG3B2Y.js";import"./chunks/chunk.ZKUACKKG.js";import{a as y}from"./chunks/chunk.V7C4W6GD.js";import"./chunks/chunk.24HG5LKA.js";import"./chunks/chunk.DCR6GEE6.js";import{a as u}from"./chunks/chunk.V5BQICX2.js";import"./chunks/chunk.DNXHV7I7.js";import{a as S}from"./chunks/chunk.NZMGMJCM.js";import{a as m}from"./chunks/chunk.L2GREEZE.js";import"./chunks/chunk.LLGJXBVH.js";import"./chunks/chunk.UB7NXUCE.js";import{a as f}from"./chunks/chunk.IASKXF74.js";import"./chunks/chunk.WENKDNDZ.js";import{a as d}from"./chunks/chunk.N7SRHM5F.js";import"./chunks/chunk.ZZ7X3H3S.js";import"./chunks/chunk.KO4EOD3I.js";import"./chunks/chunk.TUEFHEUN.js";import"./chunks/chunk.IKKWEPSE.js";import"./chunks/chunk.L7KUSNV7.js";import{a as h}from"./chunks/chunk.MKQTK2RW.js";import"./chunks/chunk.NCBKWO6J.js";import"./chunks/chunk.UVBWHOA2.js";import"./chunks/chunk.ZETV7TDG.js";import"./chunks/chunk.QABMDRWR.js";import"./chunks/chunk.N2W26RCT.js";function a(t,e=document){let o=[],r=e.querySelectorAll(t);return o.push(...Array.from(r)),e.querySelectorAll("*").forEach(i=>{i.shadowRoot&&o.push(...a(t,i.shadowRoot))}),o}function g(t){let{css:e,selector:o="wa-button",all:r=!0,styleId:s="hot-theme-injection"}=t;(r?a(o):[a(o)[0]].filter(Boolean)).forEach(n=>{if(!n)return;let c=()=>{if(!n.shadowRoot){setTimeout(c,10);return}if(n.shadowRoot.getElementById(s))return;let l=document.createElement("style");l.id=s,l.textContent=e,n.shadowRoot.appendChild(l)};c()})}export{f as Announcement,d as Consent,S as FileInputDropzone,m as Header,h as ListCard,p as Logo,y as ToolMenu,u as Tracking,g as injectCSSIntoShadowDOM};
|
package/package.json
CHANGED
|
@@ -1,89 +0,0 @@
|
|
|
1
|
-
import{a,b as d}from"./chunk.ZETV7TDG.js";import{a as g,d as u,f as b}from"./chunk.QABMDRWR.js";import{d as s,e as i,f as n,g as r}from"./chunk.N2W26RCT.js";Promise.allSettled([import("@awesome.me/webawesome/dist/components/callout/callout.js"),import("@awesome.me/webawesome/dist/components/icon/icon.js"),import("@awesome.me/webawesome/dist/components/button/button.js")]);var S=["brand","success","neutral","warning"];function p(o){if(typeof o!="string"||o.length===0)return null;let h=new Date(o);return Number.isNaN(h.getTime())?null:h}var f,v,y,w,x,A,k,e=class extends b{constructor(){super(...arguments);this.name="hot-announcement";n(this,f,"");n(this,v,"");n(this,y,"");n(this,w,"brand");n(this,x,"Dismiss");n(this,A,"hot-announcement");n(this,k,"");this.visible=!1;this.startsAt=null;this.endsAt=null;this.fetchAbort=null}get version(){return i(this,f)}set version(t){r(this,f,t)}get title(){return i(this,v)}set title(t){r(this,v,t)}get message(){return i(this,y)}set message(t){r(this,y,t)}get variant(){return i(this,w)}set variant(t){r(this,w,t)}get dismissLabel(){return i(this,x)}set dismissLabel(t){r(this,x,t)}get storageKey(){return i(this,A)}set storageKey(t){r(this,A,t)}get src(){return i(this,k)}set src(t){r(this,k,t)}storageFullKey(){return`${this.storageKey}-${this.version}-dismissed`}dismiss(){this.version.length>0&&localStorage.setItem(this.storageFullKey(),"true"),this.visible=!1,this.dispatchEvent(new CustomEvent("dismiss",{detail:{version:this.version},bubbles:!0,composed:!0}))}connectedCallback(){super.connectedCallback(),this._evaluateVisibility()}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.fetchAbort)==null||t.abort(),this.fetchAbort=null}willUpdate(t){if(t.has("src")&&this.src.length>0){this._loadRemoteConfig();return}(t.has("version")||t.has("storageKey"))&&this._evaluateVisibility()}async _loadRemoteConfig(){var l;(l=this.fetchAbort)==null||l.abort();let t=new AbortController;this.fetchAbort=t,this.visible=!1;try{let c=await fetch(this.src,{signal:t.signal});if(!c.ok)return;let m=await c.text();if(m.trim().length===0)return;let C=JSON.parse(m);this._applyRemoteConfig(C)}catch(c){if(c.name==="AbortError")return}finally{this.fetchAbort===t&&(this.fetchAbort=null)}}_applyRemoteConfig(t){typeof t.version=="string"&&(this.version=t.version),typeof t.title=="string"&&(this.title=t.title),typeof t.message=="string"&&(this.message=t.message),typeof t.variant=="string"&&S.includes(t.variant)&&(this.variant=t.variant),this.startsAt=p(t.startsAt),this.endsAt=p(t.endsAt),this._evaluateVisibility()}_evaluateVisibility(){if(this.version.length===0){this.src.length===0&&console.warn("[hot-announcement] `version` is required so dismissal can be keyed per release. Banner hidden."),this.visible=!1;return}let t=Date.now();if(this.startsAt&&t<this.startsAt.getTime()){this.visible=!1;return}if(this.endsAt&&t>this.endsAt.getTime()){this.visible=!1;return}let l=localStorage.getItem(this.storageFullKey())==="true";this.visible=!l}render(){return this.visible?u`
|
|
2
|
-
<div class="announcement-banner" role="status">
|
|
3
|
-
<wa-callout variant="${this.variant}" appearance="outlined filled" size="medium">
|
|
4
|
-
<wa-icon slot="icon" family="classic" variant="solid" name="circle-info"></wa-icon>
|
|
5
|
-
<div class="announcement-content">
|
|
6
|
-
<div class="announcement-body">
|
|
7
|
-
${this.title.length>0?u`<strong>${this.title}</strong>`:null}
|
|
8
|
-
<slot>${this.message}</slot>
|
|
9
|
-
</div>
|
|
10
|
-
<button
|
|
11
|
-
type="button"
|
|
12
|
-
class="announcement-dismiss"
|
|
13
|
-
aria-label="${this.dismissLabel}"
|
|
14
|
-
@click=${()=>this.dismiss()}
|
|
15
|
-
>
|
|
16
|
-
<wa-icon name="xmark"></wa-icon>
|
|
17
|
-
</button>
|
|
18
|
-
</div>
|
|
19
|
-
</wa-callout>
|
|
20
|
-
</div>
|
|
21
|
-
`:null}};f=new WeakMap,v=new WeakMap,y=new WeakMap,w=new WeakMap,x=new WeakMap,A=new WeakMap,k=new WeakMap,e.styles=g`
|
|
22
|
-
:host {
|
|
23
|
-
display: block;
|
|
24
|
-
font-family: var(--hot-font-sans);
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
.announcement-banner {
|
|
28
|
-
position: sticky;
|
|
29
|
-
top: 0;
|
|
30
|
-
z-index: 1000;
|
|
31
|
-
width: 100%;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
wa-callout {
|
|
35
|
-
border-radius: 0;
|
|
36
|
-
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
.announcement-content {
|
|
40
|
-
display: flex;
|
|
41
|
-
align-items: center;
|
|
42
|
-
gap: var(--hot-spacing-small);
|
|
43
|
-
width: 100%;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
.announcement-body {
|
|
47
|
-
padding: 0 var(--hot-spacing-x-small);
|
|
48
|
-
flex: 1;
|
|
49
|
-
min-width: 0;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.announcement-body strong {
|
|
53
|
-
display: block;
|
|
54
|
-
margin-bottom: var(--hot-spacing-3x-small);
|
|
55
|
-
font-weight: var(--hot-font-weight-semibold);
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
.announcement-body ::slotted(a),
|
|
59
|
-
.announcement-body a {
|
|
60
|
-
color: var(--hot-color-primary-600);
|
|
61
|
-
text-decoration: underline;
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
.announcement-dismiss {
|
|
65
|
-
flex-shrink: 0;
|
|
66
|
-
display: inline-flex;
|
|
67
|
-
align-items: center;
|
|
68
|
-
justify-content: center;
|
|
69
|
-
width: 1.75rem;
|
|
70
|
-
height: 1.75rem;
|
|
71
|
-
padding: 0;
|
|
72
|
-
border: none;
|
|
73
|
-
border-radius: var(--hot-border-radius-medium);
|
|
74
|
-
background: transparent;
|
|
75
|
-
color: inherit;
|
|
76
|
-
cursor: pointer;
|
|
77
|
-
font-size: 1rem;
|
|
78
|
-
line-height: 1;
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
.announcement-dismiss:hover {
|
|
82
|
-
background: rgba(0, 0, 0, 0.06);
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
.announcement-dismiss:focus-visible {
|
|
86
|
-
outline: 2px solid var(--hot-color-primary-500);
|
|
87
|
-
outline-offset: 2px;
|
|
88
|
-
}
|
|
89
|
-
`,s([a({type:String})],e.prototype,"version",1),s([a({type:String})],e.prototype,"title",1),s([a({type:String})],e.prototype,"message",1),s([a({type:String})],e.prototype,"variant",1),s([a({type:String,attribute:"dismiss-label"})],e.prototype,"dismissLabel",1),s([a({type:String,attribute:"storage-key"})],e.prototype,"storageKey",1),s([a({type:String})],e.prototype,"src",1),s([d()],e.prototype,"visible",2),s([d()],e.prototype,"startsAt",2),s([d()],e.prototype,"endsAt",2);var $=e;export{e as a,$ as b};
|