@triptease/tt-navbar 0.0.43 → 0.0.45
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/src/NavbarController.js +1 -1
- package/dist/src/NavbarController.js.map +1 -1
- package/dist/src/styles.js +5 -4
- package/dist/src/styles.js.map +1 -1
- package/dist/web/NavbarController.js +2 -2
- package/dist/web/NavbarController.js.map +2 -2
- package/dist/web/Routes.js +1 -1
- package/dist/web/TtNavbar.js +15 -11
- package/dist/web/TtNavbar.js.map +2 -2
- package/dist/web/global.d.js +1 -1
- package/dist/web/index.js +15 -11
- package/dist/web/index.js.map +2 -2
- package/dist/web/styles.js +6 -5
- package/dist/web/styles.js.map +2 -2
- package/dist/web/triptease-logo.js +1 -1
- package/dist/web/tt-navbar.js +15 -11
- package/dist/web/tt-navbar.js.map +2 -2
- package/dist/web/urlMappings.js +1 -1
- package/package.json +2 -2
- package/src/NavbarController.ts +1 -1
- package/src/styles.ts +5 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavbarController.js","sourceRoot":"","sources":["../../src/NavbarController.ts"],"names":[],"mappings":"AAGA,MAAM,OAAO,gBAAgB;IAS3B,YAAY,IAA4B;QANhC,YAAO,GAAG,IAAI,CAAC;QAEf,oBAAe,GAAG,KAAK,CAAC;QAK9B,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IACzC,CAAC;IAED,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAED,UAAU;QACR,IAAI,CAAC,IAAI,CAAC,eAAe,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;YAC1C,IAAI,CAAC,oBAAoB,GAAG,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;gBAC/D,MAAM,EAAE,IAAI,EAAE,GAAG,SAAS,CAAC;gBAC3B,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;oBAClC,MAAM,cAAc,GAClB,IAAI,CAAC,cAAc,EAAE,WAAW,EAAE,EAAE,EAAE,cAAc,CAAC;oBAEvD,IAAI,cAAc,KAAK,SAAS,EAAE,CAAC;wBACjC,IAAI,CAAC,OAAO,GAAG,cAAc,CAAC;wBAC9B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;oBAC5B,CAAC;oBAED,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;gBAC9B,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAC9B,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC9B,CAAC;IACH,CAAC;IAED,KAAK,CAAC,MAAM;QACV,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;QAE7B,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;YACjB,MAAM,
|
|
1
|
+
{"version":3,"file":"NavbarController.js","sourceRoot":"","sources":["../../src/NavbarController.ts"],"names":[],"mappings":"AAGA,MAAM,OAAO,gBAAgB;IAS3B,YAAY,IAA4B;QANhC,YAAO,GAAG,IAAI,CAAC;QAEf,oBAAe,GAAG,KAAK,CAAC;QAK9B,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IACzC,CAAC;IAED,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAED,UAAU;QACR,IAAI,CAAC,IAAI,CAAC,eAAe,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;YAC1C,IAAI,CAAC,oBAAoB,GAAG,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;gBAC/D,MAAM,EAAE,IAAI,EAAE,GAAG,SAAS,CAAC;gBAC3B,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;oBAClC,MAAM,cAAc,GAClB,IAAI,CAAC,cAAc,EAAE,WAAW,EAAE,EAAE,EAAE,cAAc,CAAC;oBAEvD,IAAI,cAAc,KAAK,SAAS,EAAE,CAAC;wBACjC,IAAI,CAAC,OAAO,GAAG,cAAc,CAAC;wBAC9B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;oBAC5B,CAAC;oBAED,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;gBAC9B,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAC9B,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC9B,CAAC;IACH,CAAC;IAED,KAAK,CAAC,MAAM;QACV,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;QAE7B,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;YACjB,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,MAAM,CAAC;gBACxB,cAAc,EAAE;oBACd,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,cAAc;oBACpC,WAAW,EAAE;wBACX,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,cAAc,EAAE,WAAW;wBACjD,EAAE,EAAE;4BACF,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,cAAc,EAAE,WAAW,EAAE,EAAE;4BACrD,cAAc,EAAE,IAAI,CAAC,MAAM;yBAC5B;qBACF;iBACF;aACF,CAAC,CAAC;QACL,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;IAC5B,CAAC;CACF","sourcesContent":["import { ReactiveController, ReactiveControllerHost } from 'lit';\nimport { UnsubscribeCallback } from '@clerk/types';\n\nexport class NavbarController implements ReactiveController {\n host: ReactiveControllerHost;\n\n private _isOpen = true;\n\n private _hasInitialized = false;\n\n private _removeClerkListener?: UnsubscribeCallback;\n\n constructor(host: ReactiveControllerHost) {\n (this.host = host).addController(this);\n }\n\n get isOpen() {\n return this._isOpen;\n }\n\n hostUpdate() {\n if (!this._hasInitialized && window.Clerk) {\n this._removeClerkListener = window.Clerk.addListener(resources => {\n const { user } = resources;\n if (user && !this._hasInitialized) {\n const navigationOpen =\n user.unsafeMetadata?.preferences?.ui?.navigationOpen;\n\n if (navigationOpen !== undefined) {\n this._isOpen = navigationOpen;\n this.host.requestUpdate();\n }\n\n this._hasInitialized = true;\n }\n });\n }\n }\n\n hostDisconnected() {\n if (this._removeClerkListener) {\n this._removeClerkListener();\n }\n }\n\n async toggle() {\n this._isOpen = !this._isOpen;\n\n if (window.Clerk) {\n window.Clerk.user?.update({\n unsafeMetadata: {\n ...window.Clerk.user?.unsafeMetadata,\n preferences: {\n ...window.Clerk.user?.unsafeMetadata?.preferences,\n ui: {\n ...window.Clerk.user?.unsafeMetadata?.preferences?.ui,\n navigationOpen: this.isOpen,\n },\n },\n },\n });\n }\n\n this.host.requestUpdate();\n }\n}\n"]}
|
package/dist/src/styles.js
CHANGED
|
@@ -29,6 +29,7 @@ export const styles = css `
|
|
|
29
29
|
}
|
|
30
30
|
|
|
31
31
|
nav {
|
|
32
|
+
--menu-font-size: var(--font-size-200);
|
|
32
33
|
max-width: var(--nav-bar-width);
|
|
33
34
|
width: var(--nav-bar-width);
|
|
34
35
|
min-height: 100vh;
|
|
@@ -98,7 +99,7 @@ export const styles = css `
|
|
|
98
99
|
width: 100%;
|
|
99
100
|
|
|
100
101
|
.external-link {
|
|
101
|
-
font-size: var(--font-size
|
|
102
|
+
font-size: var(--menu-font-size);
|
|
102
103
|
line-height: var(--font-line-height-100);
|
|
103
104
|
|
|
104
105
|
.icon {
|
|
@@ -131,7 +132,7 @@ export const styles = css `
|
|
|
131
132
|
|
|
132
133
|
.nav-item {
|
|
133
134
|
display: flex;
|
|
134
|
-
font-size: var(--font-size
|
|
135
|
+
font-size: var(--menu-font-size);
|
|
135
136
|
line-height: var(--font-line-height-100);
|
|
136
137
|
gap: var(--space-scale-1-5);
|
|
137
138
|
border-radius: var(--border-radius-100);
|
|
@@ -155,7 +156,7 @@ export const styles = css `
|
|
|
155
156
|
border-radius: var(--border-radius-100);
|
|
156
157
|
|
|
157
158
|
summary {
|
|
158
|
-
font-size: var(--font-size
|
|
159
|
+
font-size: var(--menu-font-size);
|
|
159
160
|
line-height: var(--font-line-height-100);
|
|
160
161
|
position: relative;
|
|
161
162
|
display: flex;
|
|
@@ -216,7 +217,7 @@ export const styles = css `
|
|
|
216
217
|
padding-top: 10px;
|
|
217
218
|
padding-bottom: 10px;
|
|
218
219
|
color: var(--color-text-inverted-400);
|
|
219
|
-
font-size: var(--font-size
|
|
220
|
+
font-size: var(--menu-font-size);
|
|
220
221
|
line-height: var(--font-line-height-100);
|
|
221
222
|
text-decoration: none;
|
|
222
223
|
|
package/dist/src/styles.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;CAW5B,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;CAW5B,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UA0Cf,iBAAiB;;;;UAIjB,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UA6DjB,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmQ1B,CAAC","sourcesContent":["import { css } from 'lit';\n\nconst visuallyHiddenCss = css`\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n border: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n white-space: nowrap;\n`;\n\nexport const styles = css`\n :host {\n --nav-bar-width: 260px;\n\n display: block;\n height: 100vh;\n }\n\n :host:has(.sidebar-closed) {\n --nav-bar-width: fit-content;\n }\n\n\n * {\n box-sizing: border-box;\n }\n\n nav {\n --menu-font-size: var(--font-size-200);\n max-width: var(--nav-bar-width);\n width: var(--nav-bar-width);\n min-height: 100vh;\n height: max-content;\n display: flex;\n align-items: start;\n gap: var(--space-scale-3-5);\n flex-direction: column;\n background-color: var(--color-surface-inverted-100);\n color: var(--color-text-inverted-400);\n padding-top: var(--space-scale-2);\n padding-bottom: var(--space-scale-2);\n z-index: 1;\n\n .nav-items {\n display: flex;\n flex-direction: column;\n padding: 0 var(--space-scale-1);\n width: 100%;\n }\n\n .nav-items.sidebar-closed {\n a span {\n ${visuallyHiddenCss}\n }\n\n details summary span {\n ${visuallyHiddenCss}\n }\n }\n\n .sidebar-header {\n width: 100%;\n display: grid;\n grid-template-columns: 1fr auto;\n align-items: center;\n justify-content: center;\n padding: 0 var(--space-scale-2);\n\n button {\n background-color: transparent;\n color: var(--color-text-inverted-400);\n border: none;\n }\n }\n\n .sidebar-header.sidebar-closed {\n padding: 0 var(--space-scale-1);\n .logo {\n display: none;\n visibility: hidden;\n }\n }\n\n hr {\n width: 100%;\n height: 1px;\n background-color: var(--color-surface-inverted-200);\n border: none;\n }\n\n .tertiary-nav {\n display: flex;\n flex-direction: column;\n margin-top: auto;\n gap: var(--space-scale-2);\n width: 100%;\n\n .external-link {\n font-size: var(--menu-font-size);\n line-height: var(--font-line-height-100);\n\n .icon {\n width: var(--space-scale-2);\n height: var(--space-scale-2);\n }\n }\n }\n\n .tertiary-nav.sidebar-closed {\n .external-link,\n hr,\n #client-selector {\n display: none;\n visibility: hidden;\n }\n\n a span {\n ${visuallyHiddenCss}\n }\n }\n\n .icon {\n display: flex;\n align-items: center;\n width: var(--space-scale-3);\n height: var(--space-scale-3);\n color: var(--nav-item-color);\n }\n\n .nav-item {\n display: flex;\n font-size: var(--menu-font-size);\n line-height: var(--font-line-height-100);\n gap: var(--space-scale-1-5);\n border-radius: var(--border-radius-100);\n color: var(--nav-item-color);\n align-items: center;\n padding: var(--space-scale-1);\n width: 100%;\n text-decoration: none;\n }\n }\n\n nav.sidebar-closed {\n width: fit-content;\n\n :host {\n --nav-bar-width: fit-content;\n }\n }\n\n details {\n border-radius: var(--border-radius-100);\n\n summary {\n font-size: var(--menu-font-size);\n line-height: var(--font-line-height-100);\n position: relative;\n display: flex;\n align-items: baseline;\n\n &::marker {\n content: '';\n }\n }\n\n .chevron {\n margin-left: auto;\n margin-right: var(--space-scale-1);\n width: var(--space-scale-2);\n }\n\n &[open] .chevron svg {\n transform: rotate(180deg);\n }\n\n .dropdown-items {\n display: flex;\n flex-direction: column;\n }\n }\n\n details > summary {\n display: flex;\n gap: var(--space-scale-1-5);\n padding: var(--space-scale-1);\n border-radius: var(--border-radius-100);\n color: var(--nav-item-color);\n align-items: center;\n\n a {\n color: var(--nav-item-color);\n }\n\n &:hover,\n &:focus-visible {\n background-color: var(--color-surface-inverted-200);\n border-radius: var(--border-radius-100);\n text-decoration: none;\n }\n }\n\n .sidebar-closed details:has(.current-page) > summary {\n --nav-item-color: var(--color-primary-400);\n border-radius: var(--border-radius-100);\n background-color: var(--color-primary-100);\n color: var(--nav-item-color);\n }\n\n .sub-nav-item {\n width: 100%;\n display: flex;\n padding-left: 44px;\n padding-top: 10px;\n padding-bottom: 10px;\n color: var(--color-text-inverted-400);\n font-size: var(--menu-font-size);\n line-height: var(--font-line-height-100);\n text-decoration: none;\n\n button {\n color: var(--color-text-inverted-400);\n padding: 0;\n }\n }\n\n .sub-nav-item:hover,\n .sub-nav-item:focus-visible,\n .nav-item:hover,\n .nav-item:focus-visible {\n background-color: var(--color-surface-inverted-200);\n border-radius: var(--border-radius-100);\n text-decoration: none;\n color: var(--color-text-inverted-400);\n\n .icon {\n color: var(--color-text-inverted-400);\n }\n }\n\n .current-page {\n --nav-item-color: var(--color-primary-400);\n border-radius: var(--border-radius-100);\n background-color: var(--color-primary-100);\n color: var(--nav-item-color);\n }\n\n .link-page {\n display: flex;\n position: absolute;\n overflow: auto;\n flex-direction: column;\n gap: var(--space-scale-4);\n padding: var(--space-scale-5);\n left: var(--nav-bar-width);\n background-color: var(--color-surface-200);\n width: calc(100% - var(--nav-bar-width));\n height: 100%;\n transition-property: left, visibility;\n transition-duration: 700ms, 400ms;\n transition-timing-function: ease-out, ease-in;\n\n &.hidden {\n left: -100%;\n visibility: hidden;\n }\n }\n\n .link-page > .section {\n display: flex;\n flex-direction: column;\n gap: var(--space-scale-2);\n }\n\n .section > .links-container {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: var(--space-scale-3);\n overflow-y: auto;\n height: 100%;\n }\n\n .visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n border: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n white-space: nowrap;\n }\n\n .tooltip {\n position: absolute;\n display: flex;\n white-space: nowrap;\n align-items: center;\n gap: var(--space-scale-1);\n color: black;\n background-color: var(--color-surface-600);\n padding: var(--space-scale-1);\n z-index: 1000;\n border-radius: var(--border-radius-50);\n font-weight: var(--font-weight-medium);\n }\n\n .auth-container {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100vh;\n }\n\n .error-container {\n padding: 4rem 1rem 1rem;\n max-width: 1280px;\n margin-left: auto;\n margin-right: auto;\n }\n\n .error-stack {\n width: 100%;\n padding: 1rem;\n overflow-x: auto;\n }\n\n .fullscreen-iframe {\n width: 100%;\n height: 100vh;\n border: 0;\n }\n\n .nav-toggle-button {\n position: relative;\n }\n\n .nav-toggle-tooltip {\n left: 100%;\n top: 100%;\n visibility: hidden;\n opacity: 0;\n }\n\n .nav-toggle-button:hover .nav-toggle-tooltip {\n visibility: visible;\n opacity: 1;\n }\n\n #client-selector {\n display: flex;\n align-items: center;\n }\n\n #client-selector tt-combobox {\n --tt-combobox-color: var(--color-text-inverted-400);\n --tt-combobox-dropdown-color: var(--color-text-inverted-400);\n --tt-combobox-list-background-color: var(--color-surface-inverted-100);\n --tt-combobox-option-background-color-hover: var(--color-surface-inverted-200);\n --tt-combobox-placeholder-color: var(--color-text-inverted-300);\n --tt-combobox-background-color: var(--color-surface-inverted-100);\n --tt-combobox-hover-background-color: var(--color-surface-inverted-200);\n --tt-combobox-list-max-width: 80ch;\n --tt-combobox-min-width: 244px;\n --tt-combobox-max-width: 244px;\n --tt-combobox-option-selected-color: var(--color-text-inverted-500);\n }\n\n .single-client-name {\n height: 39px;\n padding: var(--space-scale-1); /* match tt-combobox height */\n font-size: var(--font-size-100);\n color: var(--color-text-inverted-400);\n }\n`;\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @triptease/tt-navbar v0.0.
|
|
2
|
+
* @triptease/tt-navbar v0.0.45
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
5
|
// src/NavbarController.ts
|
|
@@ -35,7 +35,7 @@ var NavbarController = class {
|
|
|
35
35
|
async toggle() {
|
|
36
36
|
this._isOpen = !this._isOpen;
|
|
37
37
|
if (window.Clerk) {
|
|
38
|
-
|
|
38
|
+
window.Clerk.user?.update({
|
|
39
39
|
unsafeMetadata: {
|
|
40
40
|
...window.Clerk.user?.unsafeMetadata,
|
|
41
41
|
preferences: {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/NavbarController.ts"],
|
|
4
|
-
"sourcesContent": ["import { ReactiveController, ReactiveControllerHost } from 'lit';\nimport { UnsubscribeCallback } from '@clerk/types';\n\nexport class NavbarController implements ReactiveController {\n host: ReactiveControllerHost;\n\n private _isOpen = true;\n\n private _hasInitialized = false;\n\n private _removeClerkListener?: UnsubscribeCallback;\n\n constructor(host: ReactiveControllerHost) {\n (this.host = host).addController(this);\n }\n\n get isOpen() {\n return this._isOpen;\n }\n\n hostUpdate() {\n if (!this._hasInitialized && window.Clerk) {\n this._removeClerkListener = window.Clerk.addListener(resources => {\n const { user } = resources;\n if (user && !this._hasInitialized) {\n const navigationOpen =\n user.unsafeMetadata?.preferences?.ui?.navigationOpen;\n\n if (navigationOpen !== undefined) {\n this._isOpen = navigationOpen;\n this.host.requestUpdate();\n }\n\n this._hasInitialized = true;\n }\n });\n }\n }\n\n hostDisconnected() {\n if (this._removeClerkListener) {\n this._removeClerkListener();\n }\n }\n\n async toggle() {\n this._isOpen = !this._isOpen;\n\n if (window.Clerk) {\n
|
|
5
|
-
"mappings": ";;;;;AAGO,IAAM,mBAAN,MAAqD;AAAA,EAS1D,YAAY,MAA8B;AAN1C,SAAQ,UAAU;AAElB,SAAQ,kBAAkB;AAKxB,KAAC,KAAK,OAAO,MAAM,cAAc,IAAI;AAAA,EACvC;AAAA,EAEA,IAAI,SAAS;AACX,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,aAAa;AACX,QAAI,CAAC,KAAK,mBAAmB,OAAO,OAAO;AACzC,WAAK,uBAAuB,OAAO,MAAM,YAAY,eAAa;AAChE,cAAM,EAAE,KAAK,IAAI;AACjB,YAAI,QAAQ,CAAC,KAAK,iBAAiB;AACjC,gBAAM,iBACJ,KAAK,gBAAgB,aAAa,IAAI;AAExC,cAAI,mBAAmB,QAAW;AAChC,iBAAK,UAAU;AACf,iBAAK,KAAK,cAAc;AAAA,UAC1B;AAEA,eAAK,kBAAkB;AAAA,QACzB;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEA,mBAAmB;AACjB,QAAI,KAAK,sBAAsB;AAC7B,WAAK,qBAAqB;AAAA,IAC5B;AAAA,EACF;AAAA,EAEA,MAAM,SAAS;AACb,SAAK,UAAU,CAAC,KAAK;AAErB,QAAI,OAAO,OAAO;AAChB,
|
|
4
|
+
"sourcesContent": ["import { ReactiveController, ReactiveControllerHost } from 'lit';\nimport { UnsubscribeCallback } from '@clerk/types';\n\nexport class NavbarController implements ReactiveController {\n host: ReactiveControllerHost;\n\n private _isOpen = true;\n\n private _hasInitialized = false;\n\n private _removeClerkListener?: UnsubscribeCallback;\n\n constructor(host: ReactiveControllerHost) {\n (this.host = host).addController(this);\n }\n\n get isOpen() {\n return this._isOpen;\n }\n\n hostUpdate() {\n if (!this._hasInitialized && window.Clerk) {\n this._removeClerkListener = window.Clerk.addListener(resources => {\n const { user } = resources;\n if (user && !this._hasInitialized) {\n const navigationOpen =\n user.unsafeMetadata?.preferences?.ui?.navigationOpen;\n\n if (navigationOpen !== undefined) {\n this._isOpen = navigationOpen;\n this.host.requestUpdate();\n }\n\n this._hasInitialized = true;\n }\n });\n }\n }\n\n hostDisconnected() {\n if (this._removeClerkListener) {\n this._removeClerkListener();\n }\n }\n\n async toggle() {\n this._isOpen = !this._isOpen;\n\n if (window.Clerk) {\n window.Clerk.user?.update({\n unsafeMetadata: {\n ...window.Clerk.user?.unsafeMetadata,\n preferences: {\n ...window.Clerk.user?.unsafeMetadata?.preferences,\n ui: {\n ...window.Clerk.user?.unsafeMetadata?.preferences?.ui,\n navigationOpen: this.isOpen,\n },\n },\n },\n });\n }\n\n this.host.requestUpdate();\n }\n}\n"],
|
|
5
|
+
"mappings": ";;;;;AAGO,IAAM,mBAAN,MAAqD;AAAA,EAS1D,YAAY,MAA8B;AAN1C,SAAQ,UAAU;AAElB,SAAQ,kBAAkB;AAKxB,KAAC,KAAK,OAAO,MAAM,cAAc,IAAI;AAAA,EACvC;AAAA,EAEA,IAAI,SAAS;AACX,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,aAAa;AACX,QAAI,CAAC,KAAK,mBAAmB,OAAO,OAAO;AACzC,WAAK,uBAAuB,OAAO,MAAM,YAAY,eAAa;AAChE,cAAM,EAAE,KAAK,IAAI;AACjB,YAAI,QAAQ,CAAC,KAAK,iBAAiB;AACjC,gBAAM,iBACJ,KAAK,gBAAgB,aAAa,IAAI;AAExC,cAAI,mBAAmB,QAAW;AAChC,iBAAK,UAAU;AACf,iBAAK,KAAK,cAAc;AAAA,UAC1B;AAEA,eAAK,kBAAkB;AAAA,QACzB;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEA,mBAAmB;AACjB,QAAI,KAAK,sBAAsB;AAC7B,WAAK,qBAAqB;AAAA,IAC5B;AAAA,EACF;AAAA,EAEA,MAAM,SAAS;AACb,SAAK,UAAU,CAAC,KAAK;AAErB,QAAI,OAAO,OAAO;AAChB,aAAO,MAAM,MAAM,OAAO;AAAA,QACxB,gBAAgB;AAAA,UACd,GAAG,OAAO,MAAM,MAAM;AAAA,UACtB,aAAa;AAAA,YACX,GAAG,OAAO,MAAM,MAAM,gBAAgB;AAAA,YACtC,IAAI;AAAA,cACF,GAAG,OAAO,MAAM,MAAM,gBAAgB,aAAa;AAAA,cACnD,gBAAgB,KAAK;AAAA,YACvB;AAAA,UACF;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAEA,SAAK,KAAK,cAAc;AAAA,EAC1B;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/web/Routes.js
CHANGED
package/dist/web/TtNavbar.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @triptease/tt-navbar v0.0.
|
|
2
|
+
* @triptease/tt-navbar v0.0.45
|
|
3
3
|
*/
|
|
4
4
|
var __defProp = Object.defineProperty;
|
|
5
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -1209,7 +1209,12 @@ var TtCombobox = class extends i4 {
|
|
|
1209
1209
|
this._selectAll = (event) => {
|
|
1210
1210
|
event.preventDefault();
|
|
1211
1211
|
event.stopPropagation();
|
|
1212
|
-
if (this.
|
|
1212
|
+
if (this._filter !== "" && this._isAllSelected) {
|
|
1213
|
+
const selectedVisibleValues = Array.from(this._selectedVisibleOptions).map((option) => option.dataset.value);
|
|
1214
|
+
this.value = this.value.filter((value) => !selectedVisibleValues.includes(value));
|
|
1215
|
+
} else if (this._filter !== "") {
|
|
1216
|
+
this.value = Array.from(/* @__PURE__ */ new Set([...this.value, ...Array.from(this._selectableVisibleOptions).map((option) => option.dataset.value)]));
|
|
1217
|
+
} else if (this.value.length === this._selectableOptions.length) {
|
|
1213
1218
|
this.value = [];
|
|
1214
1219
|
} else {
|
|
1215
1220
|
this.value = Array.from(this._selectableOptions).map((option) => option.dataset.value);
|
|
@@ -1463,9 +1468,7 @@ var TtCombobox = class extends i4 {
|
|
|
1463
1468
|
/>`;
|
|
1464
1469
|
}
|
|
1465
1470
|
_renderOption(option) {
|
|
1466
|
-
|
|
1467
|
-
return E;
|
|
1468
|
-
}
|
|
1471
|
+
const hidden = Boolean(this._filter !== "" && !option.value.toLowerCase().includes(this._filter) && !option.innerText.toLowerCase().includes(this._filter) || option.hidden);
|
|
1469
1472
|
const id = `${this.id}-option-${option.value}`;
|
|
1470
1473
|
const active = this._getActiveOptionId() === id;
|
|
1471
1474
|
const selected = Boolean(this.multiselect && option.selected);
|
|
@@ -1479,7 +1482,7 @@ var TtCombobox = class extends i4 {
|
|
|
1479
1482
|
@mousedown="${(event) => event.preventDefault()}"
|
|
1480
1483
|
data-value="${option.value}"
|
|
1481
1484
|
aria-disabled=${option.disabled}
|
|
1482
|
-
aria-hidden=${
|
|
1485
|
+
aria-hidden=${hidden || E}
|
|
1483
1486
|
data-deselectable=${!option.selected}
|
|
1484
1487
|
part="option"
|
|
1485
1488
|
>
|
|
@@ -1642,6 +1645,7 @@ var styles2 = i`
|
|
|
1642
1645
|
}
|
|
1643
1646
|
|
|
1644
1647
|
nav {
|
|
1648
|
+
--menu-font-size: var(--font-size-200);
|
|
1645
1649
|
max-width: var(--nav-bar-width);
|
|
1646
1650
|
width: var(--nav-bar-width);
|
|
1647
1651
|
min-height: 100vh;
|
|
@@ -1711,7 +1715,7 @@ var styles2 = i`
|
|
|
1711
1715
|
width: 100%;
|
|
1712
1716
|
|
|
1713
1717
|
.external-link {
|
|
1714
|
-
font-size: var(--font-size
|
|
1718
|
+
font-size: var(--menu-font-size);
|
|
1715
1719
|
line-height: var(--font-line-height-100);
|
|
1716
1720
|
|
|
1717
1721
|
.icon {
|
|
@@ -1744,7 +1748,7 @@ var styles2 = i`
|
|
|
1744
1748
|
|
|
1745
1749
|
.nav-item {
|
|
1746
1750
|
display: flex;
|
|
1747
|
-
font-size: var(--font-size
|
|
1751
|
+
font-size: var(--menu-font-size);
|
|
1748
1752
|
line-height: var(--font-line-height-100);
|
|
1749
1753
|
gap: var(--space-scale-1-5);
|
|
1750
1754
|
border-radius: var(--border-radius-100);
|
|
@@ -1768,7 +1772,7 @@ var styles2 = i`
|
|
|
1768
1772
|
border-radius: var(--border-radius-100);
|
|
1769
1773
|
|
|
1770
1774
|
summary {
|
|
1771
|
-
font-size: var(--font-size
|
|
1775
|
+
font-size: var(--menu-font-size);
|
|
1772
1776
|
line-height: var(--font-line-height-100);
|
|
1773
1777
|
position: relative;
|
|
1774
1778
|
display: flex;
|
|
@@ -1829,7 +1833,7 @@ var styles2 = i`
|
|
|
1829
1833
|
padding-top: 10px;
|
|
1830
1834
|
padding-bottom: 10px;
|
|
1831
1835
|
color: var(--color-text-inverted-400);
|
|
1832
|
-
font-size: var(--font-size
|
|
1836
|
+
font-size: var(--menu-font-size);
|
|
1833
1837
|
line-height: var(--font-line-height-100);
|
|
1834
1838
|
text-decoration: none;
|
|
1835
1839
|
|
|
@@ -2056,7 +2060,7 @@ var NavbarController = class {
|
|
|
2056
2060
|
async toggle() {
|
|
2057
2061
|
this._isOpen = !this._isOpen;
|
|
2058
2062
|
if (window.Clerk) {
|
|
2059
|
-
|
|
2063
|
+
window.Clerk.user?.update({
|
|
2060
2064
|
unsafeMetadata: {
|
|
2061
2065
|
...window.Clerk.user?.unsafeMetadata,
|
|
2062
2066
|
preferences: {
|