@hotosm/ui 0.8.0 → 0.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +0 -1
- package/dist/chunks/{chunk.MYCDEEQF.js → chunk.3FIEOVXD.js} +1 -1
- package/dist/chunks/{chunk.BMD7HOGS.js → chunk.3T33Y2BX.js} +29 -24
- package/dist/chunks/{chunk.F26WEVPO.js → chunk.6WYUOJRX.js} +53 -10
- package/dist/components/header/header.component.d.ts +30 -6
- package/dist/components/header/header.component.js +1 -1
- package/dist/components/header/header.js +1 -1
- package/dist/components/header/header.styles.d.ts +0 -1
- package/dist/components/header/header.styles.js +1 -1
- package/dist/hotosm-ui.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as u}from"./chunk.QABMDRWR.js";import{a as h,c as v}from"./chunk.N2W26RCT.js";function f(a){var t,e,r="";if(typeof a=="string"||typeof a=="number")r+=a;else if(typeof a=="object")if(Array.isArray(a)){var
|
|
1
|
+
import{a as u}from"./chunk.QABMDRWR.js";import{a as h,c as v}from"./chunk.N2W26RCT.js";function f(a){var t,e,r="";if(typeof a=="string"||typeof a=="number")r+=a;else if(typeof a=="object")if(Array.isArray(a)){var o=a.length;for(t=0;t<o;t++)a[t]&&(e=f(a[t]))&&(r&&(r+=" "),r+=e)}else for(e in a)a[e]&&(r&&(r+=" "),r+=e);return r}function x(){for(var a,t,e=0,r="",o=arguments.length;e<o;e++)(a=arguments[e])&&(t=f(a))&&(r&&(r+=" "),r+=t);return r}var b=a=>typeof a=="boolean"?`${a}`:a===0?"0":a,w=x,y=(a,t)=>e=>{var r;if((t==null?void 0:t.variants)==null)return w(a,e==null?void 0:e.class,e==null?void 0:e.className);let{variants:o,defaultVariants:d}=t,z=Object.keys(o).map(i=>{let n=e==null?void 0:e[i],s=d==null?void 0:d[i];if(n===null)return null;let l=b(n)||b(s);return o[i][l]}),g=e&&Object.entries(e).reduce((i,n)=>{let[s,l]=n;return l===void 0||(i[s]=l),i},{}),k=t==null||(r=t.compoundVariants)===null||r===void 0?void 0:r.reduce((i,n)=>{let c=n,{class:s,className:l}=c,j=v(c,["class","className"]);return Object.entries(j).every(V=>{let[p,m]=V;return Array.isArray(m)?m.includes(h(h({},d),g)[p]):h(h({},d),g)[p]===m})?[...i,s,l]:i},[]);return w(a,z,k,e==null?void 0:e.class,e==null?void 0:e.className)};var T=y("header",{variants:{size:{small:"header--size-small",medium:"header--size-medium",large:"header--size-large"}}}),D=u`
|
|
2
2
|
/* ================================================================
|
|
3
3
|
* Layout
|
|
4
4
|
* ================================================================ */
|
|
@@ -16,12 +16,8 @@ import{a as u}from"./chunk.QABMDRWR.js";import{a as h,c as v}from"./chunk.N2W26R
|
|
|
16
16
|
padding: var(--hot-spacing-2x-small) var(--hot-spacing-small);
|
|
17
17
|
}
|
|
18
18
|
|
|
19
|
-
.header.border-bottom {
|
|
20
|
-
border-bottom: var(--hot-spacing-3x-small) solid var(--hot-color-neutral-50);
|
|
21
|
-
}
|
|
22
|
-
|
|
23
19
|
/* ================================================================
|
|
24
|
-
* Top bar (tagline + external link)
|
|
20
|
+
* Top bar (tagline + external link) - hidden on "small" variant
|
|
25
21
|
* ================================================================ */
|
|
26
22
|
|
|
27
23
|
.header--top {
|
|
@@ -58,6 +54,35 @@ import{a as u}from"./chunk.QABMDRWR.js";import{a as h,c as v}from"./chunk.N2W26R
|
|
|
58
54
|
height: 0.65em;
|
|
59
55
|
}
|
|
60
56
|
|
|
57
|
+
/* On mobile: hide the tagline and show the short link text */
|
|
58
|
+
.header--top-link-short {
|
|
59
|
+
display: inline;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
.header--top-link-full {
|
|
63
|
+
display: none;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
@media (min-width: 769px) {
|
|
67
|
+
.header--top-link-short {
|
|
68
|
+
display: none;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.header--top-link-full {
|
|
72
|
+
display: inline;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.header--top-tagline {
|
|
76
|
+
display: inline;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
@media (max-width: 768px) {
|
|
81
|
+
.header--top-tagline {
|
|
82
|
+
display: none;
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
|
|
61
86
|
/* ================================================================
|
|
62
87
|
* Logo / title link
|
|
63
88
|
* ================================================================ */
|
|
@@ -167,6 +192,10 @@ import{a as u}from"./chunk.QABMDRWR.js";import{a as h,c as v}from"./chunk.N2W26R
|
|
|
167
192
|
justify-content: flex-start;
|
|
168
193
|
}
|
|
169
194
|
|
|
195
|
+
.header--nav-center .header--tab-group::part(nav) {
|
|
196
|
+
justify-content: center;
|
|
197
|
+
}
|
|
198
|
+
|
|
170
199
|
.header--tab::part(base) {
|
|
171
200
|
font-size: var(--hot-font-size-medium);
|
|
172
201
|
font-weight: var(--hot-font-weight-bold);
|
|
@@ -213,6 +242,20 @@ import{a as u}from"./chunk.QABMDRWR.js";import{a as h,c as v}from"./chunk.N2W26R
|
|
|
213
242
|
padding: 0.5rem;
|
|
214
243
|
}
|
|
215
244
|
|
|
245
|
+
/*
|
|
246
|
+
* When drawer is not explicitly enabled but tabs exist, show the
|
|
247
|
+
* hamburger only on mobile so users can still reach the nav items.
|
|
248
|
+
*/
|
|
249
|
+
.header--drawer-mobile-only {
|
|
250
|
+
display: inline-flex;
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
@media (min-width: 769px) {
|
|
254
|
+
.header--drawer-mobile-only {
|
|
255
|
+
display: none;
|
|
256
|
+
}
|
|
257
|
+
}
|
|
258
|
+
|
|
216
259
|
/* ================================================================
|
|
217
260
|
* User avatar + dropdown (shown when logged in)
|
|
218
261
|
* ================================================================ */
|
|
@@ -277,9 +320,9 @@ import{a as u}from"./chunk.QABMDRWR.js";import{a as h,c as v}from"./chunk.N2W26R
|
|
|
277
320
|
/* ================================================================
|
|
278
321
|
* Size variants
|
|
279
322
|
*
|
|
280
|
-
* small
|
|
281
|
-
* medium
|
|
282
|
-
* large
|
|
323
|
+
* small - compact toolbar (48 px)
|
|
324
|
+
* medium - standard header (60 px)
|
|
325
|
+
* large - prominent header (72 px)
|
|
283
326
|
*
|
|
284
327
|
* Each section scales: header height, logo, title, buttons, tabs.
|
|
285
328
|
* ================================================================ */
|
|
@@ -523,4 +566,4 @@ import{a as u}from"./chunk.QABMDRWR.js";import{a as h,c as v}from"./chunk.N2W26R
|
|
|
523
566
|
display: none;
|
|
524
567
|
}
|
|
525
568
|
}
|
|
526
|
-
`;export{T as a,
|
|
569
|
+
`;export{T as a,D as b};
|
|
@@ -32,8 +32,8 @@ export declare class Header extends LitElement {
|
|
|
32
32
|
}>;
|
|
33
33
|
/** Size of toolbar vertically. */
|
|
34
34
|
accessor size: sizes;
|
|
35
|
-
/**
|
|
36
|
-
accessor
|
|
35
|
+
/** Centre-align navigation tabs instead of the default left alignment. */
|
|
36
|
+
accessor tabsCenterAlign: boolean;
|
|
37
37
|
/** Index of the selected tab. */
|
|
38
38
|
accessor selectedTab: number;
|
|
39
39
|
/** Index of the active tab (0-based). Use this to control which tab is active for any number of tabs. */
|
|
@@ -51,9 +51,10 @@ export declare class Header extends LitElement {
|
|
|
51
51
|
/** Internal state for desktop nav scrolling */
|
|
52
52
|
private _navScrollAtStart;
|
|
53
53
|
private _navScrollAtEnd;
|
|
54
|
-
/**
|
|
55
|
-
private
|
|
54
|
+
/** Bound handler references for cleanup in disconnectedCallback */
|
|
55
|
+
private _boundLocationSync;
|
|
56
56
|
connectedCallback(): Promise<void>;
|
|
57
|
+
disconnectedCallback(): void;
|
|
57
58
|
protected firstUpdated(_changed: PropertyValues): void;
|
|
58
59
|
protected updated(changedProps: Map<string | number | symbol, unknown>): void;
|
|
59
60
|
selectTab(index: number): void;
|
|
@@ -61,13 +62,36 @@ export declare class Header extends LitElement {
|
|
|
61
62
|
private _updateNavScrollState;
|
|
62
63
|
/** Scroll the desktop nav horizontally to reveal hidden items. */
|
|
63
64
|
private _scrollNav;
|
|
64
|
-
/**
|
|
65
|
-
|
|
65
|
+
/**
|
|
66
|
+
* Match the active tab to the current browser URL.
|
|
67
|
+
*
|
|
68
|
+
* Works automatically for:
|
|
69
|
+
* - htmx navigation (listens for `htmx:pushedIntoHistory` and `popstate`)
|
|
70
|
+
* - SPA routers (intercepts `history.pushState` / `replaceState`)
|
|
71
|
+
* - Traditional page loads (runs on `firstUpdated`)
|
|
72
|
+
*
|
|
73
|
+
* Host apps can also call this manually after programmatic navigation:
|
|
74
|
+
* `document.querySelector('hot-header').syncActiveTab();`
|
|
75
|
+
*/
|
|
76
|
+
syncActiveTab(): void;
|
|
77
|
+
/**
|
|
78
|
+
* Patch `history.pushState` and `history.replaceState` once globally
|
|
79
|
+
* so that every call dispatches a `hot-locationchange` event.
|
|
80
|
+
* Safe to call multiple times - the patch is applied only once.
|
|
81
|
+
*/
|
|
82
|
+
private static _historyPatched;
|
|
83
|
+
private static _patchHistory;
|
|
66
84
|
protected render(): import("lit").TemplateResult<1>;
|
|
67
85
|
private _tabClick;
|
|
68
86
|
private _handleTabShow;
|
|
69
87
|
private _handleLogin;
|
|
70
88
|
private _handleModalClose;
|
|
89
|
+
/**
|
|
90
|
+
* Should the drawer markup be rendered?
|
|
91
|
+
* True when `drawer` is explicitly set, or when there are nav tabs
|
|
92
|
+
* (so mobile users can still navigate via the sidebar).
|
|
93
|
+
*/
|
|
94
|
+
private get _showDrawer();
|
|
71
95
|
/** Derive a single uppercase letter from the user's name (fallback: "U"). */
|
|
72
96
|
private get _avatarInitial();
|
|
73
97
|
private _handleUserMenuSelect;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a,b}from"../../chunks/chunk.
|
|
1
|
+
import{a,b}from"../../chunks/chunk.3T33Y2BX.js";import"../../chunks/chunk.6WYUOJRX.js";import"../../chunks/chunk.KO4EOD3I.js";import"../../chunks/chunk.ZETV7TDG.js";import"../../chunks/chunk.QABMDRWR.js";import"../../chunks/chunk.N2W26RCT.js";export{a as Header,b as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a}from"../../chunks/chunk.
|
|
1
|
+
import{a}from"../../chunks/chunk.3FIEOVXD.js";import"../../chunks/chunk.3T33Y2BX.js";import"../../chunks/chunk.6WYUOJRX.js";import"../../chunks/chunk.KO4EOD3I.js";import"../../chunks/chunk.ZETV7TDG.js";import"../../chunks/chunk.QABMDRWR.js";import"../../chunks/chunk.N2W26RCT.js";export{a as default};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
export declare const headerVariants: (props?: ({
|
|
2
2
|
size?: "small" | "medium" | "large" | null | undefined;
|
|
3
|
-
borderBottom?: boolean | null | undefined;
|
|
4
3
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
4
|
export type sizes = "small" | "medium" | "large";
|
|
6
5
|
export declare const styles: import("lit").CSSResult;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a,b}from"../../chunks/chunk.
|
|
1
|
+
import{a,b}from"../../chunks/chunk.6WYUOJRX.js";import"../../chunks/chunk.QABMDRWR.js";import"../../chunks/chunk.N2W26RCT.js";export{a as headerVariants,b as styles};
|
package/dist/hotosm-ui.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as d}from"./chunks/chunk.N5KXL4J6.js";import{a as S}from"./chunks/chunk.5QY2VLMG.js";import"./chunks/chunk.P6GWPFCT.js";import"./chunks/chunk.LXN3PNAP.js";import{a as p}from"./chunks/chunk.JYPMFVPO.js";import"./chunks/chunk.FN6G7X23.js";import{a as m}from"./chunks/chunk.
|
|
1
|
+
import{a as d}from"./chunks/chunk.N5KXL4J6.js";import{a as S}from"./chunks/chunk.5QY2VLMG.js";import"./chunks/chunk.P6GWPFCT.js";import"./chunks/chunk.LXN3PNAP.js";import{a as p}from"./chunks/chunk.JYPMFVPO.js";import"./chunks/chunk.FN6G7X23.js";import{a as m}from"./chunks/chunk.3FIEOVXD.js";import"./chunks/chunk.3T33Y2BX.js";import"./chunks/chunk.6WYUOJRX.js";import"./chunks/chunk.R44PTHOJ.js";import"./chunks/chunk.ZKUACKKG.js";import{a as u}from"./chunks/chunk.M3LK72JN.js";import"./chunks/chunk.LVC64FO7.js";import"./chunks/chunk.KO4EOD3I.js";import"./chunks/chunk.ZGC6XD6L.js";import{a as h}from"./chunks/chunk.WELXILIP.js";import"./chunks/chunk.6JUW2IZJ.js";import{a as f}from"./chunks/chunk.IILWGAOM.js";import"./chunks/chunk.LKMWWUYT.js";import"./chunks/chunk.X354U5TL.js";import"./chunks/chunk.ZETV7TDG.js";import"./chunks/chunk.252GL6HT.js";import"./chunks/chunk.QABMDRWR.js";import"./chunks/chunk.N2W26RCT.js";function a(o,e=document){let t=[],r=e.querySelectorAll(o);return t.push(...Array.from(r)),e.querySelectorAll("*").forEach(i=>{i.shadowRoot&&t.push(...a(o,i.shadowRoot))}),t}function y(o){let{css:e,selector:t="wa-button",all:r=!0,styleId:s="hot-theme-injection"}=o;(r?a(t):[a(t)[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{u as Consent,h as FileInputDropzone,m as Header,f as ListCard,d as Logo,S as ToolMenu,p as Tracking,y as injectCSSIntoShadowDOM};
|