@luxfi/ui 8.2.7 → 8.2.8
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/3d-model-viewer.cjs +25 -421
- package/dist/3d-model-viewer.js +20 -416
- package/dist/accordion.cjs +3 -10
- package/dist/accordion.js +2 -10
- package/dist/advanced-navigation-bar.cjs +5 -401
- package/dist/advanced-navigation-bar.js +5 -401
- package/dist/ai-agents.cjs +45 -890
- package/dist/ai-agents.js +8 -834
- package/dist/ai-assistant.cjs +13 -740
- package/dist/ai-assistant.js +10 -738
- package/dist/ai-chat.cjs +24 -770
- package/dist/ai-chat.js +18 -765
- package/dist/ai-code.cjs +67 -923
- package/dist/ai-code.js +49 -905
- package/dist/ai-playground.cjs +25 -801
- package/dist/ai-playground.js +18 -795
- package/dist/ai-tools.cjs +22 -767
- package/dist/ai-tools.js +15 -761
- package/dist/ai-vision.cjs +41 -993
- package/dist/ai-vision.js +30 -983
- package/dist/ai-voice-settings.cjs +35 -1006
- package/dist/ai-voice-settings.js +32 -1004
- package/dist/ai-voice.cjs +51 -1024
- package/dist/ai-voice.js +9 -963
- package/dist/alert.cjs +11 -129
- package/dist/alert.js +8 -127
- package/dist/announcement.cjs +6 -402
- package/dist/announcement.js +6 -402
- package/dist/app-switcher-navigation-bar.cjs +5 -401
- package/dist/app-switcher-navigation-bar.js +5 -401
- package/dist/apple-cards-carousel.cjs +84 -480
- package/dist/apple-cards-carousel.js +19 -415
- package/dist/auth.cjs +10 -387
- package/dist/auth.js +7 -385
- package/dist/avatar.cjs +2 -9
- package/dist/avatar.js +2 -10
- package/dist/badge.cjs +8 -228
- package/dist/badge.js +5 -210
- package/dist/button.cjs +14 -67
- package/dist/button.js +12 -65
- package/dist/chrome.cjs +29 -493
- package/dist/chrome.js +9 -474
- package/dist/code-block.cjs +16 -664
- package/dist/code-block.js +13 -662
- package/dist/code-compare.cjs +28 -1302
- package/dist/code-compare.js +18 -1293
- package/dist/code-diff.cjs +21 -669
- package/dist/code-diff.js +17 -666
- package/dist/code-editor.cjs +13 -409
- package/dist/code-editor.js +12 -408
- package/dist/code-explorer.cjs +14 -456
- package/dist/code-explorer.js +13 -456
- package/dist/code-preview.cjs +31 -983
- package/dist/code-preview.js +23 -976
- package/dist/code-snippet.cjs +19 -667
- package/dist/code-snippet.js +14 -663
- package/dist/code-terminal.cjs +24 -485
- package/dist/code-terminal.js +19 -481
- package/dist/collapsible.cjs +13 -347
- package/dist/collapsible.js +11 -330
- package/dist/color-picker.cjs +8 -450
- package/dist/color-picker.js +7 -450
- package/dist/combobox.cjs +6 -402
- package/dist/combobox.js +6 -402
- package/dist/communication-navigation-bar.cjs +7 -403
- package/dist/communication-navigation-bar.js +5 -401
- package/dist/dashboard-navigation-bar.cjs +6 -402
- package/dist/dashboard-navigation-bar.js +5 -401
- package/dist/dialog-stack.cjs +5 -401
- package/dist/dialog-stack.js +5 -401
- package/dist/dialog.cjs +13 -70
- package/dist/dialog.js +13 -70
- package/dist/drawer.cjs +23 -99
- package/dist/drawer.js +19 -96
- package/dist/e-commerce-navigation-bar.cjs +7 -403
- package/dist/e-commerce-navigation-bar.js +5 -401
- package/dist/editor.cjs +9 -405
- package/dist/editor.js +6 -402
- package/dist/iam.cjs +2 -123
- package/dist/iam.js +1 -122
- package/dist/icon-button.cjs +2 -56
- package/dist/icon-button.js +1 -55
- package/dist/identity.cjs +28 -242
- package/dist/identity.js +20 -235
- package/dist/image-crop.cjs +10 -406
- package/dist/image-crop.js +7 -403
- package/dist/image.cjs +14 -83
- package/dist/image.js +13 -67
- package/dist/index.cjs +1868 -38770
- package/dist/index.js +174 -38320
- package/dist/input-group.cjs +3 -10
- package/dist/input-group.js +2 -10
- package/dist/item.cjs +2 -27
- package/dist/item.js +1 -22
- package/dist/kanban.cjs +25 -751
- package/dist/kanban.js +15 -742
- package/dist/limelight-nav.cjs +10 -452
- package/dist/limelight-nav.js +9 -452
- package/dist/link.cjs +11 -80
- package/dist/link.js +6 -60
- package/dist/lux.config.cjs +14 -32
- package/dist/lux.config.js +3 -26
- package/dist/menu.cjs +5 -13
- package/dist/menu.js +1 -9
- package/dist/message-dock.cjs +5 -401
- package/dist/message-dock.js +5 -401
- package/dist/mini-calendar.cjs +7 -403
- package/dist/mini-calendar.js +6 -402
- package/dist/music-player.cjs +30 -528
- package/dist/music-player.js +22 -520
- package/dist/next.cjs +8 -89
- package/dist/next.js +3 -86
- package/dist/popover.cjs +17 -74
- package/dist/popover.js +16 -73
- package/dist/progress-circle.cjs +3 -10
- package/dist/progress-circle.js +2 -10
- package/dist/provider.cjs +7 -176
- package/dist/provider.js +4 -174
- package/dist/select.cjs +36 -89
- package/dist/select.js +35 -88
- package/dist/sidebar.cjs +22 -493
- package/dist/sidebar.js +17 -489
- package/dist/site/commerce/ui/context.cjs +9 -214
- package/dist/site/commerce/ui/context.js +6 -215
- package/dist/site/components/analytics.cjs +2 -42
- package/dist/site/components/analytics.js +1 -37
- package/dist/site/components/auth/callback.cjs +2 -8
- package/dist/site/components/auth/callback.js +1 -7
- package/dist/site/components/auth/login-panel.cjs +15 -74
- package/dist/site/components/auth/login-panel.js +12 -73
- package/dist/site/components/auth/login.cjs +2 -6
- package/dist/site/components/auth/login.js +1 -5
- package/dist/site/components/auth/widget.cjs +2 -6
- package/dist/site/components/auth/widget.js +1 -5
- package/dist/site/components/commerce/bag-button.cjs +2 -3
- package/dist/site/components/commerce/bag-button.js +2 -3
- package/dist/site/components/commerce/buy-button.cjs +2 -11
- package/dist/site/components/commerce/buy-button.js +1 -10
- package/dist/site/components/commerce/checkout-button.cjs +2 -3
- package/dist/site/components/commerce/checkout-button.js +2 -3
- package/dist/site/components/commerce/checkout-panel/desktop-cp.cjs +15 -173
- package/dist/site/components/commerce/checkout-panel/desktop-cp.js +14 -174
- package/dist/site/components/commerce/checkout-panel/index.cjs +9 -400
- package/dist/site/components/commerce/checkout-panel/index.js +10 -403
- package/dist/site/components/commerce/checkout-panel/mobile-cp.cjs +15 -236
- package/dist/site/components/commerce/checkout-panel/mobile-cp.js +13 -237
- package/dist/site/components/commerce/desktop-bag-popup.cjs +7 -8
- package/dist/site/components/commerce/desktop-bag-popup.js +3 -8
- package/dist/site/components/commerce/drawer/index.cjs +15 -289
- package/dist/site/components/commerce/drawer/index.js +10 -290
- package/dist/site/components/commerce/drawer/micro.cjs +8 -115
- package/dist/site/components/commerce/drawer/micro.js +4 -115
- package/dist/site/components/commerce/drawer/shell.cjs +2 -10
- package/dist/site/components/commerce/drawer/shell.js +2 -10
- package/dist/site/components/contact-dialog/index.cjs +6 -69
- package/dist/site/components/contact-dialog/index.js +7 -71
- package/dist/site/components/drawer-margin.cjs +2 -10
- package/dist/site/components/drawer-margin.js +2 -10
- package/dist/site/components/footer.cjs +11 -81
- package/dist/site/components/footer.js +8 -80
- package/dist/site/components/header/desktop.cjs +18 -374
- package/dist/site/components/header/desktop.js +12 -355
- package/dist/site/components/header/index.cjs +9 -674
- package/dist/site/components/header/index.js +8 -657
- package/dist/site/components/header/mobile-bag-drawer.cjs +6 -71
- package/dist/site/components/header/mobile-bag-drawer.js +5 -74
- package/dist/site/components/header/mobile-nav-menu-ai.cjs +25 -28
- package/dist/site/components/header/mobile-nav-menu-ai.js +24 -27
- package/dist/site/components/header/mobile-nav-menu-item.cjs +6 -60
- package/dist/site/components/header/mobile-nav-menu-item.js +6 -61
- package/dist/site/components/header/mobile-nav-menu.cjs +7 -110
- package/dist/site/components/header/mobile-nav-menu.js +7 -112
- package/dist/site/components/header/mobile.cjs +48 -330
- package/dist/site/components/header/mobile.js +42 -330
- package/dist/site/components/icons/index.cjs +34 -35
- package/dist/site/components/icons/index.js +5 -33
- package/dist/site/components/index.cjs +118 -1961
- package/dist/site/components/index.js +23 -1951
- package/dist/site/components/mini-chart/index.cjs +7 -90
- package/dist/site/components/mini-chart/index.js +1 -92
- package/dist/site/components/mini-chart/wrapper.cjs +7 -76
- package/dist/site/components/mini-chart/wrapper.js +4 -77
- package/dist/site/components/not-found/index.cjs +9 -819
- package/dist/site/components/not-found/index.js +8 -802
- package/dist/site/components/security/index.cjs +9 -819
- package/dist/site/components/security/index.js +8 -802
- package/dist/site/next/analytics/index.cjs +16 -49
- package/dist/site/next/analytics/index.js +3 -49
- package/dist/site/next/analytics/pixel-analytics.cjs +23 -8
- package/dist/site/next/analytics/pixel-analytics.js +4 -8
- package/dist/site/next/index.cjs +13 -140
- package/dist/site/next/index.js +2 -140
- package/dist/site/root-layout/index.cjs +12 -1435
- package/dist/site/root-layout/index.css +0 -133
- package/dist/site/root-layout/index.js +12 -1416
- package/dist/site/site-def/footer/community.cjs +11 -27
- package/dist/site/site-def/footer/community.js +2 -18
- package/dist/site/site-def/footer/index.cjs +38 -218
- package/dist/site/site-def/footer/index.js +14 -215
- package/dist/site/site-def/index.cjs +28 -620
- package/dist/site/site-def/index.js +3 -624
- package/dist/table.cjs +20 -338
- package/dist/table.js +19 -338
- package/dist/tabs.cjs +3 -10
- package/dist/tabs.js +1 -9
- package/dist/tag.cjs +9 -270
- package/dist/tag.js +6 -268
- package/dist/tags.cjs +6 -314
- package/dist/tags.js +5 -314
- package/dist/textarea.cjs +4 -50
- package/dist/textarea.js +3 -49
- package/dist/tooltip.cjs +15 -34
- package/dist/tooltip.js +13 -33
- package/dist/vite.cjs +3 -82
- package/dist/vite.js +1 -80
- package/package.json +1 -1
- package/dist/index.css +0 -132
- package/dist/site/components/auth/login-panel.css +0 -4
- package/dist/site/components/commerce/bag-button.css +0 -4
- package/dist/site/components/commerce/checkout-button.css +0 -4
- package/dist/site/components/commerce/checkout-panel/desktop-cp.css +0 -132
- package/dist/site/components/commerce/checkout-panel/index.css +0 -132
- package/dist/site/components/commerce/checkout-panel/mobile-cp.css +0 -132
- package/dist/site/components/commerce/desktop-bag-popup.css +0 -4
- package/dist/site/components/commerce/drawer/index.css +0 -132
- package/dist/site/components/commerce/drawer/micro.css +0 -4
- package/dist/site/components/header/desktop.css +0 -4
- package/dist/site/components/header/index.css +0 -132
- package/dist/site/components/header/mobile-bag-drawer.css +0 -4
- package/dist/site/components/header/mobile-nav-menu-ai.css +0 -132
- package/dist/site/components/header/mobile-nav-menu-item.css +0 -132
- package/dist/site/components/header/mobile-nav-menu.css +0 -132
- package/dist/site/components/header/mobile.css +0 -132
- package/dist/site/components/icons/index.css +0 -4
- package/dist/site/components/index.css +0 -132
- package/dist/site/components/not-found/index.css +0 -132
- package/dist/site/components/security/index.css +0 -132
- package/dist/site/site-def/footer/community.css +0 -4
- package/dist/site/site-def/footer/index.css +0 -4
- package/dist/site/site-def/index.css +0 -4
|
@@ -4,1442 +4,19 @@
|
|
|
4
4
|
var primitives = require('@hanzo/ui/primitives');
|
|
5
5
|
var ui = require('@hanzo/ui');
|
|
6
6
|
var commerce = require('@hanzo/commerce');
|
|
7
|
-
var
|
|
8
|
-
var
|
|
9
|
-
var
|
|
10
|
-
var
|
|
11
|
-
var mobxReactLite = require('mobx-react-lite');
|
|
12
|
-
var usehooksTs = require('usehooks-ts');
|
|
13
|
-
var mobx = require('mobx');
|
|
14
|
-
var logo = require('@luxfi/logo');
|
|
15
|
-
var Link2 = require('next/link');
|
|
16
|
-
var react = require('@hanzo/iam/react');
|
|
17
|
-
var lucideReact = require('lucide-react');
|
|
18
|
-
var paths = require('@hanzo/iam/paths');
|
|
19
|
-
var google = require('@next/third-parties/google');
|
|
20
|
-
require('embla-carousel-autoplay');
|
|
7
|
+
var pixelAnalytics_js = require('../next/analytics/pixel-analytics.js');
|
|
8
|
+
var context_js = require('../commerce/ui/context.js');
|
|
9
|
+
var index_js = require('../components/index.js');
|
|
10
|
+
var CommerceDrawer = require('../components/commerce/drawer/index.js');
|
|
21
11
|
require('@hanzo/design/tokens/fonts.css');
|
|
22
12
|
require('@hanzo/ui/theme.css');
|
|
23
13
|
require('@hanzo/ui/styles.css');
|
|
14
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
24
15
|
|
|
25
16
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
26
17
|
|
|
27
|
-
|
|
28
|
-
if (e && e.__esModule) return e;
|
|
29
|
-
var n = Object.create(null);
|
|
30
|
-
if (e) {
|
|
31
|
-
Object.keys(e).forEach(function (k) {
|
|
32
|
-
if (k !== 'default') {
|
|
33
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
34
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
35
|
-
enumerable: true,
|
|
36
|
-
get: function () { return e[k]; }
|
|
37
|
-
});
|
|
38
|
-
}
|
|
39
|
-
});
|
|
40
|
-
}
|
|
41
|
-
n.default = e;
|
|
42
|
-
return Object.freeze(n);
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
var React7__namespace = /*#__PURE__*/_interopNamespace(React7);
|
|
46
|
-
var Script__default = /*#__PURE__*/_interopDefault(Script);
|
|
47
|
-
var Link2__default = /*#__PURE__*/_interopDefault(Link2);
|
|
18
|
+
var CommerceDrawer__default = /*#__PURE__*/_interopDefault(CommerceDrawer);
|
|
48
19
|
|
|
49
|
-
// src/site/next/analytics/fpixel.ts
|
|
50
|
-
var FB_PIXEL_ID = process.env.NEXT_PUBLIC_FACEBOOK_PIXEL_ID || "";
|
|
51
|
-
var pageview = () => {
|
|
52
|
-
window.fbq("track", "PageView");
|
|
53
|
-
};
|
|
54
|
-
var FacebookPixelHead = () => {
|
|
55
|
-
return /* @__PURE__ */ jsxRuntime.jsx("noscript", { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
56
|
-
"img",
|
|
57
|
-
{
|
|
58
|
-
height: "1",
|
|
59
|
-
width: "1",
|
|
60
|
-
style: { display: "none" },
|
|
61
|
-
src: `https://www.facebook.com/tr?id=${FB_PIXEL_ID}&ev=PageView&noscript=1`
|
|
62
|
-
}
|
|
63
|
-
) });
|
|
64
|
-
};
|
|
65
|
-
var FacebookPixel = () => {
|
|
66
|
-
const [loaded, setLoaded] = React7.useState(false);
|
|
67
|
-
const pathname = navigation.usePathname();
|
|
68
|
-
React7.useEffect(() => {
|
|
69
|
-
if (!loaded) return;
|
|
70
|
-
pageview();
|
|
71
|
-
}, [pathname, loaded]);
|
|
72
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
73
|
-
Script__default.default,
|
|
74
|
-
{
|
|
75
|
-
id: "fb-pixel",
|
|
76
|
-
strategy: "afterInteractive",
|
|
77
|
-
onLoad: () => setLoaded(true),
|
|
78
|
-
dangerouslySetInnerHTML: {
|
|
79
|
-
__html: `
|
|
80
|
-
!function(f,b,e,v,n,t,s)
|
|
81
|
-
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
|
|
82
|
-
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
|
|
83
|
-
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
|
|
84
|
-
n.queue=[];t=b.createElement(e);t.async=!0;
|
|
85
|
-
t.src=v;s=b.getElementsByTagName(e)[0];
|
|
86
|
-
s.parentNode.insertBefore(t,s)}(window, document,'script',
|
|
87
|
-
'https://connect.facebook.net/en_US/fbevents.js');
|
|
88
|
-
fbq('init', ${FB_PIXEL_ID});
|
|
89
|
-
`
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
) });
|
|
93
|
-
};
|
|
94
|
-
var log = (s) => {
|
|
95
|
-
{
|
|
96
|
-
console.log("COMMERCE_UI " + s);
|
|
97
|
-
}
|
|
98
|
-
};
|
|
99
|
-
var CommerceUIStore = class {
|
|
100
|
-
// points to either this._pointsConfig.md or this._pointsConfig.dt
|
|
101
|
-
constructor(s, conf) {
|
|
102
|
-
this._vHeight = 0;
|
|
103
|
-
this._routeChangedTime = 0;
|
|
104
|
-
this._currentSkuPath = void 0;
|
|
105
|
-
this._closedByUser = false;
|
|
106
|
-
this._checkingOut = void 0;
|
|
107
|
-
this._ignoreStateChange = false;
|
|
108
|
-
this._activePoint = null;
|
|
109
|
-
this._reactionDisposers = [];
|
|
110
|
-
this.initialize = () => {
|
|
111
|
-
this._reactionDisposers.push(mobx.reaction(
|
|
112
|
-
() => this.state,
|
|
113
|
-
(s) => {
|
|
114
|
-
if (this.ignoreStateChange) {
|
|
115
|
-
log(`STATE CHANGE to "${s}" (IGNORED)`);
|
|
116
|
-
this.setIgnoreStateChange(false);
|
|
117
|
-
return;
|
|
118
|
-
} else {
|
|
119
|
-
log(`STATE CHANGE to "${s}" (UI REACTED)`);
|
|
120
|
-
this._syncUIToState(s);
|
|
121
|
-
}
|
|
122
|
-
}
|
|
123
|
-
));
|
|
124
|
-
};
|
|
125
|
-
this.newRoute = () => {
|
|
126
|
-
this.setRouteChangedTime((/* @__PURE__ */ new Date()).getTime());
|
|
127
|
-
this.hideVariants();
|
|
128
|
-
this.setClosedByUser(false);
|
|
129
|
-
};
|
|
130
|
-
this.onActivePointChanged = (newPoint) => {
|
|
131
|
-
log("ON onActivePointChanged: " + newPoint);
|
|
132
|
-
if (newPoint === this._points.micro && this.activePoint === this._points.full) {
|
|
133
|
-
log("ON onActivePointChanged: to MICRO");
|
|
134
|
-
this.setIgnoreStateChange(true);
|
|
135
|
-
this.hideVariants();
|
|
136
|
-
} else if (newPoint === this._points.full && this.activePoint === this._points.micro) {
|
|
137
|
-
log("ON onActivePointChanged: to FULL");
|
|
138
|
-
this.setIgnoreStateChange(true);
|
|
139
|
-
this.showRecentVariants();
|
|
140
|
-
}
|
|
141
|
-
this.setActivePoint(newPoint);
|
|
142
|
-
};
|
|
143
|
-
this.showVariants = (skuPath) => {
|
|
144
|
-
this._service.setCurrentItem(void 0);
|
|
145
|
-
this._currentSkuPath = skuPath;
|
|
146
|
-
this._closedByUser = false;
|
|
147
|
-
};
|
|
148
|
-
this.showRecentVariants = () => {
|
|
149
|
-
const recentItemInfo = this._service.recentItem;
|
|
150
|
-
if (recentItemInfo) {
|
|
151
|
-
this._service.setCurrentItem(void 0);
|
|
152
|
-
this._currentSkuPath = recentItemInfo.item.sku;
|
|
153
|
-
this._closedByUser = false;
|
|
154
|
-
}
|
|
155
|
-
};
|
|
156
|
-
this.hideVariants = () => {
|
|
157
|
-
this._currentSkuPath = void 0;
|
|
158
|
-
};
|
|
159
|
-
this.setClosedByUser = (b) => {
|
|
160
|
-
this._closedByUser = b;
|
|
161
|
-
};
|
|
162
|
-
this.setIgnoreStateChange = (b) => {
|
|
163
|
-
this._ignoreStateChange = b;
|
|
164
|
-
};
|
|
165
|
-
this.setCheckingOut = (b) => {
|
|
166
|
-
this._checkingOut = b;
|
|
167
|
-
};
|
|
168
|
-
this.setActivePoint = (pt) => {
|
|
169
|
-
this._activePoint = pt;
|
|
170
|
-
};
|
|
171
|
-
this.setRouteChangedTime = (t) => {
|
|
172
|
-
this._routeChangedTime = t;
|
|
173
|
-
};
|
|
174
|
-
this._syncUIToState = (s) => {
|
|
175
|
-
log("_syncUIToState: " + s);
|
|
176
|
-
if (s === "micro") {
|
|
177
|
-
this.setActivePoint(this.points[0]);
|
|
178
|
-
} else if (s === "full") {
|
|
179
|
-
this.setActivePoint(this.points[this.points.length - 1]);
|
|
180
|
-
} else {
|
|
181
|
-
this.setActivePoint(null);
|
|
182
|
-
}
|
|
183
|
-
};
|
|
184
|
-
this.setMobile = (b) => {
|
|
185
|
-
log("setMobile: " + b);
|
|
186
|
-
this._points = b ? this._pointsConfig.mb : this._pointsConfig.dt;
|
|
187
|
-
};
|
|
188
|
-
this.setViewportHeight = (v) => {
|
|
189
|
-
this._vHeight = v;
|
|
190
|
-
};
|
|
191
|
-
this.dispose = () => {
|
|
192
|
-
this._reactionDisposers.forEach((d) => {
|
|
193
|
-
d();
|
|
194
|
-
});
|
|
195
|
-
};
|
|
196
|
-
this._service = s;
|
|
197
|
-
this._pointsConfig = conf;
|
|
198
|
-
this._points = this._pointsConfig.dt;
|
|
199
|
-
mobx.makeObservable(this, {
|
|
200
|
-
_currentSkuPath: mobx.observable,
|
|
201
|
-
_closedByUser: mobx.observable,
|
|
202
|
-
_checkingOut: mobx.observable,
|
|
203
|
-
_activePoint: mobx.observable,
|
|
204
|
-
_points: mobx.observableRef,
|
|
205
|
-
_vHeight: mobx.observable,
|
|
206
|
-
_routeChangedTime: mobx.observable,
|
|
207
|
-
showVariants: mobx.action,
|
|
208
|
-
showRecentVariants: mobx.action,
|
|
209
|
-
hideVariants: mobx.action,
|
|
210
|
-
setClosedByUser: mobx.action,
|
|
211
|
-
setCheckingOut: mobx.action,
|
|
212
|
-
setActivePoint: mobx.action,
|
|
213
|
-
setMobile: mobx.action,
|
|
214
|
-
setViewportHeight: mobx.action,
|
|
215
|
-
setRouteChangedTime: mobx.action,
|
|
216
|
-
activePoint: mobx.computed,
|
|
217
|
-
checkingOut: mobx.computed,
|
|
218
|
-
closedByUser: mobx.computed,
|
|
219
|
-
currentSkuPath: mobx.computed,
|
|
220
|
-
microHeight: mobx.computed,
|
|
221
|
-
modal: mobx.computed,
|
|
222
|
-
points: mobx.computed,
|
|
223
|
-
showRecent: mobx.computed,
|
|
224
|
-
showBuy: mobx.computed,
|
|
225
|
-
showCheckout: mobx.computed,
|
|
226
|
-
snapPointPx: mobx.computed,
|
|
227
|
-
state: mobx.computed,
|
|
228
|
-
open: mobx.computed
|
|
229
|
-
});
|
|
230
|
-
}
|
|
231
|
-
get currentSkuPath() {
|
|
232
|
-
return this._currentSkuPath;
|
|
233
|
-
}
|
|
234
|
-
get closedByUser() {
|
|
235
|
-
return this._closedByUser;
|
|
236
|
-
}
|
|
237
|
-
get ignoreStateChange() {
|
|
238
|
-
return this._ignoreStateChange;
|
|
239
|
-
}
|
|
240
|
-
get checkingOut() {
|
|
241
|
-
return this._checkingOut;
|
|
242
|
-
}
|
|
243
|
-
get activePoint() {
|
|
244
|
-
return this._activePoint;
|
|
245
|
-
}
|
|
246
|
-
get points() {
|
|
247
|
-
return [this._points.micro, this._points.full];
|
|
248
|
-
}
|
|
249
|
-
get open() {
|
|
250
|
-
log(
|
|
251
|
-
"open(): showCheckout: " + this.showCheckout + " showRecent: " + this.showRecent + " showBuy: " + this.showBuy
|
|
252
|
-
);
|
|
253
|
-
return this._checkingOut !== void 0 && !this._checkingOut && !this.closedByUser && (this.showCheckout || this.showRecent || this.showBuy);
|
|
254
|
-
}
|
|
255
|
-
get state() {
|
|
256
|
-
if (!this.closedByUser && !this._checkingOut) {
|
|
257
|
-
if (this.showBuy) {
|
|
258
|
-
return "full";
|
|
259
|
-
} else if (this.showRecent || this.showCheckout) {
|
|
260
|
-
return "micro";
|
|
261
|
-
}
|
|
262
|
-
}
|
|
263
|
-
return "closed";
|
|
264
|
-
}
|
|
265
|
-
get showRecent() {
|
|
266
|
-
const recentInfo = this._service.recentItem;
|
|
267
|
-
return !!recentInfo && recentInfo.modified > this._routeChangedTime;
|
|
268
|
-
}
|
|
269
|
-
get showBuy() {
|
|
270
|
-
return !!this.currentSkuPath;
|
|
271
|
-
}
|
|
272
|
-
get showCheckout() {
|
|
273
|
-
return !this._service.cartEmpty;
|
|
274
|
-
}
|
|
275
|
-
get modal() {
|
|
276
|
-
return this.state !== "micro";
|
|
277
|
-
}
|
|
278
|
-
get microHeight() {
|
|
279
|
-
return this._points.micro;
|
|
280
|
-
}
|
|
281
|
-
get isMobile() {
|
|
282
|
-
return this._pointsConfig.mb === this._points;
|
|
283
|
-
}
|
|
284
|
-
get snapPointPx() {
|
|
285
|
-
if (!this._activePoint || this._vHeight === 0) return 0;
|
|
286
|
-
if (typeof this._activePoint === "string") {
|
|
287
|
-
return parseInt(this._activePoint);
|
|
288
|
-
}
|
|
289
|
-
return this._vHeight * this._activePoint;
|
|
290
|
-
}
|
|
291
|
-
};
|
|
292
|
-
|
|
293
|
-
// src/site/commerce/ui/conf.ts
|
|
294
|
-
var conf_default = {
|
|
295
|
-
mb: {
|
|
296
|
-
micro: "72px",
|
|
297
|
-
full: "600px"
|
|
298
|
-
},
|
|
299
|
-
dt: {
|
|
300
|
-
micro: "90px",
|
|
301
|
-
full: "620px"
|
|
302
|
-
}
|
|
303
|
-
};
|
|
304
|
-
var DESKTOP_MIN = 768;
|
|
305
|
-
var log2 = (s) => {
|
|
306
|
-
};
|
|
307
|
-
mobxReactLite.enableStaticRendering(typeof window === "undefined");
|
|
308
|
-
var CommerceUIContext = React7.createContext(void 0);
|
|
309
|
-
var useCommerceDrawer = () => {
|
|
310
|
-
return React7.useContext(CommerceUIContext);
|
|
311
|
-
};
|
|
312
|
-
var useSelectAndBuy = () => {
|
|
313
|
-
return React7.useContext(CommerceUIContext);
|
|
314
|
-
};
|
|
315
|
-
var CommerceUIProvider = ({
|
|
316
|
-
children
|
|
317
|
-
}) => {
|
|
318
|
-
const cmmc = commerce.useCommerce();
|
|
319
|
-
const pathname = navigation.usePathname();
|
|
320
|
-
const storeRef = React7.useRef(new CommerceUIStore(cmmc, conf_default));
|
|
321
|
-
const prevPathRef = React7.useRef("initial");
|
|
322
|
-
const onResize = () => {
|
|
323
|
-
const width = window.innerWidth;
|
|
324
|
-
if (width < DESKTOP_MIN) {
|
|
325
|
-
if (!storeRef.current.isMobile) {
|
|
326
|
-
storeRef.current.setMobile(true);
|
|
327
|
-
}
|
|
328
|
-
} else if (storeRef.current.isMobile) {
|
|
329
|
-
storeRef.current.setMobile(false);
|
|
330
|
-
}
|
|
331
|
-
storeRef.current.setViewportHeight(window.innerHeight);
|
|
332
|
-
};
|
|
333
|
-
const onResize_debounced = usehooksTs.useDebounceCallback(onResize, 500);
|
|
334
|
-
React7.useLayoutEffect(() => {
|
|
335
|
-
storeRef.current.initialize();
|
|
336
|
-
onResize();
|
|
337
|
-
window.addEventListener("resize", onResize_debounced);
|
|
338
|
-
return () => {
|
|
339
|
-
window.removeEventListener("resize", onResize_debounced);
|
|
340
|
-
storeRef.current.dispose();
|
|
341
|
-
};
|
|
342
|
-
}, []);
|
|
343
|
-
React7.useEffect(() => {
|
|
344
|
-
const checkingOut = pathname === "/checkout";
|
|
345
|
-
log2("useEffect: prev pathname: " + prevPathRef.current);
|
|
346
|
-
if (storeRef.current.checkingOut === void 0 || storeRef.current._checkingOut !== checkingOut) {
|
|
347
|
-
storeRef.current.setCheckingOut(checkingOut);
|
|
348
|
-
}
|
|
349
|
-
if (prevPathRef.current === "initial") {
|
|
350
|
-
prevPathRef.current = pathname;
|
|
351
|
-
storeRef.current.newRoute();
|
|
352
|
-
} else if (!checkingOut && prevPathRef.current !== pathname) {
|
|
353
|
-
storeRef.current.newRoute();
|
|
354
|
-
prevPathRef.current = pathname;
|
|
355
|
-
log2("ROUTE CHANGE: " + pathname + ": " + storeRef.current._routeChangedTime);
|
|
356
|
-
}
|
|
357
|
-
}, [pathname]);
|
|
358
|
-
return /* @__PURE__ */ jsxRuntime.jsx(CommerceUIContext.Provider, { value: storeRef.current, children });
|
|
359
|
-
};
|
|
360
|
-
var ChatWidget = ({
|
|
361
|
-
title,
|
|
362
|
-
chatbotUrl,
|
|
363
|
-
subtitle,
|
|
364
|
-
question,
|
|
365
|
-
suggestedQuestions,
|
|
366
|
-
buttonClx = ""
|
|
367
|
-
}) => {
|
|
368
|
-
const [showChatbot, setShowChatbot] = React7__namespace.default.useState(false);
|
|
369
|
-
const onClick = () => {
|
|
370
|
-
setShowChatbot(!showChatbot);
|
|
371
|
-
};
|
|
372
|
-
const searchParams = new URLSearchParams();
|
|
373
|
-
if (question) {
|
|
374
|
-
searchParams.append("question", question);
|
|
375
|
-
}
|
|
376
|
-
if (suggestedQuestions) {
|
|
377
|
-
searchParams.append("sQuestions", suggestedQuestions.map(({ message }) => message).join(","));
|
|
378
|
-
searchParams.append("sHeadings", suggestedQuestions.map(({ heading }) => heading).join(","));
|
|
379
|
-
searchParams.append("sIcons", suggestedQuestions.map(({ icon }) => icon).join(","));
|
|
380
|
-
}
|
|
381
|
-
const iframeSrc = `${chatbotUrl}?${searchParams.toString()}`;
|
|
382
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
383
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "fixed bottom-0 sm:bottom-16 right-0 w-full h-full sm:max-w-[400px] sm:max-h-[550px] sm:px-4 z-floating " + (showChatbot ? "flex" : "hidden"), children: /* @__PURE__ */ jsxRuntime.jsxs(primitives.Card, { className: "flex flex-col h-full w-full", children: [
|
|
384
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex px-4 py-2 h-12 bg-level-0 items-center justify-between", children: [
|
|
385
|
-
/* @__PURE__ */ jsxRuntime.jsxs("h1", { className: "font-semibold font-heading", children: [
|
|
386
|
-
title,
|
|
387
|
-
" ",
|
|
388
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "opacity-60", children: subtitle })
|
|
389
|
-
] }),
|
|
390
|
-
/* @__PURE__ */ jsxRuntime.jsx(primitives.Button, { onClick, variant: "link", size: "icon", className: "w-fit sm:hidden", children: /* @__PURE__ */ jsxRuntime.jsx(logo.LuxLogo, { variant: "white", size: 24 }) })
|
|
391
|
-
] }),
|
|
392
|
-
/* @__PURE__ */ jsxRuntime.jsx("iframe", { src: iframeSrc, className: "h-full" })
|
|
393
|
-
] }) }),
|
|
394
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
395
|
-
ui.Box,
|
|
396
|
-
{
|
|
397
|
-
tag: "span",
|
|
398
|
-
onClick,
|
|
399
|
-
className: ui.cn(
|
|
400
|
-
// z-index should be below anything in commerce-iu (buy drawer and checkout widget)
|
|
401
|
-
"fixed bottom-5 right-[24px] md:z-floating z-16 cursor-pointer",
|
|
402
|
-
"hover:drop-shadow-[0_2px_6px_rgba(255,255,255,1)]",
|
|
403
|
-
"transition-transform",
|
|
404
|
-
showChatbot ? "rotate-180" : "",
|
|
405
|
-
buttonClx
|
|
406
|
-
),
|
|
407
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(logo.LuxLogo, { variant: "white", size: 28 })
|
|
408
|
-
}
|
|
409
|
-
)
|
|
410
|
-
] });
|
|
411
|
-
};
|
|
412
|
-
var chat_widget_default = ChatWidget;
|
|
413
|
-
var SIZE = {
|
|
414
|
-
xl: { mark: 40, word: 22, gap: "gap-4" },
|
|
415
|
-
lg: { mark: 40, word: 22, gap: "gap-4" },
|
|
416
|
-
md: { mark: 32, word: 18, gap: "gap-3" },
|
|
417
|
-
sm: { mark: 24, word: 13, gap: "gap-2" },
|
|
418
|
-
xs: { mark: 16, word: 9, gap: "gap-1.5" }
|
|
419
|
-
};
|
|
420
|
-
var Logo = ({
|
|
421
|
-
size = "md",
|
|
422
|
-
href,
|
|
423
|
-
// no default please!
|
|
424
|
-
outerClx = "",
|
|
425
|
-
variant = "full",
|
|
426
|
-
onClick
|
|
427
|
-
}) => {
|
|
428
|
-
const s = SIZE[size] ?? SIZE.md;
|
|
429
|
-
const clx = "flex flex-row items-center " + s.gap + " " + (href ? "hover:opacity-80 cursor-pointer " : "cursor-default ") + outerClx;
|
|
430
|
-
const art = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
431
|
-
variant !== "wordmark" && /* @__PURE__ */ jsxRuntime.jsx(logo.Logo, { variant: "white", size: s.mark }),
|
|
432
|
-
variant !== "mark" && /* @__PURE__ */ jsxRuntime.jsx(logo.Wordmark, { height: s.word })
|
|
433
|
-
] });
|
|
434
|
-
return href ? /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { href, style: ui.css(clx), onClick, children: art }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "span", className: clx, onClick, children: art });
|
|
435
|
-
};
|
|
436
|
-
|
|
437
|
-
// src/site/components/auth/resume.ts
|
|
438
|
-
var KEY = "lux-auth-resume";
|
|
439
|
-
var remember = () => {
|
|
440
|
-
sessionStorage.setItem(KEY, window.location.pathname + window.location.search);
|
|
441
|
-
};
|
|
442
|
-
var Widget = ({
|
|
443
|
-
noLogin = false,
|
|
444
|
-
handleLogin,
|
|
445
|
-
className
|
|
446
|
-
}) => {
|
|
447
|
-
const { isAuthenticated, isLoading, login, logout } = react.useIam();
|
|
448
|
-
const identity = react.useIamIdentity();
|
|
449
|
-
if (isLoading) {
|
|
450
|
-
return null;
|
|
451
|
-
}
|
|
452
|
-
if (!isAuthenticated) {
|
|
453
|
-
return noLogin ? null : /* @__PURE__ */ jsxRuntime.jsx(
|
|
454
|
-
primitives.Button,
|
|
455
|
-
{
|
|
456
|
-
variant: "primary",
|
|
457
|
-
className: ui.cn("h-8 w-fit !min-w-0", className),
|
|
458
|
-
onClick: handleLogin ?? (() => {
|
|
459
|
-
remember();
|
|
460
|
-
void login();
|
|
461
|
-
}),
|
|
462
|
-
children: "Login"
|
|
463
|
-
}
|
|
464
|
-
);
|
|
465
|
-
}
|
|
466
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(primitives.Popover, { children: [
|
|
467
|
-
/* @__PURE__ */ jsxRuntime.jsx(primitives.PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
468
|
-
primitives.Button,
|
|
469
|
-
{
|
|
470
|
-
variant: "outline",
|
|
471
|
-
size: "icon",
|
|
472
|
-
className: ui.cn("rounded-full text-muted border-2 border-muted bg-level-1 hover:bg-level-2 hover:border-foreground hover:text-foreground uppercase w-8 h-8", className),
|
|
473
|
-
children: identity?.initials
|
|
474
|
-
}
|
|
475
|
-
) }),
|
|
476
|
-
/* @__PURE__ */ jsxRuntime.jsx(primitives.PopoverContent, { className: "bg-level-0", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4", children: [
|
|
477
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2 truncate", children: [
|
|
478
|
-
/* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-medium leading-none truncate", children: identity?.name }),
|
|
479
|
-
identity?.email && identity.email !== identity.name && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm opacity-50 truncate", children: identity.email })
|
|
480
|
-
] }),
|
|
481
|
-
/* @__PURE__ */ jsxRuntime.jsx(primitives.Separator, {}),
|
|
482
|
-
/* @__PURE__ */ jsxRuntime.jsx(primitives.Button, { variant: "outline", onClick: () => {
|
|
483
|
-
logout();
|
|
484
|
-
}, children: "Logout" })
|
|
485
|
-
] }) })
|
|
486
|
-
] });
|
|
487
|
-
};
|
|
488
|
-
var AuthWidget = (props) => React7.useContext(react.IamContext) ? /* @__PURE__ */ jsxRuntime.jsx(Widget, { ...props }) : null;
|
|
489
|
-
var widget_default = AuthWidget;
|
|
490
|
-
var Avatar = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "17", height: "21", viewBox: "0 0 17 21", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
|
|
491
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8.66112 10.3544C6.14668 10.3544 4.32664 6.91073 4.32664 4.59206C4.32664 2.12213 6.27238 0.115723 8.66112 0.115723C11.0499 0.115723 12.9956 2.12514 12.9956 4.59206C12.9956 6.91398 11.1756 10.3544 8.66112 10.3544ZM8.66112 1.1542C6.82539 1.1542 5.33242 2.69703 5.33242 4.59185C5.33242 6.65402 6.94715 9.31553 8.66112 9.31553C10.3761 9.31553 11.9898 6.65387 11.9898 4.5925C11.9898 2.69668 10.4969 1.15398 8.66112 1.15398V1.1542Z", fill: "white" }),
|
|
492
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6.79776 11.3345H10.5242C13.7802 11.3345 16.4302 14.0712 16.4302 17.4338C16.4302 19.0831 15.1297 20.423 13.5356 20.423H3.78923C2.19216 20.423 0.894689 19.0831 0.894689 17.4338C0.893706 14.0712 3.54156 11.3345 6.79776 11.3345ZM3.78819 19.3844H13.5337C14.5749 19.3844 15.4225 18.509 15.4225 17.4338C15.4225 14.6453 13.2253 12.3731 10.5223 12.3731H6.79862C4.0956 12.3731 1.89839 14.6423 1.89839 17.4338C1.89937 18.509 2.74701 19.3844 3.78816 19.3844H3.78819Z", fill: "white" })
|
|
493
|
-
] });
|
|
494
|
-
var avatar_default = Avatar;
|
|
495
|
-
var BagIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "none", viewBox: "0 0 1019 1281", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m977.243 365.553h-175.407v-90.629c0-151.923-131.968-274.924-292.334-274.924-160.367 0-292.337 123.002-292.337 274.924v90.629h-175.4023c-23.3886 0-41.7627 17.051-41.7627 38.756v775.121c0 55.8 48.4456 100.76 108.582 100.76h801.84c60.138 0 108.578-44.96 108.578-100.76v-775.121c0-21.705-18.37-38.756-41.757-38.756zm-676.553-90.629c0-108.517 93.546-196.9408 208.812-196.9408 115.265 0 208.813 88.4218 208.813 196.9408v89.08h-417.625z", fill: "currentColor" }) });
|
|
496
|
-
var bag_icon_default = BagIcon;
|
|
497
|
-
|
|
498
|
-
// src/site/next/analytics/google-analytics.ts
|
|
499
|
-
var sendGAEvent = (name, options = {}) => {
|
|
500
|
-
window.gtag("event", name, options);
|
|
501
|
-
};
|
|
502
|
-
var DesktopBagPopup = ({
|
|
503
|
-
triggerClx = "",
|
|
504
|
-
popupClx = "",
|
|
505
|
-
trigger
|
|
506
|
-
}) => {
|
|
507
|
-
const cmmc = commerce.useCommerce();
|
|
508
|
-
const [bagOpen, setBagOpen] = React7.useState(false);
|
|
509
|
-
const router = navigation.useRouter();
|
|
510
|
-
React7.useEffect(() => {
|
|
511
|
-
if (bagOpen) {
|
|
512
|
-
sendGAEvent("view_cart", {
|
|
513
|
-
items: cmmc.cartItems.map((item) => ({
|
|
514
|
-
item_id: item.sku,
|
|
515
|
-
item_name: item.title,
|
|
516
|
-
item_category: item.familyId,
|
|
517
|
-
price: item.price,
|
|
518
|
-
quantity: item.quantity
|
|
519
|
-
})),
|
|
520
|
-
value: cmmc.cartTotal,
|
|
521
|
-
currency: "USD"
|
|
522
|
-
});
|
|
523
|
-
}
|
|
524
|
-
}, [bagOpen]);
|
|
525
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(primitives.Popover, { open: bagOpen, onOpenChange: setBagOpen, children: [
|
|
526
|
-
/* @__PURE__ */ jsxRuntime.jsx(primitives.PopoverTrigger, { className: triggerClx, children: trigger }),
|
|
527
|
-
/* @__PURE__ */ jsxRuntime.jsxs(primitives.PopoverContent, { sideOffset: 28, className: ui.cn("relative flex flex-col p-0 px-4 pb-4 pt-2", popupClx), children: [
|
|
528
|
-
/* @__PURE__ */ jsxRuntime.jsx(primitives.PopoverClose, { className: "absolute z-above-content right-2 top-2 self-end hover:bg-level-3 text-muted hover:text-accent p-1 rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-5 h-5" }) }),
|
|
529
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
530
|
-
commerce.CartPanel,
|
|
531
|
-
{
|
|
532
|
-
handleCheckout: () => {
|
|
533
|
-
router.push("/checkout");
|
|
534
|
-
},
|
|
535
|
-
className: "mt-4 mb-4 border-none py-0 px-4",
|
|
536
|
-
listClx: "rounded-sm pr-3",
|
|
537
|
-
scrollAfter: 5,
|
|
538
|
-
scrollHeightClx: "h-[70vh]",
|
|
539
|
-
itemClx: "mt-3",
|
|
540
|
-
totalClx: "sticky px-1 pr-2 -bottom-[1px] bg-level-1",
|
|
541
|
-
buttonClx: "max-w-[220px] flex-none",
|
|
542
|
-
children: [
|
|
543
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row items-center flex-none justify-center ", children: [
|
|
544
|
-
/* @__PURE__ */ jsxRuntime.jsx(bag_icon_default, { className: "mr-2 relative w-6 h-7 fill-foreground " }),
|
|
545
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-heading text-foreground text-default", children: "Your Bag" })
|
|
546
|
-
] }),
|
|
547
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-[1px] w-pr-80 bg-muted-3 mx-auto mt-1.5 flex-none" })
|
|
548
|
-
]
|
|
549
|
-
}
|
|
550
|
-
)
|
|
551
|
-
] })
|
|
552
|
-
] });
|
|
553
|
-
};
|
|
554
|
-
var desktop_bag_popup_default = DesktopBagPopup;
|
|
555
|
-
var BagButton = mobxReactLite.observer(({
|
|
556
|
-
showIfEmpty = false,
|
|
557
|
-
animateOnHover = true,
|
|
558
|
-
animateOnQuantityChange = true,
|
|
559
|
-
size = "default",
|
|
560
|
-
className = "",
|
|
561
|
-
iconClx = "",
|
|
562
|
-
onClick
|
|
563
|
-
}) => {
|
|
564
|
-
const c = commerce.useCommerce();
|
|
565
|
-
const wiggleRef = React7.useRef(mobx.observable.box("none"));
|
|
566
|
-
React7.useEffect(() => (
|
|
567
|
-
// return IReactionDisposer
|
|
568
|
-
animateOnQuantityChange && c ? mobx.reaction(
|
|
569
|
-
() => c.cartQuantity,
|
|
570
|
-
(curr, prev) => {
|
|
571
|
-
if (curr > prev) {
|
|
572
|
-
mobx.runInAction(() => {
|
|
573
|
-
wiggleRef.current.set("more");
|
|
574
|
-
});
|
|
575
|
-
} else {
|
|
576
|
-
mobx.runInAction(() => {
|
|
577
|
-
wiggleRef.current.set("less");
|
|
578
|
-
});
|
|
579
|
-
}
|
|
580
|
-
setTimeout(() => {
|
|
581
|
-
mobx.runInAction(() => {
|
|
582
|
-
wiggleRef.current.set("none");
|
|
583
|
-
});
|
|
584
|
-
}, 800);
|
|
585
|
-
}
|
|
586
|
-
) : void 0
|
|
587
|
-
), []);
|
|
588
|
-
if (!c || !showIfEmpty && c.cartEmpty) {
|
|
589
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", {});
|
|
590
|
-
}
|
|
591
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
592
|
-
ui.Box,
|
|
593
|
-
{
|
|
594
|
-
"aria-label": "Bag",
|
|
595
|
-
role: "button",
|
|
596
|
-
onClick,
|
|
597
|
-
className: ui.cn(
|
|
598
|
-
primitives.buttonVariants({ variant: "ghost", size }),
|
|
599
|
-
"rounded-md",
|
|
600
|
-
// Overides the bg change on hover --not a "hover effect"
|
|
601
|
-
"relative group p-0 aspect-square hover:bg-background",
|
|
602
|
-
wiggleRef.current.get() === "more" ? "item-added-to-cart-animation" : wiggleRef.current.get() === "less" ? "item-removed-from-cart-animation" : "",
|
|
603
|
-
className
|
|
604
|
-
),
|
|
605
|
-
children: [
|
|
606
|
-
!c.cartEmpty && /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: "z-above-content flex flex-col justify-center items-center absolute left-0 right-0 top-0 bottom-0 leading-none font-sans font-bold text-primary-fg text-xs ", children: [
|
|
607
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-[3px] w-full" }),
|
|
608
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { children: c.cartQuantity })
|
|
609
|
-
] }),
|
|
610
|
-
/* @__PURE__ */ jsxRuntime.jsx(bag_icon_default, { width: "24", height: "28", className: ui.cn(
|
|
611
|
-
"relative -top-[3px] fill-primary",
|
|
612
|
-
iconClx,
|
|
613
|
-
animateOnHover ? "group-hover:fill-primary-hover group-hover:scale-105 transition-scale transition-duration-300" : ""
|
|
614
|
-
), "aria-hidden": "true" })
|
|
615
|
-
]
|
|
616
|
-
}
|
|
617
|
-
);
|
|
618
|
-
});
|
|
619
|
-
var bag_button_default = BagButton;
|
|
620
|
-
var DesktopNav = ({ links, isMenuOpened, setIsMenuOpen }) => {
|
|
621
|
-
React7__namespace.useEffect(() => {
|
|
622
|
-
const preventScroll = (e) => {
|
|
623
|
-
e.preventDefault();
|
|
624
|
-
};
|
|
625
|
-
if (isMenuOpened) {
|
|
626
|
-
window.addEventListener("wheel", preventScroll, { passive: false });
|
|
627
|
-
window.addEventListener("touchmove", preventScroll, { passive: false });
|
|
628
|
-
window.addEventListener("keydown", preventScrollKeys, { passive: false });
|
|
629
|
-
} else {
|
|
630
|
-
window.removeEventListener("wheel", preventScroll);
|
|
631
|
-
window.removeEventListener("touchmove", preventScroll);
|
|
632
|
-
window.removeEventListener("keydown", preventScrollKeys);
|
|
633
|
-
}
|
|
634
|
-
return () => {
|
|
635
|
-
window.removeEventListener("wheel", preventScroll);
|
|
636
|
-
window.removeEventListener("touchmove", preventScroll);
|
|
637
|
-
window.removeEventListener("keydown", preventScrollKeys);
|
|
638
|
-
};
|
|
639
|
-
}, [isMenuOpened]);
|
|
640
|
-
const preventScrollKeys = (e) => {
|
|
641
|
-
if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", " "].includes(e.key)) {
|
|
642
|
-
e.preventDefault();
|
|
643
|
-
}
|
|
644
|
-
};
|
|
645
|
-
const handleMouseEnter = React7__namespace.useCallback(() => {
|
|
646
|
-
setIsMenuOpen(true);
|
|
647
|
-
}, [setIsMenuOpen]);
|
|
648
|
-
const handleMouseLeave = React7__namespace.useCallback(() => {
|
|
649
|
-
setIsMenuOpen(false);
|
|
650
|
-
}, [setIsMenuOpen]);
|
|
651
|
-
const handleContentMouseMove = () => {
|
|
652
|
-
setIsMenuOpen(false);
|
|
653
|
-
};
|
|
654
|
-
const menuHiddenClass = !isMenuOpened ? "invisible" : "";
|
|
655
|
-
return links.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(primitives.NavigationMenu, { children: /* @__PURE__ */ jsxRuntime.jsx(primitives.NavigationMenuList, { children: links.map((el, index) => /* @__PURE__ */ jsxRuntime.jsx(primitives.NavigationMenuItem, { className: "!m-0", children: el.isAIMenu ? /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { href: el.href, style: ui.css(ui.cn(primitives.navigationMenuTriggerStyle(), " text-muted-1 bg-transparent")), children: el.title }) : el.title === "Cards" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
656
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
657
|
-
primitives.NavigationMenuTrigger,
|
|
658
|
-
{
|
|
659
|
-
className: "text-muted-1 bg-transparent",
|
|
660
|
-
onMouseEnter: handleMouseEnter,
|
|
661
|
-
onFocus: handleMouseEnter,
|
|
662
|
-
onMouseLeave: handleMouseLeave,
|
|
663
|
-
onBlur: handleMouseLeave,
|
|
664
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { href: el.href, children: el.title })
|
|
665
|
-
}
|
|
666
|
-
),
|
|
667
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
668
|
-
primitives.NavigationMenuContent,
|
|
669
|
-
{
|
|
670
|
-
className: ui.cn("fixed left-0 top-14 pt-6 w-screen h-full border-0 !backdrop-blur-3xl bg-transparent mt-0", menuHiddenClass),
|
|
671
|
-
onMouseEnter: handleMouseEnter,
|
|
672
|
-
onMouseLeave: handleMouseLeave,
|
|
673
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center items-start", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
674
|
-
"div",
|
|
675
|
-
{
|
|
676
|
-
className: "grid xl:grid-cols-3 w-full justify-center max-w-[750px]",
|
|
677
|
-
onMouseLeave: handleContentMouseMove,
|
|
678
|
-
children: GroupChildMenu({ childs: el.childMenu, isCards: true })
|
|
679
|
-
}
|
|
680
|
-
) })
|
|
681
|
-
}
|
|
682
|
-
)
|
|
683
|
-
] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
684
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
685
|
-
primitives.NavigationMenuTrigger,
|
|
686
|
-
{
|
|
687
|
-
className: "text-muted-1 bg-transparent",
|
|
688
|
-
onMouseEnter: handleMouseEnter,
|
|
689
|
-
onFocus: handleMouseEnter,
|
|
690
|
-
onMouseLeave: handleMouseLeave,
|
|
691
|
-
onBlur: handleMouseLeave,
|
|
692
|
-
children: el.href && el.href !== "" ? /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { href: el.href, children: el.title }) : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: el.title })
|
|
693
|
-
}
|
|
694
|
-
),
|
|
695
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
696
|
-
primitives.NavigationMenuContent,
|
|
697
|
-
{
|
|
698
|
-
className: ui.cn("fixed left-0 top-14 pt-6 w-screen h-full border-0 !backdrop-blur-3xl bg-transparent mt-0", menuHiddenClass),
|
|
699
|
-
onMouseEnter: handleMouseEnter,
|
|
700
|
-
onMouseLeave: handleMouseLeave,
|
|
701
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
702
|
-
"div",
|
|
703
|
-
{
|
|
704
|
-
className: "flex flex-row w-full justify-center",
|
|
705
|
-
onMouseLeave: handleContentMouseMove,
|
|
706
|
-
children: GroupChildMenu({ childs: el.childMenu })
|
|
707
|
-
}
|
|
708
|
-
)
|
|
709
|
-
}
|
|
710
|
-
)
|
|
711
|
-
] }) }, index)) }) }) : null;
|
|
712
|
-
};
|
|
713
|
-
var desktop_nav_menu_default = DesktopNav;
|
|
714
|
-
var ListItem = React7__namespace.forwardRef(({ className, title, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(primitives.NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
715
|
-
ui.Box,
|
|
716
|
-
{
|
|
717
|
-
tag: "a",
|
|
718
|
-
ref,
|
|
719
|
-
className: ui.cn(
|
|
720
|
-
"block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:text-accent-foreground focus:bg-level-1 focus:text-accent-foreground text-muted-1 hover:text-primary hover:bg-transparent duration-1000 ease-in-out",
|
|
721
|
-
className
|
|
722
|
-
),
|
|
723
|
-
...props,
|
|
724
|
-
children: [
|
|
725
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium leading-none", children: title }),
|
|
726
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "line-clamp-3 text-sm leading-snug text-muted-1", children })
|
|
727
|
-
]
|
|
728
|
-
}
|
|
729
|
-
) }) }, title));
|
|
730
|
-
ListItem.displayName = "ListItem";
|
|
731
|
-
var GroupChildMenu = (params) => {
|
|
732
|
-
const { childs, isCards = false } = params;
|
|
733
|
-
if (!childs) {
|
|
734
|
-
return null;
|
|
735
|
-
}
|
|
736
|
-
const groupedChildMenus = childs.reduce((grouped, childLink) => {
|
|
737
|
-
if (childLink.groupName) {
|
|
738
|
-
grouped[childLink.groupName] = grouped[childLink.groupName] || [];
|
|
739
|
-
grouped[childLink.groupName].push(childLink);
|
|
740
|
-
}
|
|
741
|
-
return grouped;
|
|
742
|
-
}, {});
|
|
743
|
-
const getChildExtraClass = (index) => {
|
|
744
|
-
if (isCards && (index === 3 || index === 4)) {
|
|
745
|
-
return "xl:-mt-32";
|
|
746
|
-
}
|
|
747
|
-
return "";
|
|
748
|
-
};
|
|
749
|
-
return Object.entries(groupedChildMenus).map(([groupName, childLinks], index) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: ui.cn("py-4 px-4 ", getChildExtraClass(index)), children: [
|
|
750
|
-
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-muted-1", children: groupName }),
|
|
751
|
-
/* @__PURE__ */ jsxRuntime.jsx("ul", { className: "w-[200px] gap-3 md:w-[250px] lg:w-[250px]", children: childLinks.map((link) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-start items-center", children: [
|
|
752
|
-
link.icon,
|
|
753
|
-
/* @__PURE__ */ jsxRuntime.jsx(ListItem, { title: link.title, href: link.href, className: "ml-[14px]", children: link.contents }, link.title)
|
|
754
|
-
] }, link.title)) })
|
|
755
|
-
] }, groupName));
|
|
756
|
-
};
|
|
757
|
-
var DesktopHeader = ({
|
|
758
|
-
links,
|
|
759
|
-
className = "",
|
|
760
|
-
noAuth = false,
|
|
761
|
-
noCommerce = false,
|
|
762
|
-
children,
|
|
763
|
-
logoVariant = "full"
|
|
764
|
-
}) => {
|
|
765
|
-
const [isMenuOpened, setIsMenuOpen] = React7__namespace.default.useState(false);
|
|
766
|
-
return /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "header", id: "DESKTOP_HEADER", className: ui.cn(
|
|
767
|
-
"bg-[rgba(0, 0, 0, 0.5)] !backdrop-blur-3xl fixed z-header top-0 left-0 right-0",
|
|
768
|
-
className,
|
|
769
|
-
isMenuOpened ? " h-full" : ""
|
|
770
|
-
), children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: "flex flex-row h-[80px] items-center justify-between mx-[24px] w-full max-w-screen", children: [
|
|
771
|
-
/* @__PURE__ */ jsxRuntime.jsx(Logo, { size: logoVariant === "mark" ? "lg" : "md", href: "/", outerClx: "hidden lg:flex", variant: logoVariant }, "two"),
|
|
772
|
-
/* @__PURE__ */ jsxRuntime.jsx(Logo, { size: "sm", href: "/", outerClx: "hidden md:flex lg:hidden", variant: logoVariant }, "one"),
|
|
773
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full gap-4 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(desktop_nav_menu_default, { links, isMenuOpened, setIsMenuOpen }) }),
|
|
774
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
|
|
775
|
-
!noCommerce && /* @__PURE__ */ jsxRuntime.jsx(desktop_bag_popup_default, { popupClx: "w-[340px]", trigger: /* @__PURE__ */ jsxRuntime.jsx(bag_button_default, { className: "text-primary -mr-[3px] lg:min-w-0" }) }),
|
|
776
|
-
!noAuth && /* @__PURE__ */ jsxRuntime.jsx(widget_default, {}),
|
|
777
|
-
children
|
|
778
|
-
] })
|
|
779
|
-
] }) });
|
|
780
|
-
};
|
|
781
|
-
var desktop_default = DesktopHeader;
|
|
782
|
-
var Login = ({
|
|
783
|
-
className,
|
|
784
|
-
onSuccess
|
|
785
|
-
}) => {
|
|
786
|
-
const { config } = react.useIam();
|
|
787
|
-
const [state] = React7.useState(() => crypto.randomUUID());
|
|
788
|
-
React7.useEffect(remember, []);
|
|
789
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
790
|
-
react.Login,
|
|
791
|
-
{
|
|
792
|
-
serverUrl: config.serverUrl,
|
|
793
|
-
clientId: config.clientId,
|
|
794
|
-
redirectUri: config.redirectUri,
|
|
795
|
-
organization: config.organization,
|
|
796
|
-
state,
|
|
797
|
-
className: ui.cn("hanzo-iam-card", className),
|
|
798
|
-
onSuccess
|
|
799
|
-
}
|
|
800
|
-
);
|
|
801
|
-
};
|
|
802
|
-
var login_default = Login;
|
|
803
|
-
var MobileMenuToggleButton = ({
|
|
804
|
-
open: open2,
|
|
805
|
-
setOpen,
|
|
806
|
-
className = ""
|
|
807
|
-
}) => {
|
|
808
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
809
|
-
primitives.Button,
|
|
810
|
-
{
|
|
811
|
-
variant: "ghost",
|
|
812
|
-
size: "default",
|
|
813
|
-
className: ui.cn("rounded-full", ui.cn("p-0 aspect-square hover:bg-background sm:hover:bg-level-1 active:scale-75", className)),
|
|
814
|
-
onClick: () => {
|
|
815
|
-
setOpen(!open2);
|
|
816
|
-
},
|
|
817
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { width: 28, height: 28, style: ui.css(
|
|
818
|
-
"block h-full will-change-transform transition-transform transition-scale transition-duration-[1500] " + (open2 ? "rotate-[135deg] scale-110" : "rotate-none")
|
|
819
|
-
) })
|
|
820
|
-
}
|
|
821
|
-
);
|
|
822
|
-
};
|
|
823
|
-
var mobile_menu_toggle_button_default = MobileMenuToggleButton;
|
|
824
|
-
var MobileBagDrawer = ({
|
|
825
|
-
open: open2,
|
|
826
|
-
setOpen,
|
|
827
|
-
handleCheckout,
|
|
828
|
-
className = ""
|
|
829
|
-
}) => {
|
|
830
|
-
return /* @__PURE__ */ jsxRuntime.jsx(primitives.Drawer, { open: open2, onOpenChange: setOpen, children: /* @__PURE__ */ jsxRuntime.jsx(primitives.DrawerContent, { className: ui.cn("rounded-t-xl mt-6 pb-12 h-auto", className), children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
831
|
-
commerce.CartPanel,
|
|
832
|
-
{
|
|
833
|
-
handleCheckout,
|
|
834
|
-
className: "mt-4 mb-4 border-none py-0 px-4 w-full ",
|
|
835
|
-
listClx: "rounded-sm pr-3",
|
|
836
|
-
scrollAfter: 5,
|
|
837
|
-
itemClx: "mt-2",
|
|
838
|
-
totalClx: "sticky px-1 pr-2 border rounded-sm -bottom-[1px] bg-background",
|
|
839
|
-
buttonClx: "max-w-[220px] flex-none",
|
|
840
|
-
children: [
|
|
841
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row items-center flex-none justify-center ", children: [
|
|
842
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
843
|
-
bag_button_default,
|
|
844
|
-
{
|
|
845
|
-
animateOnHover: false,
|
|
846
|
-
showIfEmpty: true,
|
|
847
|
-
className: "mr-2 relative w-6 h-7",
|
|
848
|
-
iconClx: "fill-foreground "
|
|
849
|
-
}
|
|
850
|
-
),
|
|
851
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-heading text-foreground text-default", children: "Your Bag" })
|
|
852
|
-
] }),
|
|
853
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-[1px] w-pr-80 bg-muted-3 mx-auto mt-1.5 flex-none" })
|
|
854
|
-
]
|
|
855
|
-
}
|
|
856
|
-
) }) });
|
|
857
|
-
};
|
|
858
|
-
var mobile_bag_drawer_default = MobileBagDrawer;
|
|
859
|
-
var MobileNavMenuAI = ({ setMenuOpen }) => {
|
|
860
|
-
const [isOpen, setIsOpen] = React7.useState(false);
|
|
861
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
862
|
-
/* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: "w-full text-2xl cursor-pointer", children: [
|
|
863
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between", children: [
|
|
864
|
-
/* @__PURE__ */ jsxRuntime.jsx(Logo, { variant: "wordmark", size: "md", outerClx: "p-6 h-full" }),
|
|
865
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "span", className: ui.cn("grid", "block h-full aspect-square hover:bg-background sm:hover:bg-level-1 active:scale-75 text-foreground will-change-transform transition-transform transition-scale transition-duration-[1500] mt-6 mr-6 " + (!open ? "rotate-none" : "rotate-[135deg] scale-110")), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { width: 28, height: 28, style: ui.css("w-full h-full"), onClick: () => setMenuOpen(false) }) })
|
|
866
|
-
] }),
|
|
867
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "flex items-center gap-5 border-b border-[#3A3A3A] mt-4 rounded-full bg-muted-4 mx-6", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: "text-muted-1 font-bold flex-1 flex justify-between min-h-12 items-center px-2", onClick: () => setIsOpen(true), children: [
|
|
868
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base pl-2 font-light", children: "Ask AI a question" }),
|
|
869
|
-
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, {})
|
|
870
|
-
] }) })
|
|
871
|
-
] }),
|
|
872
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "fixed bottom-0 sm:bottom-16 right-0 w-full h-full sm:max-w-[400px] sm:max-h-[550px] sm:px-4 z-floating " + (isOpen ? "flex" : "hidden"), children: /* @__PURE__ */ jsxRuntime.jsxs(primitives.Card, { className: "flex flex-col h-full w-full", children: [
|
|
873
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex px-4 py-2 h-16 bg-level-0 items-center justify-between", children: [
|
|
874
|
-
/* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "font-semibold font-heading", children: [
|
|
875
|
-
"LUX",
|
|
876
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "opacity-60", children: "AI" })
|
|
877
|
-
] }),
|
|
878
|
-
/* @__PURE__ */ jsxRuntime.jsx(primitives.Button, { onClick: () => setIsOpen(false), variant: "link", size: "icon", className: "w-fit sm:hidden", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "w-6 h-6 flex-none mr-1 rotate-45 transition-transform" }) })
|
|
879
|
-
] }),
|
|
880
|
-
/* @__PURE__ */ jsxRuntime.jsx("iframe", { src: "https://lux.chat/iframe", className: "h-full" })
|
|
881
|
-
] }) })
|
|
882
|
-
] });
|
|
883
|
-
};
|
|
884
|
-
var mobile_nav_menu_ai_default = MobileNavMenuAI;
|
|
885
|
-
var MobileNav = ({
|
|
886
|
-
currentAs,
|
|
887
|
-
links,
|
|
888
|
-
setMenuState,
|
|
889
|
-
className = "",
|
|
890
|
-
commonItemClx,
|
|
891
|
-
setChatbotOpen,
|
|
892
|
-
setMenuOpen
|
|
893
|
-
}) => links.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: ui.cn("flex flex-col h-full", className), children: [
|
|
894
|
-
/* @__PURE__ */ jsxRuntime.jsx(mobile_nav_menu_ai_default, { setMenuOpen }),
|
|
895
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "flex flex-col flex-1 overflow-auto", children: /* @__PURE__ */ jsxRuntime.jsx(primitives.Accordion, { type: "single", collapsible: true, className: "w-full h-full", children: links.map((el, index) => {
|
|
896
|
-
const itemClx = commonItemClx ? typeof commonItemClx === "string" ? commonItemClx : commonItemClx(el) : "";
|
|
897
|
-
const variant = el.variant ?? "link";
|
|
898
|
-
let internalClx = variant === "link" ? " text-muted hover:text-foreground active:text-accent rounded-none" : " min-w-0";
|
|
899
|
-
if (currentAs && currentAs === el.href) {
|
|
900
|
-
internalClx += " pointer-events-none";
|
|
901
|
-
if (variant === "link") {
|
|
902
|
-
internalClx += " text-accent";
|
|
903
|
-
}
|
|
904
|
-
}
|
|
905
|
-
if (!el.isAIMenu) {
|
|
906
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(primitives.AccordionItem, { value: el.title ? el.title : "", className: "!no-underline !border-0 px-6", children: [
|
|
907
|
-
/* @__PURE__ */ jsxRuntime.jsxs(primitives.AccordionTrigger, { className: ui.cn(internalClx, itemClx, ""), children: [
|
|
908
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: ui.cn(internalClx, itemClx, "flex items-center justify-between w-full pl-3 text-base font-normal leading-6"), children: el.title }),
|
|
909
|
-
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { style: ui.css("w-4 h-4 mr-3") })
|
|
910
|
-
] }),
|
|
911
|
-
/* @__PURE__ */ jsxRuntime.jsx(primitives.AccordionContent, { children: el.childMenu && /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "px-4", children: Object.entries(el.childMenu.reduce((acc, child) => {
|
|
912
|
-
const group = acc[child.groupName ? child.groupName : ""] || [];
|
|
913
|
-
group.push(child);
|
|
914
|
-
acc[child.groupName ? child.groupName : ""] = group;
|
|
915
|
-
return acc;
|
|
916
|
-
}, {})).map(([groupName, children]) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
917
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "mt-4 mb-4 font-light text-muted-1", children: groupName }),
|
|
918
|
-
children.map((child, childIndex) => /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "m-2", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: "flex items-center py-1", children: [
|
|
919
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { children: child.icon && child.icon }),
|
|
920
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
921
|
-
Link2__default.default,
|
|
922
|
-
{
|
|
923
|
-
href: child.href,
|
|
924
|
-
target: child.newTab ? "_blank" : "_self",
|
|
925
|
-
rel: "noopener noreferrer",
|
|
926
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "span", className: "text-muted-2 hover:underline ml-5 hover:text-primary", children: child.title })
|
|
927
|
-
}
|
|
928
|
-
)
|
|
929
|
-
] }) }, childIndex))
|
|
930
|
-
] }, groupName)) }) })
|
|
931
|
-
] }, index);
|
|
932
|
-
}
|
|
933
|
-
}) }) }),
|
|
934
|
-
/* @__PURE__ */ jsxRuntime.jsx(widget_default, { className: "text-2xl z-10", handleLogin: () => {
|
|
935
|
-
setMenuState("login");
|
|
936
|
-
} })
|
|
937
|
-
] }) : null;
|
|
938
|
-
var mobile_nav_menu_default = MobileNav;
|
|
939
|
-
var bagClx = "mt-4 mb-8 border-none py-0 px-4 w-full sm:min-w-[350px] sm:max-w-[500px] sm:mx-auto min-h-[60vh] max-h-[70vh] sm:animate-in sm:zoom-in-90 ";
|
|
940
|
-
var MobileHeader = ({
|
|
941
|
-
currentAs,
|
|
942
|
-
links,
|
|
943
|
-
className = "",
|
|
944
|
-
setChatbotOpen,
|
|
945
|
-
noAuth = false,
|
|
946
|
-
// :aa TODO
|
|
947
|
-
noCommerce = false
|
|
948
|
-
// :aa TODO
|
|
949
|
-
}) => {
|
|
950
|
-
const cmmc = commerce.useCommerce();
|
|
951
|
-
const [menuState, setMenuState] = React7.useState("closed");
|
|
952
|
-
const [bagDrawerOpen, setBagDrawerOpen] = React7.useState(false);
|
|
953
|
-
const router = navigation.useRouter();
|
|
954
|
-
React7.useEffect(() => {
|
|
955
|
-
if (menuState === "bag" || bagDrawerOpen) {
|
|
956
|
-
sendGAEvent("view_cart", {
|
|
957
|
-
items: cmmc.cartItems.map((item) => ({
|
|
958
|
-
item_id: item.sku,
|
|
959
|
-
item_name: item.title,
|
|
960
|
-
item_category: item.familyId,
|
|
961
|
-
price: item.price,
|
|
962
|
-
quantity: item.quantity
|
|
963
|
-
})),
|
|
964
|
-
value: cmmc.cartTotal,
|
|
965
|
-
currency: "USD"
|
|
966
|
-
});
|
|
967
|
-
}
|
|
968
|
-
}, [menuState, bagDrawerOpen]);
|
|
969
|
-
const menuOpen = () => menuState !== "closed";
|
|
970
|
-
const onLoginChanged = (token) => {
|
|
971
|
-
if (!!token) {
|
|
972
|
-
setMenuState("nav");
|
|
973
|
-
}
|
|
974
|
-
};
|
|
975
|
-
const setMenuOpen = (open2) => {
|
|
976
|
-
if (!open2) {
|
|
977
|
-
setMenuState("closed");
|
|
978
|
-
} else {
|
|
979
|
-
setMenuState("nav");
|
|
980
|
-
}
|
|
981
|
-
};
|
|
982
|
-
const handleCheckout = () => {
|
|
983
|
-
setMenuState("closed");
|
|
984
|
-
setBagDrawerOpen(false);
|
|
985
|
-
router.push("/checkout");
|
|
986
|
-
};
|
|
987
|
-
const openBag = () => {
|
|
988
|
-
if (menuOpen()) {
|
|
989
|
-
setMenuState("bag");
|
|
990
|
-
} else {
|
|
991
|
-
setBagDrawerOpen(true);
|
|
992
|
-
}
|
|
993
|
-
};
|
|
994
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
995
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "header", id: "MOBILE_HEADER", className: ui.cn(
|
|
996
|
-
`bg-background fixed z-header top-0 left-0 w-full ${menuOpen() ? "hidden" : "block"}`,
|
|
997
|
-
className
|
|
998
|
-
), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full h-full flex flex-row justify-between items-center font-bold pr-5", children: [
|
|
999
|
-
/* @__PURE__ */ jsxRuntime.jsx(Logo, { href: "/", size: "md", outerClx: "p-6 h-full", variant: "wordmark" }),
|
|
1000
|
-
menuOpen() && /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "absolute left-0 top-0 bottom-0 right-0 pl-8 flex flex-row bg-background animate-mobile-menu-open", children: /* @__PURE__ */ jsxRuntime.jsx(avatar_default, { className: "self-center " }) }),
|
|
1001
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-0 flex-row", children: [
|
|
1002
|
-
/* @__PURE__ */ jsxRuntime.jsx(bag_button_default, { className: "text-primary -mr-[3px]", onClick: openBag }),
|
|
1003
|
-
/* @__PURE__ */ jsxRuntime.jsx(mobile_menu_toggle_button_default, { className: "text-foreground", open: menuOpen(), setOpen: setMenuOpen })
|
|
1004
|
-
] })
|
|
1005
|
-
] }) }),
|
|
1006
|
-
!noCommerce && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1007
|
-
mobile_bag_drawer_default,
|
|
1008
|
-
{
|
|
1009
|
-
className: "",
|
|
1010
|
-
open: bagDrawerOpen,
|
|
1011
|
-
setOpen: setBagDrawerOpen,
|
|
1012
|
-
handleCheckout
|
|
1013
|
-
}
|
|
1014
|
-
),
|
|
1015
|
-
menuOpen() && /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "fixed top-0 left-0 w-full h-full flex flex-column bg-background z-below-header animate-mobile-menu-open", children: !!!noAuth && menuState === "login" ? /* @__PURE__ */ jsxRuntime.jsx(login_default, { onSuccess: onLoginChanged, className: "sm:animate-in sm:zoom-in-90 m-auto w-full max-w-sm px-8" }) : !!!noCommerce && menuState === "bag" ? /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1016
|
-
commerce.CartPanel,
|
|
1017
|
-
{
|
|
1018
|
-
handleCheckout: () => {
|
|
1019
|
-
router.push("/checkout");
|
|
1020
|
-
},
|
|
1021
|
-
className: bagClx,
|
|
1022
|
-
listClx: "rounded-sm",
|
|
1023
|
-
scrollAfter: 6,
|
|
1024
|
-
scrollHeightClx: "h-[80vh]",
|
|
1025
|
-
itemClx: "mt-2",
|
|
1026
|
-
totalClx: "sticky px-1 pr-2 border rounded-sm -bottom-[1px] bg-level-1",
|
|
1027
|
-
buttonClx: "max-w-[220px] flex-none",
|
|
1028
|
-
children: [
|
|
1029
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row items-center flex-none justify-center ", children: [
|
|
1030
|
-
/* @__PURE__ */ jsxRuntime.jsx(bag_icon_default, { className: "mr-2 relative w-4 h-5 fill-foreground " }),
|
|
1031
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-heading text-foreground text-default", children: "Your Bag" })
|
|
1032
|
-
] }),
|
|
1033
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-[1px] w-pr-80 bg-muted-3 mx-auto mt-1.5 flex-none" })
|
|
1034
|
-
]
|
|
1035
|
-
}
|
|
1036
|
-
) : (
|
|
1037
|
-
/* menuState === 'nav' */
|
|
1038
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1039
|
-
mobile_nav_menu_default,
|
|
1040
|
-
{
|
|
1041
|
-
currentAs,
|
|
1042
|
-
links,
|
|
1043
|
-
className: "sm:animate-in sm:zoom-in-90 w-full",
|
|
1044
|
-
commonItemClx: "px-0 text-xl h-16 justify-start ",
|
|
1045
|
-
setMenuState,
|
|
1046
|
-
setChatbotOpen,
|
|
1047
|
-
setMenuOpen
|
|
1048
|
-
}
|
|
1049
|
-
)
|
|
1050
|
-
) })
|
|
1051
|
-
] });
|
|
1052
|
-
};
|
|
1053
|
-
var mobile_default = MobileHeader;
|
|
1054
|
-
var Header = ({
|
|
1055
|
-
siteDef,
|
|
1056
|
-
className = "",
|
|
1057
|
-
children,
|
|
1058
|
-
logoVariant = "full"
|
|
1059
|
-
}) => {
|
|
1060
|
-
const [open2, setOpen] = React7__namespace.default.useState(false);
|
|
1061
|
-
const { nav: { common, featured }, currentAs, noAuth, commerce } = siteDef;
|
|
1062
|
-
const links = featured ? [...common, ...featured] : common;
|
|
1063
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1064
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1065
|
-
desktop_default,
|
|
1066
|
-
{
|
|
1067
|
-
className: ui.cn(className, "hidden md:flex"),
|
|
1068
|
-
links,
|
|
1069
|
-
currentAs,
|
|
1070
|
-
noAuth,
|
|
1071
|
-
noCommerce: !!!commerce,
|
|
1072
|
-
logoVariant,
|
|
1073
|
-
children
|
|
1074
|
-
}
|
|
1075
|
-
),
|
|
1076
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1077
|
-
mobile_default,
|
|
1078
|
-
{
|
|
1079
|
-
className: ui.cn(className, "md:hidden"),
|
|
1080
|
-
links,
|
|
1081
|
-
currentAs,
|
|
1082
|
-
setChatbotOpen: setOpen,
|
|
1083
|
-
noAuth,
|
|
1084
|
-
noCommerce: !!!commerce
|
|
1085
|
-
}
|
|
1086
|
-
)
|
|
1087
|
-
] });
|
|
1088
|
-
};
|
|
1089
|
-
var header_default = Header;
|
|
1090
|
-
var ORG = "lux";
|
|
1091
|
-
var CALLBACK = "/auth/callback";
|
|
1092
|
-
var configure = (app) => ({
|
|
1093
|
-
serverUrl: paths.BRAND_SERVER_URLS[ORG],
|
|
1094
|
-
organization: ORG,
|
|
1095
|
-
clientId: `${ORG}-${app}`,
|
|
1096
|
-
/* Read per render rather than at module load: one bundle serves the real
|
|
1097
|
-
host and any preview of it, and each must redeem its code back to itself. */
|
|
1098
|
-
redirectUri: (typeof window === "undefined" ? "" : window.location.origin) + CALLBACK
|
|
1099
|
-
});
|
|
1100
|
-
var Auth = ({ app, children }) => /* @__PURE__ */ jsxRuntime.jsx(react.IamProvider, { config: configure(app), children });
|
|
1101
|
-
var provider_default = Auth;
|
|
1102
|
-
var CommerceDrawer = mobxReactLite.observer(({
|
|
1103
|
-
children,
|
|
1104
|
-
handleHandleClicked,
|
|
1105
|
-
drawerClx = "",
|
|
1106
|
-
...rest
|
|
1107
|
-
}) => {
|
|
1108
|
-
const drawer = useCommerceDrawer();
|
|
1109
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1110
|
-
primitives.Drawer,
|
|
1111
|
-
{
|
|
1112
|
-
open: drawer.open,
|
|
1113
|
-
onOpenChange: () => {
|
|
1114
|
-
},
|
|
1115
|
-
modal: drawer.modal,
|
|
1116
|
-
snapPoints: drawer.points,
|
|
1117
|
-
activeSnapPoint: drawer.activePoint,
|
|
1118
|
-
setActiveSnapPoint: drawer.onActivePointChanged.bind(drawer),
|
|
1119
|
-
fastDragSkipsToEnd: false,
|
|
1120
|
-
dragHandleOnly: true,
|
|
1121
|
-
handleHandleClicked,
|
|
1122
|
-
extendHandleDragRegion: false,
|
|
1123
|
-
...rest,
|
|
1124
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1125
|
-
primitives.DrawerContent,
|
|
1126
|
-
{
|
|
1127
|
-
defaultHandle: false,
|
|
1128
|
-
className: ui.cn(
|
|
1129
|
-
"border-0",
|
|
1130
|
-
drawer.isMobile ? "pt-5" : "pt-6",
|
|
1131
|
-
"w-full h-full"
|
|
1132
|
-
),
|
|
1133
|
-
onOpenAutoFocus: (e) => {
|
|
1134
|
-
e.preventDefault();
|
|
1135
|
-
},
|
|
1136
|
-
children: [
|
|
1137
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1138
|
-
primitives.DrawerHandle,
|
|
1139
|
-
{
|
|
1140
|
-
className: ui.cn(
|
|
1141
|
-
"absolute top-0 left-0 right-0 mx-auto z-10",
|
|
1142
|
-
"flex justify-center items-start",
|
|
1143
|
-
"border-t rounded-t-lg border-muted-3",
|
|
1144
|
-
drawer.isMobile ? "h-5 touch-pan-y" : "h-6"
|
|
1145
|
-
),
|
|
1146
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: ui.cn(
|
|
1147
|
-
// pseudo-handle
|
|
1148
|
-
"rounded-[3px] bg-level-3",
|
|
1149
|
-
drawer.isMobile ? "w-[155px] mt-[5px] h-1.5" : "w-[180px] mt-[3px] h-2.5 hover:bg-level-4",
|
|
1150
|
-
!drawer.isMobile ? "cursor-grab active:cursor-grabbing" : ""
|
|
1151
|
-
) })
|
|
1152
|
-
}
|
|
1153
|
-
),
|
|
1154
|
-
children
|
|
1155
|
-
]
|
|
1156
|
-
}
|
|
1157
|
-
)
|
|
1158
|
-
}
|
|
1159
|
-
);
|
|
1160
|
-
});
|
|
1161
|
-
var shell_default = CommerceDrawer;
|
|
1162
|
-
var IconAndQuantity = mobxReactLite.observer(({
|
|
1163
|
-
animateOnQuantityChange = false,
|
|
1164
|
-
showArrow = true,
|
|
1165
|
-
showQuantity = true,
|
|
1166
|
-
clx = "",
|
|
1167
|
-
iconClx = "",
|
|
1168
|
-
digitClx = ""
|
|
1169
|
-
}) => {
|
|
1170
|
-
const cmmc = commerce.useCommerce();
|
|
1171
|
-
const wiggleRef = React7.useRef(mobx.observable.box("none"));
|
|
1172
|
-
React7.useEffect(() => (
|
|
1173
|
-
// return IReactionDisposer
|
|
1174
|
-
animateOnQuantityChange ? mobx.reaction(
|
|
1175
|
-
() => cmmc.cartQuantity,
|
|
1176
|
-
(curr, prev) => {
|
|
1177
|
-
if (curr > prev) {
|
|
1178
|
-
mobx.runInAction(() => {
|
|
1179
|
-
wiggleRef.current.set("more");
|
|
1180
|
-
});
|
|
1181
|
-
} else {
|
|
1182
|
-
mobx.runInAction(() => {
|
|
1183
|
-
wiggleRef.current.set("less");
|
|
1184
|
-
});
|
|
1185
|
-
}
|
|
1186
|
-
setTimeout(() => {
|
|
1187
|
-
mobx.runInAction(() => {
|
|
1188
|
-
wiggleRef.current.set("none");
|
|
1189
|
-
});
|
|
1190
|
-
}, 800);
|
|
1191
|
-
}
|
|
1192
|
-
) : void 0
|
|
1193
|
-
), []);
|
|
1194
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: ui.cn("flex items-center justify-center", clx), children: [
|
|
1195
|
-
showQuantity && /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: ui.cn(
|
|
1196
|
-
"relative flex items-center justify-center mr-1",
|
|
1197
|
-
wiggleRef.current.get() === "more" ? "item-added-to-cart-animation" : wiggleRef.current.get() === "less" ? "item-removed-from-cart-animation" : ""
|
|
1198
|
-
), children: [
|
|
1199
|
-
cmmc.cartQuantity > 0 && /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: ui.cn(
|
|
1200
|
-
"z-above-content flex flex-col justify-center items-center",
|
|
1201
|
-
"absolute left-0 right-0 top-0 bottom-0",
|
|
1202
|
-
digitClx
|
|
1203
|
-
), children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
1204
|
-
/* color: 'white' tailwind bug? ,*/
|
|
1205
|
-
fontSize: "11px",
|
|
1206
|
-
position: "relative",
|
|
1207
|
-
top: "1px"
|
|
1208
|
-
}, children: cmmc.cartQuantity }) }),
|
|
1209
|
-
/* @__PURE__ */ jsxRuntime.jsx(bag_icon_default, { width: "19", height: "24", className: ui.cn("relative -top-[3px] opacity-70", iconClx), "aria-hidden": "true" })
|
|
1210
|
-
] }),
|
|
1211
|
-
showArrow && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "17px" }, children: "\u203A" })
|
|
1212
|
-
] });
|
|
1213
|
-
});
|
|
1214
|
-
var CheckoutButton = ({
|
|
1215
|
-
handleCheckout,
|
|
1216
|
-
variant = "primary",
|
|
1217
|
-
rounded = "lg",
|
|
1218
|
-
className,
|
|
1219
|
-
showQuantity = true,
|
|
1220
|
-
showArrow = true,
|
|
1221
|
-
animateOnQuantityChange = true,
|
|
1222
|
-
centerText = true,
|
|
1223
|
-
children,
|
|
1224
|
-
...rest
|
|
1225
|
-
}) => {
|
|
1226
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1227
|
-
primitives.Button,
|
|
1228
|
-
{
|
|
1229
|
-
...rest,
|
|
1230
|
-
onClick: handleCheckout,
|
|
1231
|
-
variant,
|
|
1232
|
-
className: ui.cn(`rounded-${rounded}`, ui.cn(
|
|
1233
|
-
"flex justify-between items-stretch group",
|
|
1234
|
-
showQuantity ? centerText ? "px-1.5" : "pl-2.5 pr-1.5" : "",
|
|
1235
|
-
className
|
|
1236
|
-
)),
|
|
1237
|
-
children: [
|
|
1238
|
-
centerText && // must scale this one too, as it effects layout
|
|
1239
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1240
|
-
IconAndQuantity,
|
|
1241
|
-
{
|
|
1242
|
-
showArrow,
|
|
1243
|
-
showQuantity,
|
|
1244
|
-
clx: "invisible group-hover:scale-105 transition-scale transition-duration-300"
|
|
1245
|
-
}
|
|
1246
|
-
),
|
|
1247
|
-
children ?? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center items-center", children: "Checkout" }),
|
|
1248
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1249
|
-
IconAndQuantity,
|
|
1250
|
-
{
|
|
1251
|
-
clx: "group-hover:scale-105 transition-scale transition-duration-300",
|
|
1252
|
-
animateOnQuantityChange,
|
|
1253
|
-
showArrow,
|
|
1254
|
-
showQuantity,
|
|
1255
|
-
iconClx: "fill-background",
|
|
1256
|
-
digitClx: "text-foreground group-hover:opacity-80 leading-none font-bold font-sans"
|
|
1257
|
-
}
|
|
1258
|
-
)
|
|
1259
|
-
]
|
|
1260
|
-
}
|
|
1261
|
-
);
|
|
1262
|
-
};
|
|
1263
|
-
var checkout_button_default = CheckoutButton;
|
|
1264
|
-
var CN = {
|
|
1265
|
-
// h: mind padding!
|
|
1266
|
-
mobile: { w: 36, h: 32 },
|
|
1267
|
-
sm: { w: 60, h: 34 },
|
|
1268
|
-
desktop: { w: 60, h: 32 }
|
|
1269
|
-
};
|
|
1270
|
-
var Info = ({
|
|
1271
|
-
item,
|
|
1272
|
-
clx = ""
|
|
1273
|
-
}) => {
|
|
1274
|
-
const cmmc = commerce.useCommerce();
|
|
1275
|
-
const family = cmmc.getFamilyById(item.familyId);
|
|
1276
|
-
let topLine = family.title;
|
|
1277
|
-
if (item.sku.startsWith("LXM-AG") || item.sku.startsWith("LXM-AU")) {
|
|
1278
|
-
topLine = family.parentTitle + ", " + family.title;
|
|
1279
|
-
}
|
|
1280
|
-
const optionLabel = item.optionLabelShort ?? item.optionLabel;
|
|
1281
|
-
const priceStr = commerce.formatCurrencyValue(item.price);
|
|
1282
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1283
|
-
/* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: ui.cn("sm:hidden flex flex-col !text-muted items-stretch whitespace-nowrap text-ellipsis ", clx), children: [
|
|
1284
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-left text-xs", children: topLine }),
|
|
1285
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between text-xxs", children: [
|
|
1286
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { children: optionLabel }),
|
|
1287
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "pl-2.5", children: priceStr })
|
|
1288
|
-
] })
|
|
1289
|
-
] }),
|
|
1290
|
-
/* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: ui.cn("hidden sm:flex !text-muted flex-col items-stretch whitespace-nowrap text-ellipsis text-xs", clx), children: [
|
|
1291
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-left", children: topLine }),
|
|
1292
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between", children: [
|
|
1293
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { children: optionLabel }),
|
|
1294
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "pl-2.5", children: priceStr })
|
|
1295
|
-
] })
|
|
1296
|
-
] })
|
|
1297
|
-
] });
|
|
1298
|
-
};
|
|
1299
|
-
var PROMPT_COMMON_CLX = "block absolute top-0 left-0 bg-transparent duration-400 transition-opacity";
|
|
1300
|
-
var Micro = mobxReactLite.observer(({
|
|
1301
|
-
clx = "",
|
|
1302
|
-
handleCheckout,
|
|
1303
|
-
handleItemClicked
|
|
1304
|
-
}) => {
|
|
1305
|
-
const drawer = useCommerceDrawer();
|
|
1306
|
-
const cmmc = commerce.useCommerce();
|
|
1307
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: ui.cn(
|
|
1308
|
-
drawer.showRecent ? "grid grid-cols-2" : "flex justify-center items-center ",
|
|
1309
|
-
drawer.showRecent ? drawer.isMobile ? "-mt-3" : "-mt-3" : "",
|
|
1310
|
-
"gap-2 md:gap-3 relative",
|
|
1311
|
-
clx
|
|
1312
|
-
), children: [
|
|
1313
|
-
drawer.showRecent && /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: "flex flex-col items-stretch " + (drawer.isMobile ? "justify-start" : "group"), children: [
|
|
1314
|
-
/* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { tag: "p", className: "relative text-muted text-xxs md:text-xs leading-none pl-1 self-start " + (drawer.isMobile ? "top-[3px]" : "top-[1px]"), children: [
|
|
1315
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "invisible", children: "scrictly for layout" }),
|
|
1316
|
-
drawer.isMobile ? /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "span", className: PROMPT_COMMON_CLX, children: "tap for options:" }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1317
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "span", className: PROMPT_COMMON_CLX + " group-hover:opacity-0", children: "recent item:" }),
|
|
1318
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "span", className: PROMPT_COMMON_CLX + " opacity-0 group-hover:opacity-100", children: "view options:" })
|
|
1319
|
-
] })
|
|
1320
|
-
] }),
|
|
1321
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1322
|
-
primitives.Button,
|
|
1323
|
-
{
|
|
1324
|
-
variant: "ghost",
|
|
1325
|
-
className: ui.cn(`rounded-${drawer.isMobile ? "md" : "lg"}`, ui.cn(
|
|
1326
|
-
"box-content",
|
|
1327
|
-
"flex flex-row justify-between items-center gap-1",
|
|
1328
|
-
"-ml-1.5",
|
|
1329
|
-
"overflow-hidden ",
|
|
1330
|
-
"px-1 md:px-2 py-[2px]",
|
|
1331
|
-
"border border-transparent group-hover:border-muted-3",
|
|
1332
|
-
"group-hover:!bg-transparent",
|
|
1333
|
-
"!min-w-0"
|
|
1334
|
-
)),
|
|
1335
|
-
size: drawer.isMobile ? "sm" : "default",
|
|
1336
|
-
onClick: handleItemClicked,
|
|
1337
|
-
children: [
|
|
1338
|
-
cmmc.recentItem?.item.img && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1339
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.MediaStack, { media: { img: cmmc.recentItem.item.img }, constrainTo: CN.mobile, className: "sm:hidden grow-0 shrink-0" }),
|
|
1340
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.MediaStack, { media: { img: cmmc.recentItem.item.img }, constrainTo: CN.sm, className: "hidden sm:block md:hidden grow-0 shrink-0" }),
|
|
1341
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.MediaStack, { media: { img: cmmc.recentItem.item.img }, constrainTo: CN.desktop, className: "hidden md:block grow-0 shrink-0" })
|
|
1342
|
-
] }),
|
|
1343
|
-
cmmc.recentItem && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grow w-full", children: /* @__PURE__ */ jsxRuntime.jsx(Info, { item: cmmc.recentItem.item, clx: "w-full" }) })
|
|
1344
|
-
]
|
|
1345
|
-
}
|
|
1346
|
-
)
|
|
1347
|
-
] }),
|
|
1348
|
-
drawer.showCheckout && /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: ui.cn(
|
|
1349
|
-
"flex flex-col w-full",
|
|
1350
|
-
drawer.showRecent ? "items-stretch" : "items-center",
|
|
1351
|
-
drawer.isMobile ? "justify-start" : "justify-center"
|
|
1352
|
-
), children: [
|
|
1353
|
-
drawer.showRecent && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "invisible text-muted text-xxs md:text-xs leading-none pl-1 self-start", children: "for layout" }),
|
|
1354
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1355
|
-
checkout_button_default,
|
|
1356
|
-
{
|
|
1357
|
-
handleCheckout,
|
|
1358
|
-
variant: "primary",
|
|
1359
|
-
size: drawer.isMobile ? "sm" : "lg",
|
|
1360
|
-
className: ui.cn(`rounded-${drawer.isMobile ? "md" : "lg"}`, ui.cn(
|
|
1361
|
-
drawer.isMobile ? drawer.showRecent ? "pl-3.5 pr-2.5" : "min-w-[320px]" : drawer.showRecent ? "" : "w-[320px]",
|
|
1362
|
-
"text-sm font-semibold"
|
|
1363
|
-
)),
|
|
1364
|
-
centerText: drawer.isMobile ? !drawer.showRecent : true
|
|
1365
|
-
}
|
|
1366
|
-
)
|
|
1367
|
-
] })
|
|
1368
|
-
] });
|
|
1369
|
-
});
|
|
1370
|
-
var micro_default = Micro;
|
|
1371
|
-
var CommerceUIComponent = mobxReactLite.observer(() => {
|
|
1372
|
-
const buy = useSelectAndBuy();
|
|
1373
|
-
const drawer = useCommerceDrawer();
|
|
1374
|
-
const router = navigation.useRouter();
|
|
1375
|
-
const handleCheckout = () => {
|
|
1376
|
-
router.push("/checkout");
|
|
1377
|
-
};
|
|
1378
|
-
const handleHandleClicked = () => {
|
|
1379
|
-
if (drawer.state === "full") {
|
|
1380
|
-
buy.hideVariants();
|
|
1381
|
-
} else if (drawer.state === "micro") {
|
|
1382
|
-
buy.showRecentVariants();
|
|
1383
|
-
}
|
|
1384
|
-
};
|
|
1385
|
-
const handleItemClicked = () => {
|
|
1386
|
-
buy.showRecentVariants();
|
|
1387
|
-
};
|
|
1388
|
-
const handleCloseGesture = () => {
|
|
1389
|
-
if (drawer.state === "full") {
|
|
1390
|
-
buy.hideVariants();
|
|
1391
|
-
return true;
|
|
1392
|
-
}
|
|
1393
|
-
return false;
|
|
1394
|
-
};
|
|
1395
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1396
|
-
shell_default,
|
|
1397
|
-
{
|
|
1398
|
-
handleHandleClicked,
|
|
1399
|
-
handleCloseGesture,
|
|
1400
|
-
drawerClx: "flex flex-col",
|
|
1401
|
-
children: [
|
|
1402
|
-
drawer.state === "full" && /* The actual drawer is larger than the visible area (due to awkward
|
|
1403
|
-
vaul impl. So we have to ask the drawer for its currect snappoint
|
|
1404
|
-
and constrain layout to that.
|
|
1405
|
-
*/
|
|
1406
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
1407
|
-
height: drawer.snapPointPx - 24
|
|
1408
|
-
/* fudge factor for handle area */
|
|
1409
|
-
}, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1410
|
-
commerce.CarouselBuyCard,
|
|
1411
|
-
{
|
|
1412
|
-
skuPath: buy.currentSkuPath,
|
|
1413
|
-
checkoutButton: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1414
|
-
checkout_button_default,
|
|
1415
|
-
{
|
|
1416
|
-
handleCheckout,
|
|
1417
|
-
className: "w-full min-w-[160px] sm:max-w-[320px]"
|
|
1418
|
-
}
|
|
1419
|
-
),
|
|
1420
|
-
clx: "justify-between h-full pb-3 gap-8",
|
|
1421
|
-
addBtnClx: "w-full min-w-[160px] sm:max-w-[320px]",
|
|
1422
|
-
buttonsAreaClx: "grow-0 shrink-0 mt-0",
|
|
1423
|
-
selectorClx: "max-w-[475px] justify-between grow"
|
|
1424
|
-
}
|
|
1425
|
-
) }),
|
|
1426
|
-
drawer.state === "micro" && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1427
|
-
micro_default,
|
|
1428
|
-
{
|
|
1429
|
-
handleCheckout,
|
|
1430
|
-
handleItemClicked,
|
|
1431
|
-
clx: "w-full px-2 sm:w-[460px] sm:mx-auto md:w-[550px]"
|
|
1432
|
-
}
|
|
1433
|
-
)
|
|
1434
|
-
]
|
|
1435
|
-
}
|
|
1436
|
-
);
|
|
1437
|
-
});
|
|
1438
|
-
var drawer_default = CommerceUIComponent;
|
|
1439
|
-
var Analytics = () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1440
|
-
/* @__PURE__ */ jsxRuntime.jsx(FacebookPixel, {}),
|
|
1441
|
-
/* @__PURE__ */ jsxRuntime.jsx(google.GoogleAnalytics, { gaId: process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID ?? "" })
|
|
1442
|
-
] });
|
|
1443
20
|
var viewport = {
|
|
1444
21
|
themeColor: [
|
|
1445
22
|
{ media: "(prefers-color-scheme: light)", color: "white" },
|
|
@@ -1453,10 +30,10 @@ function RootLayout({
|
|
|
1453
30
|
children
|
|
1454
31
|
}) {
|
|
1455
32
|
const Guts = () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1456
|
-
showHeader && /* @__PURE__ */ jsxRuntime.jsx(
|
|
33
|
+
showHeader && /* @__PURE__ */ jsxRuntime.jsx(index_js.Header, { siteDef }),
|
|
1457
34
|
children,
|
|
1458
35
|
chatbot && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1459
|
-
|
|
36
|
+
index_js.ChatWidget,
|
|
1460
37
|
{
|
|
1461
38
|
title: "LUX",
|
|
1462
39
|
subtitle: "AI",
|
|
@@ -1469,13 +46,13 @@ function RootLayout({
|
|
|
1469
46
|
return /* @__PURE__ */ jsxRuntime.jsxs("html", { lang: "en", suppressHydrationWarning: true, className: "hanzo-ui-dark-theme", style: { backgroundColor: "#000" }, children: [
|
|
1470
47
|
/* @__PURE__ */ jsxRuntime.jsxs("head", { children: [
|
|
1471
48
|
/* @__PURE__ */ jsxRuntime.jsx("base", { target: "_blank" }),
|
|
1472
|
-
/* @__PURE__ */ jsxRuntime.jsx(FacebookPixelHead, {})
|
|
49
|
+
/* @__PURE__ */ jsxRuntime.jsx(pixelAnalytics_js.FacebookPixelHead, {})
|
|
1473
50
|
] }),
|
|
1474
51
|
/* @__PURE__ */ jsxRuntime.jsx("body", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Hanzo, { theme: "dark", children: [
|
|
1475
|
-
/* @__PURE__ */ jsxRuntime.jsx(Analytics, {}),
|
|
1476
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
52
|
+
/* @__PURE__ */ jsxRuntime.jsx(index_js.Analytics, {}),
|
|
53
|
+
/* @__PURE__ */ jsxRuntime.jsx(index_js.Auth, { app: siteDef.app, children: siteDef?.commerce ? /* @__PURE__ */ jsxRuntime.jsx(commerce.CommerceProvider, { config: siteDef.commerce, children: /* @__PURE__ */ jsxRuntime.jsxs(context_js.CommerceUIProvider, { children: [
|
|
1477
54
|
/* @__PURE__ */ jsxRuntime.jsx(Guts, {}),
|
|
1478
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
55
|
+
/* @__PURE__ */ jsxRuntime.jsx(CommerceDrawer__default.default, {})
|
|
1479
56
|
] }) }) : /* @__PURE__ */ jsxRuntime.jsx(Guts, {}) }),
|
|
1480
57
|
/* @__PURE__ */ jsxRuntime.jsx(primitives.Toaster, { position: "top-center", duration: 3e3 })
|
|
1481
58
|
] }) })
|