dp-widgets-framework 1.7.1 → 1.7.3
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/index.esm.js +231 -219
- package/dist/index.js +231 -219
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -3775,6 +3775,71 @@ function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
|
3775
3775
|
return coords;
|
|
3776
3776
|
}
|
|
3777
3777
|
|
|
3778
|
+
/**
|
|
3779
|
+
* Resolves with an object of overflow side offsets that determine how much the
|
|
3780
|
+
* element is overflowing a given clipping boundary on each side.
|
|
3781
|
+
* - positive = overflowing the boundary by that number of pixels
|
|
3782
|
+
* - negative = how many pixels left before it will overflow
|
|
3783
|
+
* - 0 = lies flush with the boundary
|
|
3784
|
+
* @see https://floating-ui.com/docs/detectOverflow
|
|
3785
|
+
*/
|
|
3786
|
+
async function detectOverflow(state, options) {
|
|
3787
|
+
var _await$platform$isEle;
|
|
3788
|
+
if (options === void 0) {
|
|
3789
|
+
options = {};
|
|
3790
|
+
}
|
|
3791
|
+
const {
|
|
3792
|
+
x,
|
|
3793
|
+
y,
|
|
3794
|
+
platform,
|
|
3795
|
+
rects,
|
|
3796
|
+
elements,
|
|
3797
|
+
strategy
|
|
3798
|
+
} = state;
|
|
3799
|
+
const {
|
|
3800
|
+
boundary = 'clippingAncestors',
|
|
3801
|
+
rootBoundary = 'viewport',
|
|
3802
|
+
elementContext = 'floating',
|
|
3803
|
+
altBoundary = false,
|
|
3804
|
+
padding = 0
|
|
3805
|
+
} = evaluate(options, state);
|
|
3806
|
+
const paddingObject = getPaddingObject(padding);
|
|
3807
|
+
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
3808
|
+
const element = elements[altBoundary ? altContext : elementContext];
|
|
3809
|
+
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
3810
|
+
element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
|
|
3811
|
+
boundary,
|
|
3812
|
+
rootBoundary,
|
|
3813
|
+
strategy
|
|
3814
|
+
}));
|
|
3815
|
+
const rect = elementContext === 'floating' ? {
|
|
3816
|
+
x,
|
|
3817
|
+
y,
|
|
3818
|
+
width: rects.floating.width,
|
|
3819
|
+
height: rects.floating.height
|
|
3820
|
+
} : rects.reference;
|
|
3821
|
+
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
3822
|
+
const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
|
|
3823
|
+
x: 1,
|
|
3824
|
+
y: 1
|
|
3825
|
+
} : {
|
|
3826
|
+
x: 1,
|
|
3827
|
+
y: 1
|
|
3828
|
+
};
|
|
3829
|
+
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
3830
|
+
elements,
|
|
3831
|
+
rect,
|
|
3832
|
+
offsetParent,
|
|
3833
|
+
strategy
|
|
3834
|
+
}) : rect);
|
|
3835
|
+
return {
|
|
3836
|
+
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
3837
|
+
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
3838
|
+
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
3839
|
+
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
3840
|
+
};
|
|
3841
|
+
}
|
|
3842
|
+
|
|
3778
3843
|
/**
|
|
3779
3844
|
* Computes the `x` and `y` coordinates that will place the floating element
|
|
3780
3845
|
* next to a given reference element.
|
|
@@ -3804,6 +3869,7 @@ const computePosition$1 = async (reference, floating, config) => {
|
|
|
3804
3869
|
let middlewareData = {};
|
|
3805
3870
|
let resetCount = 0;
|
|
3806
3871
|
for (let i = 0; i < validMiddleware.length; i++) {
|
|
3872
|
+
var _platform$detectOverf;
|
|
3807
3873
|
const {
|
|
3808
3874
|
name,
|
|
3809
3875
|
fn
|
|
@@ -3821,7 +3887,10 @@ const computePosition$1 = async (reference, floating, config) => {
|
|
|
3821
3887
|
strategy,
|
|
3822
3888
|
middlewareData,
|
|
3823
3889
|
rects,
|
|
3824
|
-
platform
|
|
3890
|
+
platform: {
|
|
3891
|
+
...platform,
|
|
3892
|
+
detectOverflow: (_platform$detectOverf = platform.detectOverflow) != null ? _platform$detectOverf : detectOverflow
|
|
3893
|
+
},
|
|
3825
3894
|
elements: {
|
|
3826
3895
|
reference,
|
|
3827
3896
|
floating
|
|
@@ -3866,71 +3935,6 @@ const computePosition$1 = async (reference, floating, config) => {
|
|
|
3866
3935
|
};
|
|
3867
3936
|
};
|
|
3868
3937
|
|
|
3869
|
-
/**
|
|
3870
|
-
* Resolves with an object of overflow side offsets that determine how much the
|
|
3871
|
-
* element is overflowing a given clipping boundary on each side.
|
|
3872
|
-
* - positive = overflowing the boundary by that number of pixels
|
|
3873
|
-
* - negative = how many pixels left before it will overflow
|
|
3874
|
-
* - 0 = lies flush with the boundary
|
|
3875
|
-
* @see https://floating-ui.com/docs/detectOverflow
|
|
3876
|
-
*/
|
|
3877
|
-
async function detectOverflow(state, options) {
|
|
3878
|
-
var _await$platform$isEle;
|
|
3879
|
-
if (options === void 0) {
|
|
3880
|
-
options = {};
|
|
3881
|
-
}
|
|
3882
|
-
const {
|
|
3883
|
-
x,
|
|
3884
|
-
y,
|
|
3885
|
-
platform,
|
|
3886
|
-
rects,
|
|
3887
|
-
elements,
|
|
3888
|
-
strategy
|
|
3889
|
-
} = state;
|
|
3890
|
-
const {
|
|
3891
|
-
boundary = 'clippingAncestors',
|
|
3892
|
-
rootBoundary = 'viewport',
|
|
3893
|
-
elementContext = 'floating',
|
|
3894
|
-
altBoundary = false,
|
|
3895
|
-
padding = 0
|
|
3896
|
-
} = evaluate(options, state);
|
|
3897
|
-
const paddingObject = getPaddingObject(padding);
|
|
3898
|
-
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
3899
|
-
const element = elements[altBoundary ? altContext : elementContext];
|
|
3900
|
-
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
3901
|
-
element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
|
|
3902
|
-
boundary,
|
|
3903
|
-
rootBoundary,
|
|
3904
|
-
strategy
|
|
3905
|
-
}));
|
|
3906
|
-
const rect = elementContext === 'floating' ? {
|
|
3907
|
-
x,
|
|
3908
|
-
y,
|
|
3909
|
-
width: rects.floating.width,
|
|
3910
|
-
height: rects.floating.height
|
|
3911
|
-
} : rects.reference;
|
|
3912
|
-
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
3913
|
-
const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
|
|
3914
|
-
x: 1,
|
|
3915
|
-
y: 1
|
|
3916
|
-
} : {
|
|
3917
|
-
x: 1,
|
|
3918
|
-
y: 1
|
|
3919
|
-
};
|
|
3920
|
-
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
3921
|
-
elements,
|
|
3922
|
-
rect,
|
|
3923
|
-
offsetParent,
|
|
3924
|
-
strategy
|
|
3925
|
-
}) : rect);
|
|
3926
|
-
return {
|
|
3927
|
-
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
3928
|
-
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
3929
|
-
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
3930
|
-
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
3931
|
-
};
|
|
3932
|
-
}
|
|
3933
|
-
|
|
3934
3938
|
/**
|
|
3935
3939
|
* Provides data to position an inner element of the floating element so that it
|
|
3936
3940
|
* appears centered to the reference element.
|
|
@@ -4063,7 +4067,7 @@ const flip$2 = function (options) {
|
|
|
4063
4067
|
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
4064
4068
|
}
|
|
4065
4069
|
const placements = [initialPlacement, ...fallbackPlacements];
|
|
4066
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
4070
|
+
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
4067
4071
|
const overflows = [];
|
|
4068
4072
|
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
4069
4073
|
if (checkMainAxis) {
|
|
@@ -4170,7 +4174,8 @@ const hide$2 = function (options) {
|
|
|
4170
4174
|
options,
|
|
4171
4175
|
async fn(state) {
|
|
4172
4176
|
const {
|
|
4173
|
-
rects
|
|
4177
|
+
rects,
|
|
4178
|
+
platform
|
|
4174
4179
|
} = state;
|
|
4175
4180
|
const {
|
|
4176
4181
|
strategy = 'referenceHidden',
|
|
@@ -4179,7 +4184,7 @@ const hide$2 = function (options) {
|
|
|
4179
4184
|
switch (strategy) {
|
|
4180
4185
|
case 'referenceHidden':
|
|
4181
4186
|
{
|
|
4182
|
-
const overflow = await detectOverflow(state, {
|
|
4187
|
+
const overflow = await platform.detectOverflow(state, {
|
|
4183
4188
|
...detectOverflowOptions,
|
|
4184
4189
|
elementContext: 'reference'
|
|
4185
4190
|
});
|
|
@@ -4193,7 +4198,7 @@ const hide$2 = function (options) {
|
|
|
4193
4198
|
}
|
|
4194
4199
|
case 'escaped':
|
|
4195
4200
|
{
|
|
4196
|
-
const overflow = await detectOverflow(state, {
|
|
4201
|
+
const overflow = await platform.detectOverflow(state, {
|
|
4197
4202
|
...detectOverflowOptions,
|
|
4198
4203
|
altBoundary: true
|
|
4199
4204
|
});
|
|
@@ -4316,7 +4321,8 @@ const shift$2 = function (options) {
|
|
|
4316
4321
|
const {
|
|
4317
4322
|
x,
|
|
4318
4323
|
y,
|
|
4319
|
-
placement
|
|
4324
|
+
placement,
|
|
4325
|
+
platform
|
|
4320
4326
|
} = state;
|
|
4321
4327
|
const {
|
|
4322
4328
|
mainAxis: checkMainAxis = true,
|
|
@@ -4339,7 +4345,7 @@ const shift$2 = function (options) {
|
|
|
4339
4345
|
x,
|
|
4340
4346
|
y
|
|
4341
4347
|
};
|
|
4342
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
4348
|
+
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
4343
4349
|
const crossAxis = getSideAxis(getSide(placement));
|
|
4344
4350
|
const mainAxis = getOppositeAxis(crossAxis);
|
|
4345
4351
|
let mainAxisCoord = coords[mainAxis];
|
|
@@ -4471,7 +4477,7 @@ const size$2 = function (options) {
|
|
|
4471
4477
|
apply = () => {},
|
|
4472
4478
|
...detectOverflowOptions
|
|
4473
4479
|
} = evaluate(options, state);
|
|
4474
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
4480
|
+
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
4475
4481
|
const side = getSide(placement);
|
|
4476
4482
|
const alignment = getAlignment(placement);
|
|
4477
4483
|
const isYAxis = getSideAxis(placement) === 'y';
|
|
@@ -45420,7 +45426,7 @@ function FiltersContent({
|
|
|
45420
45426
|
if (!response.ok) {
|
|
45421
45427
|
throw new Error("Failed to update widget config");
|
|
45422
45428
|
}
|
|
45423
|
-
onApplyFilters == null ? void 0 : onApplyFilters(filtersWithLabels);
|
|
45429
|
+
await (onApplyFilters == null ? void 0 : onApplyFilters(filtersWithLabels));
|
|
45424
45430
|
} catch (error) {
|
|
45425
45431
|
console.error("Error updating widget config:", error);
|
|
45426
45432
|
} finally {
|
|
@@ -45539,13 +45545,13 @@ function CopilotKitFilters({
|
|
|
45539
45545
|
}, [reset, widget.id, onResetReady]);
|
|
45540
45546
|
useEffect(() => {
|
|
45541
45547
|
const handleTriggerAgent = (event) => {
|
|
45542
|
-
const { widgetId, query
|
|
45548
|
+
const { widgetId, query } = event.detail;
|
|
45543
45549
|
reset();
|
|
45544
45550
|
if (widgetId === widget.id) {
|
|
45545
45551
|
let messageContent = `${query}`;
|
|
45546
|
-
console.log("triggering to datasetId==>",
|
|
45547
|
-
setFilterState(createInitialFilterState(
|
|
45548
|
-
setAgentState(createInitialFilterState(
|
|
45552
|
+
console.log("triggering to datasetId==>", datasetId);
|
|
45553
|
+
setFilterState(createInitialFilterState(datasetId));
|
|
45554
|
+
setAgentState(createInitialFilterState(datasetId));
|
|
45549
45555
|
setApiCallCount(0);
|
|
45550
45556
|
setHasTimeoutError(false);
|
|
45551
45557
|
appendMessage(
|
|
@@ -45572,7 +45578,7 @@ function CopilotKitFilters({
|
|
|
45572
45578
|
window.removeEventListener("triggerAgent", handleTriggerAgent);
|
|
45573
45579
|
window.removeEventListener("clearFilterState", handleClearFilterState);
|
|
45574
45580
|
};
|
|
45575
|
-
}, [widget.id, appendMessage, setFilterState, startLoadingTimeout]);
|
|
45581
|
+
}, [widget.id, appendMessage, setFilterState, startLoadingTimeout, datasetId]);
|
|
45576
45582
|
const handleConfirmation = useCallback(async (tableMapping) => {
|
|
45577
45583
|
var _a2, _b2, _c2;
|
|
45578
45584
|
console.log("[FiltersWidget] handleConfirmation called with:", {
|
|
@@ -49156,7 +49162,7 @@ function PresentationMode({
|
|
|
49156
49162
|
return;
|
|
49157
49163
|
}
|
|
49158
49164
|
item.style.cursor = "pointer";
|
|
49159
|
-
item.style.boxShadow = "0 0 0 3px var(--primary-500
|
|
49165
|
+
item.style.boxShadow = "0 0 0 3px var(--primary-500), 0 10px 30px -5px rgba(0, 0, 0, 0.2)";
|
|
49160
49166
|
item.style.transition = "box-shadow 0.2s ease-out";
|
|
49161
49167
|
item.style.zIndex = "10";
|
|
49162
49168
|
};
|
|
@@ -49274,156 +49280,162 @@ function PresentationMode({
|
|
|
49274
49280
|
}, [isOpen]);
|
|
49275
49281
|
if (!isOpen) return null;
|
|
49276
49282
|
const currentFocusWidget = focusableWidgets[currentFocusIndex];
|
|
49277
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49278
|
-
|
|
49279
|
-
|
|
49280
|
-
|
|
49281
|
-
|
|
49282
|
-
|
|
49283
|
-
|
|
49284
|
-
|
|
49285
|
-
|
|
49286
|
-
] }),
|
|
49287
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49288
|
-
"button",
|
|
49289
|
-
{
|
|
49290
|
-
onClick: onClose,
|
|
49291
|
-
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors",
|
|
49292
|
-
"aria-label": "Close presentation",
|
|
49293
|
-
children: /* @__PURE__ */ jsxRuntimeExports.jsx(X, { className: "w-6 h-6 text-gray-600" })
|
|
49294
|
-
}
|
|
49295
|
-
)
|
|
49296
|
-
] }),
|
|
49297
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: `flex-1 min-h-0 ${viewMode === "grid" ? "overflow-auto bg-gray-50 p-6" : "overflow-hidden bg-gray-100"}`, children: loading ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-3", children: [
|
|
49298
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-8 h-8 border-4 border-primary-600 border-t-transparent rounded-full animate-spin" }),
|
|
49299
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-gray-600", children: "Loading widgets..." })
|
|
49300
|
-
] }) }) : viewMode === "grid" ? (
|
|
49301
|
-
/* Grid View - Show all widgets using WidgetDashboard */
|
|
49302
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full relative", ref: gridContainerRef, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49303
|
-
WidgetDashboard,
|
|
49304
|
-
{
|
|
49305
|
-
pageId,
|
|
49306
|
-
isEditing: false,
|
|
49307
|
-
selectedWidget: null,
|
|
49308
|
-
onWidgetSelect: () => {
|
|
49309
|
-
},
|
|
49310
|
-
openWidgetPallete: false,
|
|
49311
|
-
onCloseWidgetPallete: () => {
|
|
49312
|
-
},
|
|
49313
|
-
onApplyFilters: () => {
|
|
49314
|
-
},
|
|
49315
|
-
isApplyingFilters: false,
|
|
49316
|
-
onSaveLayoutReady: () => {
|
|
49317
|
-
},
|
|
49318
|
-
widgetBackendUrl
|
|
49319
|
-
},
|
|
49320
|
-
`presentation-grid-${pageId}`
|
|
49321
|
-
) })
|
|
49322
|
-
) : (
|
|
49323
|
-
/* Focus View - Show one widget at a time */
|
|
49324
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full flex flex-col", ref: focusContainerRef, children: focusableWidgets.length > 0 && currentFocusWidget ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 flex flex-col min-h-0", children: [
|
|
49325
|
-
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "shrink-0 bg-white border-b border-gray-200 px-6 py-3 flex items-center justify-between", children: [
|
|
49326
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49327
|
-
"button",
|
|
49328
|
-
{
|
|
49329
|
-
onClick: () => setCurrentFocusIndex((prev) => prev > 0 ? prev - 1 : focusableWidgets.length - 1),
|
|
49330
|
-
className: "p-2 rounded-full hover:bg-gray-100 transition-colors disabled:opacity-30",
|
|
49331
|
-
disabled: focusableWidgets.length <= 1,
|
|
49332
|
-
children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronLeft, { className: "w-5 h-5 text-gray-600" })
|
|
49333
|
-
}
|
|
49334
|
-
),
|
|
49335
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-gray-500", children: [
|
|
49336
|
-
currentFocusIndex + 1,
|
|
49337
|
-
" of ",
|
|
49338
|
-
focusableWidgets.length
|
|
49283
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49284
|
+
"div",
|
|
49285
|
+
{
|
|
49286
|
+
className: `fixed inset-0 z-50 bg-white flex flex-col ${laserPointerActive ? "[&_*]:!cursor-none !cursor-none" : ""}`,
|
|
49287
|
+
children: [
|
|
49288
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("header", { className: "flex items-center justify-between px-6 py-4 border-b border-gray-200 bg-white shrink-0", children: [
|
|
49289
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col", children: [
|
|
49290
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xl font-bold text-primary-700 tracking-wide", children: branding.title }),
|
|
49291
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs text-primary-500 tracking-[0.2em] -mt-1", children: branding.subtitle })
|
|
49339
49292
|
] }) }),
|
|
49293
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "absolute left-1/2 transform -translate-x-1/2 text-center", children: [
|
|
49294
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("h1", { className: "text-lg font-bold text-gray-900 uppercase tracking-wide", children: dashboardTitle }),
|
|
49295
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-12 h-1 bg-primary-600 mx-auto mt-1 rounded" })
|
|
49296
|
+
] }),
|
|
49340
49297
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49341
49298
|
"button",
|
|
49342
49299
|
{
|
|
49343
|
-
onClick:
|
|
49344
|
-
className: "p-2
|
|
49345
|
-
|
|
49346
|
-
children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49300
|
+
onClick: onClose,
|
|
49301
|
+
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors",
|
|
49302
|
+
"aria-label": "Close presentation",
|
|
49303
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx(X, { className: "w-6 h-6 text-gray-600" })
|
|
49347
49304
|
}
|
|
49348
49305
|
)
|
|
49349
49306
|
] }),
|
|
49350
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("
|
|
49351
|
-
|
|
49352
|
-
{
|
|
49353
|
-
|
|
49354
|
-
|
|
49355
|
-
|
|
49356
|
-
|
|
49357
|
-
|
|
49358
|
-
|
|
49359
|
-
|
|
49360
|
-
|
|
49361
|
-
|
|
49362
|
-
|
|
49363
|
-
|
|
49364
|
-
|
|
49365
|
-
|
|
49366
|
-
|
|
49367
|
-
|
|
49368
|
-
|
|
49369
|
-
|
|
49370
|
-
|
|
49371
|
-
|
|
49372
|
-
|
|
49373
|
-
|
|
49374
|
-
|
|
49375
|
-
|
|
49376
|
-
|
|
49377
|
-
|
|
49378
|
-
|
|
49379
|
-
|
|
49380
|
-
|
|
49307
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: `flex-1 min-h-0 ${viewMode === "grid" ? "overflow-auto bg-gray-50 p-6" : "overflow-hidden bg-gray-100"}`, children: loading ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-3", children: [
|
|
49308
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-8 h-8 border-4 border-primary-600 border-t-transparent rounded-full animate-spin" }),
|
|
49309
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-gray-600", children: "Loading widgets..." })
|
|
49310
|
+
] }) }) : viewMode === "grid" ? (
|
|
49311
|
+
/* Grid View - Show all widgets using WidgetDashboard */
|
|
49312
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full relative", ref: gridContainerRef, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49313
|
+
WidgetDashboard,
|
|
49314
|
+
{
|
|
49315
|
+
pageId,
|
|
49316
|
+
isEditing: false,
|
|
49317
|
+
selectedWidget: null,
|
|
49318
|
+
onWidgetSelect: () => {
|
|
49319
|
+
},
|
|
49320
|
+
openWidgetPallete: false,
|
|
49321
|
+
onCloseWidgetPallete: () => {
|
|
49322
|
+
},
|
|
49323
|
+
onApplyFilters: () => {
|
|
49324
|
+
},
|
|
49325
|
+
isApplyingFilters: false,
|
|
49326
|
+
onSaveLayoutReady: () => {
|
|
49327
|
+
},
|
|
49328
|
+
widgetBackendUrl
|
|
49329
|
+
},
|
|
49330
|
+
`presentation-grid-${pageId}`
|
|
49331
|
+
) })
|
|
49332
|
+
) : (
|
|
49333
|
+
/* Focus View - Show one widget at a time */
|
|
49334
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full flex flex-col", ref: focusContainerRef, children: focusableWidgets.length > 0 && currentFocusWidget ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 flex flex-col min-h-0", children: [
|
|
49335
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "shrink-0 bg-white border-b border-gray-200 px-6 py-3 flex items-center justify-between", children: [
|
|
49336
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49337
|
+
"button",
|
|
49338
|
+
{
|
|
49339
|
+
onClick: () => setCurrentFocusIndex((prev) => prev > 0 ? prev - 1 : focusableWidgets.length - 1),
|
|
49340
|
+
className: "p-2 rounded-full hover:bg-gray-100 transition-colors disabled:opacity-30",
|
|
49341
|
+
disabled: focusableWidgets.length <= 1,
|
|
49342
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronLeft, { className: "w-5 h-5 text-gray-600" })
|
|
49343
|
+
}
|
|
49344
|
+
),
|
|
49345
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-gray-500", children: [
|
|
49346
|
+
currentFocusIndex + 1,
|
|
49347
|
+
" of ",
|
|
49348
|
+
focusableWidgets.length
|
|
49349
|
+
] }) }),
|
|
49350
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49351
|
+
"button",
|
|
49352
|
+
{
|
|
49353
|
+
onClick: () => setCurrentFocusIndex((prev) => prev < focusableWidgets.length - 1 ? prev + 1 : 0),
|
|
49354
|
+
className: "p-2 rounded-full hover:bg-gray-100 transition-colors disabled:opacity-30",
|
|
49355
|
+
disabled: focusableWidgets.length <= 1,
|
|
49356
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "w-5 h-5 text-gray-600" })
|
|
49357
|
+
}
|
|
49358
|
+
)
|
|
49359
|
+
] }),
|
|
49360
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 bg-white p-6 min-h-0 overflow-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full w-full rounded-xl border border-gray-200 bg-white shadow-sm overflow-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49361
|
+
WidgetRenderer,
|
|
49362
|
+
{
|
|
49363
|
+
widget: currentFocusWidget,
|
|
49364
|
+
widgetBackendUrl,
|
|
49365
|
+
pageId,
|
|
49366
|
+
isEditing: false
|
|
49367
|
+
},
|
|
49368
|
+
`focus-widget-${currentFocusWidget.id}`
|
|
49369
|
+
) }) })
|
|
49370
|
+
] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center text-gray-500", children: [
|
|
49371
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(Maximize2, { className: "w-12 h-12 mx-auto mb-4 text-gray-300" }),
|
|
49372
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-lg font-medium", children: "No widgets available for focus view" }),
|
|
49373
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm mt-2", children: "Text, Spacer, and Filter widgets are excluded." })
|
|
49374
|
+
] }) }) })
|
|
49375
|
+
) }),
|
|
49376
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("footer", { className: "bg-white border-t border-gray-200 py-4 shrink-0", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-3", children: [
|
|
49377
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1 bg-gray-100 rounded-full p-1", children: [
|
|
49378
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49379
|
+
"button",
|
|
49380
|
+
{
|
|
49381
|
+
onClick: () => setViewMode("grid"),
|
|
49382
|
+
className: `flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium transition-all ${viewMode === "grid" ? "bg-primary-700 text-white shadow-md" : "text-gray-600 hover:text-gray-900"}`,
|
|
49383
|
+
children: [
|
|
49384
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(Grid3X3, { className: "w-4 h-4" }),
|
|
49385
|
+
"Grid"
|
|
49386
|
+
]
|
|
49387
|
+
}
|
|
49388
|
+
),
|
|
49389
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49390
|
+
"button",
|
|
49391
|
+
{
|
|
49392
|
+
onClick: () => setViewMode("focus"),
|
|
49393
|
+
className: `flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium transition-all ${viewMode === "focus" ? "bg-primary-700 text-white shadow-md" : "text-gray-600 hover:text-gray-900"}`,
|
|
49394
|
+
children: [
|
|
49395
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(Maximize2, { className: "w-4 h-4" }),
|
|
49396
|
+
"Focus"
|
|
49397
|
+
]
|
|
49398
|
+
}
|
|
49399
|
+
),
|
|
49400
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-px h-6 bg-gray-300 mx-2" }),
|
|
49401
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49402
|
+
"button",
|
|
49403
|
+
{
|
|
49404
|
+
onClick: () => setLaserPointerActive((prev) => !prev),
|
|
49405
|
+
className: `p-2 transition-colors rounded-full ${laserPointerActive ? "bg-primary-600 text-white" : "text-gray-600 hover:text-gray-900 hover:bg-gray-200"}`,
|
|
49406
|
+
"aria-label": "Toggle laser pointer (L)",
|
|
49407
|
+
title: "Toggle laser pointer (L)",
|
|
49408
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx(LaserPointerIcon, { className: "w-4 h-4" })
|
|
49409
|
+
}
|
|
49410
|
+
),
|
|
49411
|
+
viewMode === "focus" && focusableWidgets.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
|
|
49412
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-px h-6 bg-gray-300 mx-2" }),
|
|
49413
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-gray-600 px-2", children: [
|
|
49414
|
+
currentFocusIndex + 1,
|
|
49415
|
+
" / ",
|
|
49416
|
+
focusableWidgets.length
|
|
49417
|
+
] })
|
|
49418
|
+
] })
|
|
49419
|
+
] }),
|
|
49420
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-gray-400 uppercase tracking-wider", children: "ESC TO EXIT \u2022 F TO TOGGLE \u2022 L FOR LASER \u2022 ARROWS TO NAVIGATE" })
|
|
49421
|
+
] }) }),
|
|
49422
|
+
laserPointerActive && /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49423
|
+
"div",
|
|
49381
49424
|
{
|
|
49382
|
-
|
|
49383
|
-
|
|
49425
|
+
className: "fixed pointer-events-none z-[100] transform -translate-x-1/2 -translate-y-1/2",
|
|
49426
|
+
style: {
|
|
49427
|
+
left: mousePosition.x,
|
|
49428
|
+
top: mousePosition.y
|
|
49429
|
+
},
|
|
49384
49430
|
children: [
|
|
49385
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49386
|
-
"
|
|
49431
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute inset-0 w-8 h-8 -translate-x-1/2 -translate-y-1/2 bg-red-500/20 rounded-full blur-md" }),
|
|
49432
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute w-4 h-4 -translate-x-1/2 -translate-y-1/2 bg-red-500 rounded-full shadow-lg shadow-red-500/50" })
|
|
49387
49433
|
]
|
|
49388
49434
|
}
|
|
49389
|
-
)
|
|
49390
|
-
|
|
49391
|
-
|
|
49392
|
-
|
|
49393
|
-
{
|
|
49394
|
-
onClick: () => setLaserPointerActive((prev) => !prev),
|
|
49395
|
-
className: `p-2 transition-colors rounded-full ${laserPointerActive ? "bg-primary-600 text-white" : "text-gray-600 hover:text-gray-900 hover:bg-gray-200"}`,
|
|
49396
|
-
"aria-label": "Toggle laser pointer (L)",
|
|
49397
|
-
title: "Toggle laser pointer (L)",
|
|
49398
|
-
children: /* @__PURE__ */ jsxRuntimeExports.jsx(LaserPointerIcon, { className: "w-4 h-4" })
|
|
49399
|
-
}
|
|
49400
|
-
),
|
|
49401
|
-
viewMode === "focus" && focusableWidgets.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
|
|
49402
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-px h-6 bg-gray-300 mx-2" }),
|
|
49403
|
-
/* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-gray-600 px-2", children: [
|
|
49404
|
-
currentFocusIndex + 1,
|
|
49405
|
-
" / ",
|
|
49406
|
-
focusableWidgets.length
|
|
49407
|
-
] })
|
|
49408
|
-
] })
|
|
49409
|
-
] }),
|
|
49410
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-gray-400 uppercase tracking-wider", children: "ESC TO EXIT \u2022 F TO TOGGLE \u2022 L FOR LASER \u2022 ARROWS TO NAVIGATE" })
|
|
49411
|
-
] }) }),
|
|
49412
|
-
laserPointerActive && /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49413
|
-
"div",
|
|
49414
|
-
{
|
|
49415
|
-
className: "fixed pointer-events-none z-[100] transform -translate-x-1/2 -translate-y-1/2",
|
|
49416
|
-
style: {
|
|
49417
|
-
left: mousePosition.x,
|
|
49418
|
-
top: mousePosition.y
|
|
49419
|
-
},
|
|
49420
|
-
children: [
|
|
49421
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute inset-0 w-8 h-8 -translate-x-1/2 -translate-y-1/2 bg-red-500/20 rounded-full blur-md" }),
|
|
49422
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute w-4 h-4 -translate-x-1/2 -translate-y-1/2 bg-red-500 rounded-full shadow-lg shadow-red-500/50" })
|
|
49423
|
-
]
|
|
49424
|
-
}
|
|
49425
|
-
)
|
|
49426
|
-
] });
|
|
49435
|
+
)
|
|
49436
|
+
]
|
|
49437
|
+
}
|
|
49438
|
+
);
|
|
49427
49439
|
}
|
|
49428
49440
|
|
|
49429
49441
|
var __defProp = Object.defineProperty;
|
package/dist/index.js
CHANGED
|
@@ -3803,6 +3803,71 @@ function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
|
3803
3803
|
return coords;
|
|
3804
3804
|
}
|
|
3805
3805
|
|
|
3806
|
+
/**
|
|
3807
|
+
* Resolves with an object of overflow side offsets that determine how much the
|
|
3808
|
+
* element is overflowing a given clipping boundary on each side.
|
|
3809
|
+
* - positive = overflowing the boundary by that number of pixels
|
|
3810
|
+
* - negative = how many pixels left before it will overflow
|
|
3811
|
+
* - 0 = lies flush with the boundary
|
|
3812
|
+
* @see https://floating-ui.com/docs/detectOverflow
|
|
3813
|
+
*/
|
|
3814
|
+
async function detectOverflow(state, options) {
|
|
3815
|
+
var _await$platform$isEle;
|
|
3816
|
+
if (options === void 0) {
|
|
3817
|
+
options = {};
|
|
3818
|
+
}
|
|
3819
|
+
const {
|
|
3820
|
+
x,
|
|
3821
|
+
y,
|
|
3822
|
+
platform,
|
|
3823
|
+
rects,
|
|
3824
|
+
elements,
|
|
3825
|
+
strategy
|
|
3826
|
+
} = state;
|
|
3827
|
+
const {
|
|
3828
|
+
boundary = 'clippingAncestors',
|
|
3829
|
+
rootBoundary = 'viewport',
|
|
3830
|
+
elementContext = 'floating',
|
|
3831
|
+
altBoundary = false,
|
|
3832
|
+
padding = 0
|
|
3833
|
+
} = evaluate(options, state);
|
|
3834
|
+
const paddingObject = getPaddingObject(padding);
|
|
3835
|
+
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
3836
|
+
const element = elements[altBoundary ? altContext : elementContext];
|
|
3837
|
+
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
3838
|
+
element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
|
|
3839
|
+
boundary,
|
|
3840
|
+
rootBoundary,
|
|
3841
|
+
strategy
|
|
3842
|
+
}));
|
|
3843
|
+
const rect = elementContext === 'floating' ? {
|
|
3844
|
+
x,
|
|
3845
|
+
y,
|
|
3846
|
+
width: rects.floating.width,
|
|
3847
|
+
height: rects.floating.height
|
|
3848
|
+
} : rects.reference;
|
|
3849
|
+
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
3850
|
+
const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
|
|
3851
|
+
x: 1,
|
|
3852
|
+
y: 1
|
|
3853
|
+
} : {
|
|
3854
|
+
x: 1,
|
|
3855
|
+
y: 1
|
|
3856
|
+
};
|
|
3857
|
+
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
3858
|
+
elements,
|
|
3859
|
+
rect,
|
|
3860
|
+
offsetParent,
|
|
3861
|
+
strategy
|
|
3862
|
+
}) : rect);
|
|
3863
|
+
return {
|
|
3864
|
+
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
3865
|
+
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
3866
|
+
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
3867
|
+
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
3868
|
+
};
|
|
3869
|
+
}
|
|
3870
|
+
|
|
3806
3871
|
/**
|
|
3807
3872
|
* Computes the `x` and `y` coordinates that will place the floating element
|
|
3808
3873
|
* next to a given reference element.
|
|
@@ -3832,6 +3897,7 @@ const computePosition$1 = async (reference, floating, config) => {
|
|
|
3832
3897
|
let middlewareData = {};
|
|
3833
3898
|
let resetCount = 0;
|
|
3834
3899
|
for (let i = 0; i < validMiddleware.length; i++) {
|
|
3900
|
+
var _platform$detectOverf;
|
|
3835
3901
|
const {
|
|
3836
3902
|
name,
|
|
3837
3903
|
fn
|
|
@@ -3849,7 +3915,10 @@ const computePosition$1 = async (reference, floating, config) => {
|
|
|
3849
3915
|
strategy,
|
|
3850
3916
|
middlewareData,
|
|
3851
3917
|
rects,
|
|
3852
|
-
platform
|
|
3918
|
+
platform: {
|
|
3919
|
+
...platform,
|
|
3920
|
+
detectOverflow: (_platform$detectOverf = platform.detectOverflow) != null ? _platform$detectOverf : detectOverflow
|
|
3921
|
+
},
|
|
3853
3922
|
elements: {
|
|
3854
3923
|
reference,
|
|
3855
3924
|
floating
|
|
@@ -3894,71 +3963,6 @@ const computePosition$1 = async (reference, floating, config) => {
|
|
|
3894
3963
|
};
|
|
3895
3964
|
};
|
|
3896
3965
|
|
|
3897
|
-
/**
|
|
3898
|
-
* Resolves with an object of overflow side offsets that determine how much the
|
|
3899
|
-
* element is overflowing a given clipping boundary on each side.
|
|
3900
|
-
* - positive = overflowing the boundary by that number of pixels
|
|
3901
|
-
* - negative = how many pixels left before it will overflow
|
|
3902
|
-
* - 0 = lies flush with the boundary
|
|
3903
|
-
* @see https://floating-ui.com/docs/detectOverflow
|
|
3904
|
-
*/
|
|
3905
|
-
async function detectOverflow(state, options) {
|
|
3906
|
-
var _await$platform$isEle;
|
|
3907
|
-
if (options === void 0) {
|
|
3908
|
-
options = {};
|
|
3909
|
-
}
|
|
3910
|
-
const {
|
|
3911
|
-
x,
|
|
3912
|
-
y,
|
|
3913
|
-
platform,
|
|
3914
|
-
rects,
|
|
3915
|
-
elements,
|
|
3916
|
-
strategy
|
|
3917
|
-
} = state;
|
|
3918
|
-
const {
|
|
3919
|
-
boundary = 'clippingAncestors',
|
|
3920
|
-
rootBoundary = 'viewport',
|
|
3921
|
-
elementContext = 'floating',
|
|
3922
|
-
altBoundary = false,
|
|
3923
|
-
padding = 0
|
|
3924
|
-
} = evaluate(options, state);
|
|
3925
|
-
const paddingObject = getPaddingObject(padding);
|
|
3926
|
-
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
3927
|
-
const element = elements[altBoundary ? altContext : elementContext];
|
|
3928
|
-
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
3929
|
-
element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
|
|
3930
|
-
boundary,
|
|
3931
|
-
rootBoundary,
|
|
3932
|
-
strategy
|
|
3933
|
-
}));
|
|
3934
|
-
const rect = elementContext === 'floating' ? {
|
|
3935
|
-
x,
|
|
3936
|
-
y,
|
|
3937
|
-
width: rects.floating.width,
|
|
3938
|
-
height: rects.floating.height
|
|
3939
|
-
} : rects.reference;
|
|
3940
|
-
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
3941
|
-
const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
|
|
3942
|
-
x: 1,
|
|
3943
|
-
y: 1
|
|
3944
|
-
} : {
|
|
3945
|
-
x: 1,
|
|
3946
|
-
y: 1
|
|
3947
|
-
};
|
|
3948
|
-
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
3949
|
-
elements,
|
|
3950
|
-
rect,
|
|
3951
|
-
offsetParent,
|
|
3952
|
-
strategy
|
|
3953
|
-
}) : rect);
|
|
3954
|
-
return {
|
|
3955
|
-
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
3956
|
-
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
3957
|
-
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
3958
|
-
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
3959
|
-
};
|
|
3960
|
-
}
|
|
3961
|
-
|
|
3962
3966
|
/**
|
|
3963
3967
|
* Provides data to position an inner element of the floating element so that it
|
|
3964
3968
|
* appears centered to the reference element.
|
|
@@ -4091,7 +4095,7 @@ const flip$2 = function (options) {
|
|
|
4091
4095
|
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
4092
4096
|
}
|
|
4093
4097
|
const placements = [initialPlacement, ...fallbackPlacements];
|
|
4094
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
4098
|
+
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
4095
4099
|
const overflows = [];
|
|
4096
4100
|
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
4097
4101
|
if (checkMainAxis) {
|
|
@@ -4198,7 +4202,8 @@ const hide$2 = function (options) {
|
|
|
4198
4202
|
options,
|
|
4199
4203
|
async fn(state) {
|
|
4200
4204
|
const {
|
|
4201
|
-
rects
|
|
4205
|
+
rects,
|
|
4206
|
+
platform
|
|
4202
4207
|
} = state;
|
|
4203
4208
|
const {
|
|
4204
4209
|
strategy = 'referenceHidden',
|
|
@@ -4207,7 +4212,7 @@ const hide$2 = function (options) {
|
|
|
4207
4212
|
switch (strategy) {
|
|
4208
4213
|
case 'referenceHidden':
|
|
4209
4214
|
{
|
|
4210
|
-
const overflow = await detectOverflow(state, {
|
|
4215
|
+
const overflow = await platform.detectOverflow(state, {
|
|
4211
4216
|
...detectOverflowOptions,
|
|
4212
4217
|
elementContext: 'reference'
|
|
4213
4218
|
});
|
|
@@ -4221,7 +4226,7 @@ const hide$2 = function (options) {
|
|
|
4221
4226
|
}
|
|
4222
4227
|
case 'escaped':
|
|
4223
4228
|
{
|
|
4224
|
-
const overflow = await detectOverflow(state, {
|
|
4229
|
+
const overflow = await platform.detectOverflow(state, {
|
|
4225
4230
|
...detectOverflowOptions,
|
|
4226
4231
|
altBoundary: true
|
|
4227
4232
|
});
|
|
@@ -4344,7 +4349,8 @@ const shift$2 = function (options) {
|
|
|
4344
4349
|
const {
|
|
4345
4350
|
x,
|
|
4346
4351
|
y,
|
|
4347
|
-
placement
|
|
4352
|
+
placement,
|
|
4353
|
+
platform
|
|
4348
4354
|
} = state;
|
|
4349
4355
|
const {
|
|
4350
4356
|
mainAxis: checkMainAxis = true,
|
|
@@ -4367,7 +4373,7 @@ const shift$2 = function (options) {
|
|
|
4367
4373
|
x,
|
|
4368
4374
|
y
|
|
4369
4375
|
};
|
|
4370
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
4376
|
+
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
4371
4377
|
const crossAxis = getSideAxis(getSide(placement));
|
|
4372
4378
|
const mainAxis = getOppositeAxis(crossAxis);
|
|
4373
4379
|
let mainAxisCoord = coords[mainAxis];
|
|
@@ -4499,7 +4505,7 @@ const size$2 = function (options) {
|
|
|
4499
4505
|
apply = () => {},
|
|
4500
4506
|
...detectOverflowOptions
|
|
4501
4507
|
} = evaluate(options, state);
|
|
4502
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
4508
|
+
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
4503
4509
|
const side = getSide(placement);
|
|
4504
4510
|
const alignment = getAlignment(placement);
|
|
4505
4511
|
const isYAxis = getSideAxis(placement) === 'y';
|
|
@@ -45448,7 +45454,7 @@ function FiltersContent({
|
|
|
45448
45454
|
if (!response.ok) {
|
|
45449
45455
|
throw new Error("Failed to update widget config");
|
|
45450
45456
|
}
|
|
45451
|
-
onApplyFilters == null ? void 0 : onApplyFilters(filtersWithLabels);
|
|
45457
|
+
await (onApplyFilters == null ? void 0 : onApplyFilters(filtersWithLabels));
|
|
45452
45458
|
} catch (error) {
|
|
45453
45459
|
console.error("Error updating widget config:", error);
|
|
45454
45460
|
} finally {
|
|
@@ -45567,13 +45573,13 @@ function CopilotKitFilters({
|
|
|
45567
45573
|
}, [reset, widget.id, onResetReady]);
|
|
45568
45574
|
React.useEffect(() => {
|
|
45569
45575
|
const handleTriggerAgent = (event) => {
|
|
45570
|
-
const { widgetId, query
|
|
45576
|
+
const { widgetId, query } = event.detail;
|
|
45571
45577
|
reset();
|
|
45572
45578
|
if (widgetId === widget.id) {
|
|
45573
45579
|
let messageContent = `${query}`;
|
|
45574
|
-
console.log("triggering to datasetId==>",
|
|
45575
|
-
setFilterState(createInitialFilterState(
|
|
45576
|
-
setAgentState(createInitialFilterState(
|
|
45580
|
+
console.log("triggering to datasetId==>", datasetId);
|
|
45581
|
+
setFilterState(createInitialFilterState(datasetId));
|
|
45582
|
+
setAgentState(createInitialFilterState(datasetId));
|
|
45577
45583
|
setApiCallCount(0);
|
|
45578
45584
|
setHasTimeoutError(false);
|
|
45579
45585
|
appendMessage(
|
|
@@ -45600,7 +45606,7 @@ function CopilotKitFilters({
|
|
|
45600
45606
|
window.removeEventListener("triggerAgent", handleTriggerAgent);
|
|
45601
45607
|
window.removeEventListener("clearFilterState", handleClearFilterState);
|
|
45602
45608
|
};
|
|
45603
|
-
}, [widget.id, appendMessage, setFilterState, startLoadingTimeout]);
|
|
45609
|
+
}, [widget.id, appendMessage, setFilterState, startLoadingTimeout, datasetId]);
|
|
45604
45610
|
const handleConfirmation = React.useCallback(async (tableMapping) => {
|
|
45605
45611
|
var _a2, _b2, _c2;
|
|
45606
45612
|
console.log("[FiltersWidget] handleConfirmation called with:", {
|
|
@@ -49184,7 +49190,7 @@ function PresentationMode({
|
|
|
49184
49190
|
return;
|
|
49185
49191
|
}
|
|
49186
49192
|
item.style.cursor = "pointer";
|
|
49187
|
-
item.style.boxShadow = "0 0 0 3px var(--primary-500
|
|
49193
|
+
item.style.boxShadow = "0 0 0 3px var(--primary-500), 0 10px 30px -5px rgba(0, 0, 0, 0.2)";
|
|
49188
49194
|
item.style.transition = "box-shadow 0.2s ease-out";
|
|
49189
49195
|
item.style.zIndex = "10";
|
|
49190
49196
|
};
|
|
@@ -49302,156 +49308,162 @@ function PresentationMode({
|
|
|
49302
49308
|
}, [isOpen]);
|
|
49303
49309
|
if (!isOpen) return null;
|
|
49304
49310
|
const currentFocusWidget = focusableWidgets[currentFocusIndex];
|
|
49305
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49306
|
-
|
|
49307
|
-
|
|
49308
|
-
|
|
49309
|
-
|
|
49310
|
-
|
|
49311
|
-
|
|
49312
|
-
|
|
49313
|
-
|
|
49314
|
-
] }),
|
|
49315
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49316
|
-
"button",
|
|
49317
|
-
{
|
|
49318
|
-
onClick: onClose,
|
|
49319
|
-
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors",
|
|
49320
|
-
"aria-label": "Close presentation",
|
|
49321
|
-
children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.X, { className: "w-6 h-6 text-gray-600" })
|
|
49322
|
-
}
|
|
49323
|
-
)
|
|
49324
|
-
] }),
|
|
49325
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: `flex-1 min-h-0 ${viewMode === "grid" ? "overflow-auto bg-gray-50 p-6" : "overflow-hidden bg-gray-100"}`, children: loading ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-3", children: [
|
|
49326
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-8 h-8 border-4 border-primary-600 border-t-transparent rounded-full animate-spin" }),
|
|
49327
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-gray-600", children: "Loading widgets..." })
|
|
49328
|
-
] }) }) : viewMode === "grid" ? (
|
|
49329
|
-
/* Grid View - Show all widgets using WidgetDashboard */
|
|
49330
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full relative", ref: gridContainerRef, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49331
|
-
WidgetDashboard,
|
|
49332
|
-
{
|
|
49333
|
-
pageId,
|
|
49334
|
-
isEditing: false,
|
|
49335
|
-
selectedWidget: null,
|
|
49336
|
-
onWidgetSelect: () => {
|
|
49337
|
-
},
|
|
49338
|
-
openWidgetPallete: false,
|
|
49339
|
-
onCloseWidgetPallete: () => {
|
|
49340
|
-
},
|
|
49341
|
-
onApplyFilters: () => {
|
|
49342
|
-
},
|
|
49343
|
-
isApplyingFilters: false,
|
|
49344
|
-
onSaveLayoutReady: () => {
|
|
49345
|
-
},
|
|
49346
|
-
widgetBackendUrl
|
|
49347
|
-
},
|
|
49348
|
-
`presentation-grid-${pageId}`
|
|
49349
|
-
) })
|
|
49350
|
-
) : (
|
|
49351
|
-
/* Focus View - Show one widget at a time */
|
|
49352
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full flex flex-col", ref: focusContainerRef, children: focusableWidgets.length > 0 && currentFocusWidget ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 flex flex-col min-h-0", children: [
|
|
49353
|
-
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "shrink-0 bg-white border-b border-gray-200 px-6 py-3 flex items-center justify-between", children: [
|
|
49354
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49355
|
-
"button",
|
|
49356
|
-
{
|
|
49357
|
-
onClick: () => setCurrentFocusIndex((prev) => prev > 0 ? prev - 1 : focusableWidgets.length - 1),
|
|
49358
|
-
className: "p-2 rounded-full hover:bg-gray-100 transition-colors disabled:opacity-30",
|
|
49359
|
-
disabled: focusableWidgets.length <= 1,
|
|
49360
|
-
children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.ChevronLeft, { className: "w-5 h-5 text-gray-600" })
|
|
49361
|
-
}
|
|
49362
|
-
),
|
|
49363
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-gray-500", children: [
|
|
49364
|
-
currentFocusIndex + 1,
|
|
49365
|
-
" of ",
|
|
49366
|
-
focusableWidgets.length
|
|
49311
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49312
|
+
"div",
|
|
49313
|
+
{
|
|
49314
|
+
className: `fixed inset-0 z-50 bg-white flex flex-col ${laserPointerActive ? "[&_*]:!cursor-none !cursor-none" : ""}`,
|
|
49315
|
+
children: [
|
|
49316
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("header", { className: "flex items-center justify-between px-6 py-4 border-b border-gray-200 bg-white shrink-0", children: [
|
|
49317
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col", children: [
|
|
49318
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xl font-bold text-primary-700 tracking-wide", children: branding.title }),
|
|
49319
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs text-primary-500 tracking-[0.2em] -mt-1", children: branding.subtitle })
|
|
49367
49320
|
] }) }),
|
|
49321
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "absolute left-1/2 transform -translate-x-1/2 text-center", children: [
|
|
49322
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("h1", { className: "text-lg font-bold text-gray-900 uppercase tracking-wide", children: dashboardTitle }),
|
|
49323
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-12 h-1 bg-primary-600 mx-auto mt-1 rounded" })
|
|
49324
|
+
] }),
|
|
49368
49325
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49369
49326
|
"button",
|
|
49370
49327
|
{
|
|
49371
|
-
onClick:
|
|
49372
|
-
className: "p-2
|
|
49373
|
-
|
|
49374
|
-
children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.
|
|
49328
|
+
onClick: onClose,
|
|
49329
|
+
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors",
|
|
49330
|
+
"aria-label": "Close presentation",
|
|
49331
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.X, { className: "w-6 h-6 text-gray-600" })
|
|
49375
49332
|
}
|
|
49376
49333
|
)
|
|
49377
49334
|
] }),
|
|
49378
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("
|
|
49379
|
-
|
|
49380
|
-
{
|
|
49381
|
-
|
|
49382
|
-
|
|
49383
|
-
|
|
49384
|
-
|
|
49385
|
-
|
|
49386
|
-
|
|
49387
|
-
|
|
49388
|
-
|
|
49389
|
-
|
|
49390
|
-
|
|
49391
|
-
|
|
49392
|
-
|
|
49393
|
-
|
|
49394
|
-
|
|
49395
|
-
|
|
49396
|
-
|
|
49397
|
-
|
|
49398
|
-
|
|
49399
|
-
|
|
49400
|
-
|
|
49401
|
-
|
|
49402
|
-
|
|
49403
|
-
|
|
49404
|
-
|
|
49405
|
-
|
|
49406
|
-
|
|
49407
|
-
|
|
49408
|
-
|
|
49335
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: `flex-1 min-h-0 ${viewMode === "grid" ? "overflow-auto bg-gray-50 p-6" : "overflow-hidden bg-gray-100"}`, children: loading ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-3", children: [
|
|
49336
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-8 h-8 border-4 border-primary-600 border-t-transparent rounded-full animate-spin" }),
|
|
49337
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-gray-600", children: "Loading widgets..." })
|
|
49338
|
+
] }) }) : viewMode === "grid" ? (
|
|
49339
|
+
/* Grid View - Show all widgets using WidgetDashboard */
|
|
49340
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full relative", ref: gridContainerRef, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49341
|
+
WidgetDashboard,
|
|
49342
|
+
{
|
|
49343
|
+
pageId,
|
|
49344
|
+
isEditing: false,
|
|
49345
|
+
selectedWidget: null,
|
|
49346
|
+
onWidgetSelect: () => {
|
|
49347
|
+
},
|
|
49348
|
+
openWidgetPallete: false,
|
|
49349
|
+
onCloseWidgetPallete: () => {
|
|
49350
|
+
},
|
|
49351
|
+
onApplyFilters: () => {
|
|
49352
|
+
},
|
|
49353
|
+
isApplyingFilters: false,
|
|
49354
|
+
onSaveLayoutReady: () => {
|
|
49355
|
+
},
|
|
49356
|
+
widgetBackendUrl
|
|
49357
|
+
},
|
|
49358
|
+
`presentation-grid-${pageId}`
|
|
49359
|
+
) })
|
|
49360
|
+
) : (
|
|
49361
|
+
/* Focus View - Show one widget at a time */
|
|
49362
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full flex flex-col", ref: focusContainerRef, children: focusableWidgets.length > 0 && currentFocusWidget ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 flex flex-col min-h-0", children: [
|
|
49363
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "shrink-0 bg-white border-b border-gray-200 px-6 py-3 flex items-center justify-between", children: [
|
|
49364
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49365
|
+
"button",
|
|
49366
|
+
{
|
|
49367
|
+
onClick: () => setCurrentFocusIndex((prev) => prev > 0 ? prev - 1 : focusableWidgets.length - 1),
|
|
49368
|
+
className: "p-2 rounded-full hover:bg-gray-100 transition-colors disabled:opacity-30",
|
|
49369
|
+
disabled: focusableWidgets.length <= 1,
|
|
49370
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.ChevronLeft, { className: "w-5 h-5 text-gray-600" })
|
|
49371
|
+
}
|
|
49372
|
+
),
|
|
49373
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-gray-500", children: [
|
|
49374
|
+
currentFocusIndex + 1,
|
|
49375
|
+
" of ",
|
|
49376
|
+
focusableWidgets.length
|
|
49377
|
+
] }) }),
|
|
49378
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49379
|
+
"button",
|
|
49380
|
+
{
|
|
49381
|
+
onClick: () => setCurrentFocusIndex((prev) => prev < focusableWidgets.length - 1 ? prev + 1 : 0),
|
|
49382
|
+
className: "p-2 rounded-full hover:bg-gray-100 transition-colors disabled:opacity-30",
|
|
49383
|
+
disabled: focusableWidgets.length <= 1,
|
|
49384
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.ChevronRight, { className: "w-5 h-5 text-gray-600" })
|
|
49385
|
+
}
|
|
49386
|
+
)
|
|
49387
|
+
] }),
|
|
49388
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 bg-white p-6 min-h-0 overflow-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full w-full rounded-xl border border-gray-200 bg-white shadow-sm overflow-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49389
|
+
WidgetRenderer,
|
|
49390
|
+
{
|
|
49391
|
+
widget: currentFocusWidget,
|
|
49392
|
+
widgetBackendUrl,
|
|
49393
|
+
pageId,
|
|
49394
|
+
isEditing: false
|
|
49395
|
+
},
|
|
49396
|
+
`focus-widget-${currentFocusWidget.id}`
|
|
49397
|
+
) }) })
|
|
49398
|
+
] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center text-gray-500", children: [
|
|
49399
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.Maximize2, { className: "w-12 h-12 mx-auto mb-4 text-gray-300" }),
|
|
49400
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-lg font-medium", children: "No widgets available for focus view" }),
|
|
49401
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm mt-2", children: "Text, Spacer, and Filter widgets are excluded." })
|
|
49402
|
+
] }) }) })
|
|
49403
|
+
) }),
|
|
49404
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("footer", { className: "bg-white border-t border-gray-200 py-4 shrink-0", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-3", children: [
|
|
49405
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1 bg-gray-100 rounded-full p-1", children: [
|
|
49406
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49407
|
+
"button",
|
|
49408
|
+
{
|
|
49409
|
+
onClick: () => setViewMode("grid"),
|
|
49410
|
+
className: `flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium transition-all ${viewMode === "grid" ? "bg-primary-700 text-white shadow-md" : "text-gray-600 hover:text-gray-900"}`,
|
|
49411
|
+
children: [
|
|
49412
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.Grid3X3, { className: "w-4 h-4" }),
|
|
49413
|
+
"Grid"
|
|
49414
|
+
]
|
|
49415
|
+
}
|
|
49416
|
+
),
|
|
49417
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49418
|
+
"button",
|
|
49419
|
+
{
|
|
49420
|
+
onClick: () => setViewMode("focus"),
|
|
49421
|
+
className: `flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium transition-all ${viewMode === "focus" ? "bg-primary-700 text-white shadow-md" : "text-gray-600 hover:text-gray-900"}`,
|
|
49422
|
+
children: [
|
|
49423
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.Maximize2, { className: "w-4 h-4" }),
|
|
49424
|
+
"Focus"
|
|
49425
|
+
]
|
|
49426
|
+
}
|
|
49427
|
+
),
|
|
49428
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-px h-6 bg-gray-300 mx-2" }),
|
|
49429
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49430
|
+
"button",
|
|
49431
|
+
{
|
|
49432
|
+
onClick: () => setLaserPointerActive((prev) => !prev),
|
|
49433
|
+
className: `p-2 transition-colors rounded-full ${laserPointerActive ? "bg-primary-600 text-white" : "text-gray-600 hover:text-gray-900 hover:bg-gray-200"}`,
|
|
49434
|
+
"aria-label": "Toggle laser pointer (L)",
|
|
49435
|
+
title: "Toggle laser pointer (L)",
|
|
49436
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx(LaserPointerIcon, { className: "w-4 h-4" })
|
|
49437
|
+
}
|
|
49438
|
+
),
|
|
49439
|
+
viewMode === "focus" && focusableWidgets.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
|
|
49440
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-px h-6 bg-gray-300 mx-2" }),
|
|
49441
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-gray-600 px-2", children: [
|
|
49442
|
+
currentFocusIndex + 1,
|
|
49443
|
+
" / ",
|
|
49444
|
+
focusableWidgets.length
|
|
49445
|
+
] })
|
|
49446
|
+
] })
|
|
49447
|
+
] }),
|
|
49448
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-gray-400 uppercase tracking-wider", children: "ESC TO EXIT \u2022 F TO TOGGLE \u2022 L FOR LASER \u2022 ARROWS TO NAVIGATE" })
|
|
49449
|
+
] }) }),
|
|
49450
|
+
laserPointerActive && /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49451
|
+
"div",
|
|
49409
49452
|
{
|
|
49410
|
-
|
|
49411
|
-
|
|
49453
|
+
className: "fixed pointer-events-none z-[100] transform -translate-x-1/2 -translate-y-1/2",
|
|
49454
|
+
style: {
|
|
49455
|
+
left: mousePosition.x,
|
|
49456
|
+
top: mousePosition.y
|
|
49457
|
+
},
|
|
49412
49458
|
children: [
|
|
49413
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
49414
|
-
"
|
|
49459
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute inset-0 w-8 h-8 -translate-x-1/2 -translate-y-1/2 bg-red-500/20 rounded-full blur-md" }),
|
|
49460
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute w-4 h-4 -translate-x-1/2 -translate-y-1/2 bg-red-500 rounded-full shadow-lg shadow-red-500/50" })
|
|
49415
49461
|
]
|
|
49416
49462
|
}
|
|
49417
|
-
)
|
|
49418
|
-
|
|
49419
|
-
|
|
49420
|
-
|
|
49421
|
-
{
|
|
49422
|
-
onClick: () => setLaserPointerActive((prev) => !prev),
|
|
49423
|
-
className: `p-2 transition-colors rounded-full ${laserPointerActive ? "bg-primary-600 text-white" : "text-gray-600 hover:text-gray-900 hover:bg-gray-200"}`,
|
|
49424
|
-
"aria-label": "Toggle laser pointer (L)",
|
|
49425
|
-
title: "Toggle laser pointer (L)",
|
|
49426
|
-
children: /* @__PURE__ */ jsxRuntimeExports.jsx(LaserPointerIcon, { className: "w-4 h-4" })
|
|
49427
|
-
}
|
|
49428
|
-
),
|
|
49429
|
-
viewMode === "focus" && focusableWidgets.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
|
|
49430
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-px h-6 bg-gray-300 mx-2" }),
|
|
49431
|
-
/* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-gray-600 px-2", children: [
|
|
49432
|
-
currentFocusIndex + 1,
|
|
49433
|
-
" / ",
|
|
49434
|
-
focusableWidgets.length
|
|
49435
|
-
] })
|
|
49436
|
-
] })
|
|
49437
|
-
] }),
|
|
49438
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-gray-400 uppercase tracking-wider", children: "ESC TO EXIT \u2022 F TO TOGGLE \u2022 L FOR LASER \u2022 ARROWS TO NAVIGATE" })
|
|
49439
|
-
] }) }),
|
|
49440
|
-
laserPointerActive && /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
49441
|
-
"div",
|
|
49442
|
-
{
|
|
49443
|
-
className: "fixed pointer-events-none z-[100] transform -translate-x-1/2 -translate-y-1/2",
|
|
49444
|
-
style: {
|
|
49445
|
-
left: mousePosition.x,
|
|
49446
|
-
top: mousePosition.y
|
|
49447
|
-
},
|
|
49448
|
-
children: [
|
|
49449
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute inset-0 w-8 h-8 -translate-x-1/2 -translate-y-1/2 bg-red-500/20 rounded-full blur-md" }),
|
|
49450
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute w-4 h-4 -translate-x-1/2 -translate-y-1/2 bg-red-500 rounded-full shadow-lg shadow-red-500/50" })
|
|
49451
|
-
]
|
|
49452
|
-
}
|
|
49453
|
-
)
|
|
49454
|
-
] });
|
|
49463
|
+
)
|
|
49464
|
+
]
|
|
49465
|
+
}
|
|
49466
|
+
);
|
|
49455
49467
|
}
|
|
49456
49468
|
|
|
49457
49469
|
var __defProp = Object.defineProperty;
|