@launchdarkly/toolbar 0.19.0-beta.1 → 0.21.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -8
- package/dist/index.d.ts +1 -0
- package/dist/js/index.js +750 -505
- package/dist/js/plugins/index.js +13 -1
- package/dist/plugins/EventInterceptionPlugin.d.ts +4 -1
- package/dist/tests/plugins/EventInterceptionPlugin.test.d.ts +1 -0
- package/dist/types/plugin.d.ts +5 -0
- package/dist/ui/Toolbar/LaunchDarklyToolbar.css.d.ts +4 -2
- package/dist/ui/Toolbar/TabContent/SettingsTab.css.d.ts +1 -0
- package/dist/ui/Toolbar/components/CircleLogo.d.ts +3 -2
- package/dist/ui/Toolbar/components/ExpandedToolbarContent.d.ts +3 -3
- package/dist/ui/Toolbar/components/icons/ChevronUpIcon.d.ts +5 -0
- package/dist/ui/Toolbar/components/icons/LaunchDarklyLogo.d.ts +5 -0
- package/dist/ui/Toolbar/components/icons/index.d.ts +1 -0
- package/dist/ui/Toolbar/constants/animations.d.ts +68 -26
- package/dist/ui/Toolbar/context/AnalyticsProvider.d.ts +9 -0
- package/dist/ui/Toolbar/context/DevServerProvider.d.ts +0 -4
- package/dist/ui/Toolbar/context/ToolbarUIProvider.d.ts +13 -0
- package/dist/ui/Toolbar/context/index.d.ts +2 -0
- package/dist/ui/Toolbar/hooks/index.d.ts +0 -1
- package/dist/ui/Toolbar/hooks/useToolbarAnimations.d.ts +6 -3
- package/dist/ui/Toolbar/hooks/useToolbarDrag.d.ts +2 -1
- package/dist/ui/Toolbar/hooks/useToolbarState.d.ts +5 -6
- package/dist/ui/Toolbar/types/toolbar.d.ts +1 -1
- package/dist/utils/analytics.d.ts +54 -0
- package/package.json +1 -1
- package/dist/static/font/Audimat3000-Regulier.var-subset.woff2 +0 -0
- package/dist/static/font/Inter.var-subset.woff2 +0 -0
- package/dist/ui/Toolbar/hooks/useKeyPressed.d.ts +0 -1
package/dist/js/index.js
CHANGED
|
@@ -1,46 +1,9 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { AnimatePresence, motion } from "motion/react";
|
|
3
|
-
import react, { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
|
|
3
|
+
import react, { createContext, forwardRef, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
|
|
4
4
|
import { Button, Group, Input, ListBox, ListBoxItem, Popover, SearchField, Select, SelectValue, Switch, TextField } from "@launchpad-ui/components";
|
|
5
5
|
import { useVirtualizer } from "@tanstack/react-virtual";
|
|
6
6
|
var __webpack_modules__ = {
|
|
7
|
-
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@launchpad-ui+tokens@0.15.0/node_modules/@launchpad-ui/tokens/dist/fonts.css": function(module, __webpack_exports__, __webpack_require__) {
|
|
8
|
-
__webpack_require__.d(__webpack_exports__, {
|
|
9
|
-
A: ()=>__WEBPACK_DEFAULT_EXPORT__
|
|
10
|
-
});
|
|
11
|
-
var _rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/noSourceMaps.js");
|
|
12
|
-
var _rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/ __webpack_require__.n(_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
|
|
13
|
-
var _rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/api.js");
|
|
14
|
-
var _rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/ __webpack_require__.n(_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_api_js__WEBPACK_IMPORTED_MODULE_1__);
|
|
15
|
-
var _rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_getUrl_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/getUrl.js");
|
|
16
|
-
var _rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_getUrl_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/ __webpack_require__.n(_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_getUrl_js__WEBPACK_IMPORTED_MODULE_2__);
|
|
17
|
-
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(__webpack_require__("../../node_modules/.pnpm/@launchpad-ui+tokens@0.15.0/node_modules/@launchpad-ui/tokens/dist/assets/Audimat3000-Regulier.var-subset.woff2"), __webpack_require__.b);
|
|
18
|
-
var ___CSS_LOADER_URL_IMPORT_1___ = new URL(__webpack_require__("../../node_modules/.pnpm/@launchpad-ui+tokens@0.15.0/node_modules/@launchpad-ui/tokens/dist/assets/Inter.var-subset.woff2"), __webpack_require__.b);
|
|
19
|
-
var ___CSS_LOADER_EXPORT___ = _rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_api_js__WEBPACK_IMPORTED_MODULE_1___default()(_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default());
|
|
20
|
-
var ___CSS_LOADER_URL_REPLACEMENT_0___ = _rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_getUrl_js__WEBPACK_IMPORTED_MODULE_2___default()(___CSS_LOADER_URL_IMPORT_0___);
|
|
21
|
-
var ___CSS_LOADER_URL_REPLACEMENT_1___ = _rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_getUrl_js__WEBPACK_IMPORTED_MODULE_2___default()(___CSS_LOADER_URL_IMPORT_1___);
|
|
22
|
-
___CSS_LOADER_EXPORT___.push([
|
|
23
|
-
module.id,
|
|
24
|
-
`@font-face {
|
|
25
|
-
font-family: "Audimat 3000 Regulier";
|
|
26
|
-
font-style: normal;
|
|
27
|
-
font-weight: 400;
|
|
28
|
-
src: url(${___CSS_LOADER_URL_REPLACEMENT_0___}) format("woff2");
|
|
29
|
-
font-display: swap;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
@font-face {
|
|
33
|
-
font-family: Inter;
|
|
34
|
-
font-style: normal;
|
|
35
|
-
font-weight: 300 800;
|
|
36
|
-
src: url(${___CSS_LOADER_URL_REPLACEMENT_1___}) format("woff2");
|
|
37
|
-
font-display: swap;
|
|
38
|
-
}
|
|
39
|
-
`,
|
|
40
|
-
""
|
|
41
|
-
]);
|
|
42
|
-
const __WEBPACK_DEFAULT_EXPORT__ = ___CSS_LOADER_EXPORT___;
|
|
43
|
-
},
|
|
44
7
|
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@launchpad-ui+tokens@0.15.0/node_modules/@launchpad-ui/tokens/dist/index.css": function(module, __webpack_exports__, __webpack_require__) {
|
|
45
8
|
__webpack_require__.d(__webpack_exports__, {
|
|
46
9
|
A: ()=>__WEBPACK_DEFAULT_EXPORT__
|
|
@@ -629,7 +592,7 @@ var __webpack_modules__ = {
|
|
|
629
592
|
]);
|
|
630
593
|
const __WEBPACK_DEFAULT_EXPORT__ = ___CSS_LOADER_EXPORT___;
|
|
631
594
|
},
|
|
632
|
-
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/Header/Header.css.ts.vanilla.css\",\"source\":\"#
|
|
595
|
+
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/Header/Header.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA62V227jIBBA3/MVo0ortdJS4TRJE/K4H7LCNrZpMSDAjbOr/vsKbC924qSp2pckMMNczlzy+HvXVDv6guHvAiDnVgt6JFAanu8XEL6RY7UW1DGUKdHU0hKgjVOQFCb8ONejhlFL4E6oUkHGpGMGaOa4kvbOa1PBS4m4Y7Ulvdxfa5rnXJYEMGx1CxiSjW69IKXZa2lUI3MfgjIE3qi5R0jo7oxKQ49oh/FD0FYmZwalyjlVE0h0C1YJns8+ep4+MjTnjSWQLHXbfWDAXl5ziSrGy8oRWPdhlVR3mvvF++KxB5kEkIGHx0DAQ9iP2RaCtVcoBKvbqdFlMHrguasIJOtV53+IZyiCSl9Y5lDBHYFMSUe59NcFF44ZAqnx6pJZe48fgMs3Ztx98jD28xT8FEo6ZPkfRiDpXYWrQ+9vgwOSK6VY9VTDs4LWXBxHiqNblFLLguqh4o4hq2nGCEh1MFSPI1udYo3AzsC+NNbx4og8AybdWPcCc1/dnm5XbdoO5wTjH+NA1iGQ2zpyO99c647p/MPUUG/0SGVk8z/DVKjs9TawtZIq0IyF6EuKO/fqjZlCqAOBiuc5k5MJXOm260EAx1qHojITgmvL7cWazdDrjQT4EXtkujktbr8sPj02eDo2z9Ol9oGFi20TDW6/2+DupJs8Rsliz8Rz1hjr20UrfrYvhzU5bbP+9svRAjhDpeW+JKTrWsCPSwuMWvbzbBSibJIoqXwPhXSvTMxymJhPzFd0Qrv1xYW4tpaifhr0hzX6tJl2TxakPWRkOiX81VWeT1Z5Px4frtL4nt2UY/Swmf5XJCdJFufhRGE5F+vMdM+tktu3cvRXTfzNRj6knjXGMOl++cT3i/d/eH3aB8cIAAA=\"}!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/extracted.js": function(module, __webpack_exports__, __webpack_require__) {
|
|
633
596
|
__webpack_require__.d(__webpack_exports__, {
|
|
634
597
|
A: ()=>__WEBPACK_DEFAULT_EXPORT__
|
|
635
598
|
});
|
|
@@ -663,7 +626,7 @@ var __webpack_modules__ = {
|
|
|
663
626
|
._9uh9aj2 {
|
|
664
627
|
object-fit: contain;
|
|
665
628
|
filter: brightness(0) invert();
|
|
666
|
-
width:
|
|
629
|
+
width: 154px;
|
|
667
630
|
height: auto;
|
|
668
631
|
}
|
|
669
632
|
|
|
@@ -777,7 +740,7 @@ var __webpack_modules__ = {
|
|
|
777
740
|
]);
|
|
778
741
|
const __WEBPACK_DEFAULT_EXPORT__ = ___CSS_LOADER_EXPORT___;
|
|
779
742
|
},
|
|
780
|
-
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/LaunchDarklyToolbar.css.ts.vanilla.css\",\"source\":\"#
|
|
743
|
+
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/LaunchDarklyToolbar.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA61UwW7jIBC95yvmslJyoMLZZJuSj6kwYHsaAhaMU6er/vsKnKRx4q661R5neLx5M2/g4blwK4XHI4ffM4DWRyT0TkCFvdHbGcAbQ6dNL6DgnKdEKdWuDr5zmilvfRBwkGHOmG2HmNVBHtkT54uM9kGbIKBoe4jeop5EP57Q/mBCZf2rgAa1Ni7lVBdiqtJ6dGRCSmmMrZVHAZU1fUpIi7VjSGYfBShzxr10kbA6MuUdGUcfR++zh3PjRW48YN2QgCVv+0E1kd9/xBSki5UPe+YD1ujECTHcG/EtM5811Xfo0rUR288pdeTbv3GRbyd0rSZ0fYHoTtE689yZcoX4NUJoU8nOUqqQ3GIag1HDjilvu7278y9SMKSaSQMzRSQZxqIeb7ZXltHbjsylyTX/sb20fwpeUVMjYLUZ+m/MMOVz/D+XbJP1nQoubwqeY1++GEWswsThHUnMs6nQUnpBZfbUmRjnfAHoDibQvFhcBhubgG4ngI/El9ar3UjL07WWgg+zuGv2M6+uiGQm+rfvYOqBD18EC1JjFwUUyzSOqzplrrNHxy4WrfkNRmXMVy1rpdboagGbtofT9L/zrX2uWWc9SYaAYjt7/wMZkZDPaAUAAA==\"}!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/extracted.js": function(module, __webpack_exports__, __webpack_require__) {
|
|
781
744
|
__webpack_require__.d(__webpack_exports__, {
|
|
782
745
|
A: ()=>__WEBPACK_DEFAULT_EXPORT__
|
|
783
746
|
});
|
|
@@ -797,76 +760,89 @@ var __webpack_modules__ = {
|
|
|
797
760
|
align-items: center;
|
|
798
761
|
display: flex;
|
|
799
762
|
position: fixed;
|
|
800
|
-
bottom: 20px;
|
|
801
763
|
overflow: hidden;
|
|
802
764
|
}
|
|
803
765
|
|
|
804
766
|
._1n4ciyy1 {
|
|
805
767
|
transform-origin: 100% 100%;
|
|
768
|
+
bottom: 20px;
|
|
806
769
|
right: 20px;
|
|
807
770
|
}
|
|
808
771
|
|
|
809
772
|
._1n4ciyy2 {
|
|
810
773
|
transform-origin: 0 100%;
|
|
774
|
+
bottom: 20px;
|
|
811
775
|
left: 20px;
|
|
812
776
|
}
|
|
813
777
|
|
|
814
778
|
._1n4ciyy3 {
|
|
815
|
-
|
|
779
|
+
transform-origin: 100% 0;
|
|
780
|
+
top: 20px;
|
|
781
|
+
right: 20px;
|
|
816
782
|
}
|
|
817
783
|
|
|
818
784
|
._1n4ciyy4 {
|
|
785
|
+
transform-origin: 0 0;
|
|
786
|
+
top: 20px;
|
|
787
|
+
left: 20px;
|
|
788
|
+
}
|
|
789
|
+
|
|
790
|
+
._1n4ciyy5 {
|
|
791
|
+
cursor: pointer;
|
|
792
|
+
}
|
|
793
|
+
|
|
794
|
+
._1n4ciyy6 {
|
|
819
795
|
cursor: default;
|
|
820
796
|
flex-direction: column;
|
|
821
797
|
justify-content: flex-start;
|
|
822
798
|
align-items: stretch;
|
|
823
799
|
}
|
|
824
800
|
|
|
825
|
-
.
|
|
801
|
+
._1n4ciyy7 {
|
|
826
802
|
justify-content: center;
|
|
827
803
|
align-items: center;
|
|
828
|
-
width:
|
|
829
|
-
height:
|
|
804
|
+
width: 48px;
|
|
805
|
+
height: 48px;
|
|
830
806
|
display: flex;
|
|
831
807
|
position: absolute;
|
|
832
808
|
top: 50%;
|
|
833
809
|
left: 50%;
|
|
834
810
|
}
|
|
835
811
|
|
|
836
|
-
.
|
|
812
|
+
._1n4ciyy8 {
|
|
837
813
|
object-fit: contain;
|
|
838
814
|
filter: brightness(0) invert();
|
|
839
815
|
flex-shrink: 0;
|
|
840
|
-
width:
|
|
841
|
-
height:
|
|
816
|
+
width: 28px;
|
|
817
|
+
height: 28px;
|
|
842
818
|
display: block;
|
|
843
819
|
}
|
|
844
820
|
|
|
845
|
-
.
|
|
821
|
+
._1n4ciyy9 {
|
|
846
822
|
flex-direction: column;
|
|
847
823
|
width: 100%;
|
|
848
824
|
display: flex;
|
|
849
825
|
}
|
|
850
826
|
|
|
851
|
-
.
|
|
827
|
+
._1n4ciyya {
|
|
852
828
|
background-color: var(--lp-color-gray-900);
|
|
853
|
-
border-radius: 12px
|
|
829
|
+
border-radius: 12px;
|
|
854
830
|
overflow: hidden;
|
|
855
831
|
}
|
|
856
832
|
|
|
857
|
-
.
|
|
833
|
+
._1n4ciyyb {
|
|
858
834
|
min-height: 450px;
|
|
859
835
|
}
|
|
860
836
|
|
|
861
|
-
.
|
|
837
|
+
._1n4ciyyc {
|
|
862
838
|
background-color: var(--lp-color-gray-900);
|
|
863
|
-
border-radius:
|
|
839
|
+
border-radius: 12px;
|
|
864
840
|
align-items: center;
|
|
865
841
|
padding: 8px;
|
|
866
842
|
display: flex;
|
|
867
843
|
}
|
|
868
844
|
|
|
869
|
-
.
|
|
845
|
+
._1n4ciyyd {
|
|
870
846
|
flex: 1;
|
|
871
847
|
}
|
|
872
848
|
`,
|
|
@@ -1203,7 +1179,7 @@ var __webpack_modules__ = {
|
|
|
1203
1179
|
]);
|
|
1204
1180
|
const __WEBPACK_DEFAULT_EXPORT__ = ___CSS_LOADER_EXPORT___;
|
|
1205
1181
|
},
|
|
1206
|
-
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/TabContent/SettingsTab.css.ts.vanilla.css\",\"source\":\"#
|
|
1182
|
+
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/TabContent/SettingsTab.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA6VUy3LbMAy8+ytwbA/0SIrjOvSxH5KhRUhCQ5EcErbkdPLvHdKPyI+kmfakEUDurhZYzZ/LsmEbdwX8ngFsXNAYxMYxu15C6UeIzpCGnQrfhDBe1M64INqg9mJVFN/Xs7fZ/IwhjYos6o6MvgdnncWLC2U+1avQkpVQrGcAXmlNtpVQLv0IVeFHWPkxdRpnWUR6RQllNSkNSG3HEpZFBsgC5V3BiywYgHFkwUHZ2LjQS9h6j6FWEVPTIDMGEb2qs45i/pjIJqqrrPqOnI2qX9rgtlaLT1Q8Xdv2cMAzOEooE46m6I3ay1xLBWWotYIY+yihRssYUvnXNjI1e1E7y2hZQhKNYoM8INp0olX+JG9CuMiENyzpKTQFrJmclcnJbf8Oc43yeGPD4s5UFn+dSnXtx/Ijf78w2nyrUT2Z/eTgpCp6Z1326ZL0x31PPnA+G3Lcy5spZB/R6gv81T981MP/ftRTJh1Ic3cIVELrjpM5vTdkjIR6GwJa/pnYz8sQu0D2JSdzgqoO2T4vu4ScJa8SQLrbkxUn0pTgXFPjqVYVx9onHJvM4XYYGuMGCR1pfVjpHN73BhpDPlJMraEjxpxcTD+bISi/nibr7Q/GMgCb7gQAAA==\"}!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/extracted.js": function(module, __webpack_exports__, __webpack_require__) {
|
|
1207
1183
|
__webpack_require__.d(__webpack_exports__, {
|
|
1208
1184
|
A: ()=>__WEBPACK_DEFAULT_EXPORT__
|
|
1209
1185
|
});
|
|
@@ -1233,6 +1209,11 @@ var __webpack_modules__ = {
|
|
|
1233
1209
|
}
|
|
1234
1210
|
|
|
1235
1211
|
._11ftnsv2 {
|
|
1212
|
+
background-color: var(--lp-color-gray-900);
|
|
1213
|
+
font-size: 12px;
|
|
1214
|
+
}
|
|
1215
|
+
|
|
1216
|
+
._11ftnsv3 {
|
|
1236
1217
|
flex: 1;
|
|
1237
1218
|
justify-content: space-between;
|
|
1238
1219
|
align-items: center;
|
|
@@ -1240,52 +1221,52 @@ var __webpack_modules__ = {
|
|
|
1240
1221
|
display: flex;
|
|
1241
1222
|
}
|
|
1242
1223
|
|
|
1243
|
-
.
|
|
1224
|
+
._11ftnsv4 {
|
|
1244
1225
|
flex-direction: column;
|
|
1245
1226
|
gap: 2px;
|
|
1246
1227
|
display: flex;
|
|
1247
1228
|
}
|
|
1248
1229
|
|
|
1249
|
-
.
|
|
1230
|
+
._11ftnsv5 {
|
|
1250
1231
|
color: var(--lp-color-gray-200);
|
|
1251
1232
|
font-size: 14px;
|
|
1252
1233
|
font-weight: 400;
|
|
1253
1234
|
}
|
|
1254
1235
|
|
|
1255
|
-
.
|
|
1236
|
+
._11ftnsv6 {
|
|
1256
1237
|
color: var(--lp-color-gray-400);
|
|
1257
1238
|
font-size: 12px;
|
|
1258
1239
|
font-family: var(--lp-font-family-monospace);
|
|
1259
1240
|
}
|
|
1260
1241
|
|
|
1261
|
-
.
|
|
1242
|
+
._11ftnsv7 {
|
|
1262
1243
|
justify-content: flex-end;
|
|
1263
1244
|
align-items: center;
|
|
1264
1245
|
gap: 8px;
|
|
1265
1246
|
display: flex;
|
|
1266
1247
|
}
|
|
1267
1248
|
|
|
1268
|
-
.
|
|
1249
|
+
._11ftnsv8 {
|
|
1269
1250
|
color: var(--lp-color-gray-300);
|
|
1270
1251
|
font-size: 12px;
|
|
1271
1252
|
font-family: var(--lp-font-family-monospace);
|
|
1272
1253
|
}
|
|
1273
1254
|
|
|
1274
|
-
.
|
|
1255
|
+
._11ftnsv9 {
|
|
1275
1256
|
fill: currentColor;
|
|
1276
1257
|
flex-shrink: 0;
|
|
1277
1258
|
width: 16px;
|
|
1278
1259
|
height: 16px;
|
|
1279
1260
|
}
|
|
1280
1261
|
|
|
1281
|
-
.
|
|
1262
|
+
._11ftnsva {
|
|
1282
1263
|
background: none;
|
|
1283
1264
|
flex-shrink: 0;
|
|
1284
1265
|
min-width: 120px;
|
|
1285
1266
|
max-width: 200px;
|
|
1286
1267
|
}
|
|
1287
1268
|
|
|
1288
|
-
.
|
|
1269
|
+
._11ftnsvb {
|
|
1289
1270
|
text-overflow: ellipsis;
|
|
1290
1271
|
white-space: nowrap;
|
|
1291
1272
|
flex: 1;
|
|
@@ -1880,14 +1861,27 @@ var __webpack_modules__ = {
|
|
|
1880
1861
|
var _node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/ __webpack_require__.n(_node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_api_js__WEBPACK_IMPORTED_MODULE_1__);
|
|
1881
1862
|
var _node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_index_js_ruleSet_1_rules_2_use_1_builtin_lightningcss_loader_ruleSet_1_rules_2_use_2_node_modules_pnpm_launchpad_ui_tokens_0_15_0_node_modules_launchpad_ui_tokens_dist_index_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@launchpad-ui+tokens@0.15.0/node_modules/@launchpad-ui/tokens/dist/index.css");
|
|
1882
1863
|
var _node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_index_js_ruleSet_1_rules_2_use_1_builtin_lightningcss_loader_ruleSet_1_rules_2_use_2_node_modules_pnpm_launchpad_ui_tokens_0_15_0_node_modules_launchpad_ui_tokens_dist_themes_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@launchpad-ui+tokens@0.15.0/node_modules/@launchpad-ui/tokens/dist/themes.css");
|
|
1883
|
-
var _node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_index_js_ruleSet_1_rules_2_use_1_builtin_lightningcss_loader_ruleSet_1_rules_2_use_2_node_modules_pnpm_launchpad_ui_tokens_0_15_0_node_modules_launchpad_ui_tokens_dist_fonts_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@launchpad-ui+tokens@0.15.0/node_modules/@launchpad-ui/tokens/dist/fonts.css");
|
|
1884
1864
|
var ___CSS_LOADER_EXPORT___ = _node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_api_js__WEBPACK_IMPORTED_MODULE_1___default()(_node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default());
|
|
1885
1865
|
___CSS_LOADER_EXPORT___.i(_node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_index_js_ruleSet_1_rules_2_use_1_builtin_lightningcss_loader_ruleSet_1_rules_2_use_2_node_modules_pnpm_launchpad_ui_tokens_0_15_0_node_modules_launchpad_ui_tokens_dist_index_css__WEBPACK_IMPORTED_MODULE_2__.A);
|
|
1886
1866
|
___CSS_LOADER_EXPORT___.i(_node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_index_js_ruleSet_1_rules_2_use_1_builtin_lightningcss_loader_ruleSet_1_rules_2_use_2_node_modules_pnpm_launchpad_ui_tokens_0_15_0_node_modules_launchpad_ui_tokens_dist_themes_css__WEBPACK_IMPORTED_MODULE_3__.A);
|
|
1887
|
-
___CSS_LOADER_EXPORT___.i(_node_modules_pnpm_rsbuild_core_1_5_4_node_modules_rsbuild_core_compiled_css_loader_index_js_ruleSet_1_rules_2_use_1_builtin_lightningcss_loader_ruleSet_1_rules_2_use_2_node_modules_pnpm_launchpad_ui_tokens_0_15_0_node_modules_launchpad_ui_tokens_dist_fonts_css__WEBPACK_IMPORTED_MODULE_4__.A);
|
|
1888
1867
|
___CSS_LOADER_EXPORT___.push([
|
|
1889
1868
|
module.id,
|
|
1890
|
-
|
|
1869
|
+
`@font-face {
|
|
1870
|
+
font-family: inter;
|
|
1871
|
+
src: url("https://static.launchdarkly.com/app/s/ld/inter.var-subset.woff2") format("woff2");
|
|
1872
|
+
font-display: swap;
|
|
1873
|
+
font-weight: 300 700;
|
|
1874
|
+
}
|
|
1875
|
+
|
|
1876
|
+
@font-face {
|
|
1877
|
+
font-family: "Audimat 3000 Regulier";
|
|
1878
|
+
src: url("https://static.launchdarkly.com/app/s/ld/Audimat3000-Regulier.var-subset.woff2") format("woff2");
|
|
1879
|
+
font-display: swap;
|
|
1880
|
+
font-weight: 400;
|
|
1881
|
+
-webkit-font-smoothing: antialiased;
|
|
1882
|
+
}
|
|
1883
|
+
|
|
1884
|
+
body {
|
|
1891
1885
|
font-family: var(--lp-font-family-base);
|
|
1892
1886
|
color: var(--lp-color-text-ui-primary-base);
|
|
1893
1887
|
margin: 0;
|
|
@@ -1897,12 +1891,6 @@ var __webpack_modules__ = {
|
|
|
1897
1891
|
]);
|
|
1898
1892
|
const __WEBPACK_DEFAULT_EXPORT__ = ___CSS_LOADER_EXPORT___;
|
|
1899
1893
|
},
|
|
1900
|
-
"../../node_modules/.pnpm/@launchpad-ui+tokens@0.15.0/node_modules/@launchpad-ui/tokens/dist/assets/Audimat3000-Regulier.var-subset.woff2": function(module, __unused_webpack_exports, __webpack_require__) {
|
|
1901
|
-
module.exports = __webpack_require__.p + "static/font/Audimat3000-Regulier.var-subset.woff2";
|
|
1902
|
-
},
|
|
1903
|
-
"../../node_modules/.pnpm/@launchpad-ui+tokens@0.15.0/node_modules/@launchpad-ui/tokens/dist/assets/Inter.var-subset.woff2": function(module, __unused_webpack_exports, __webpack_require__) {
|
|
1904
|
-
module.exports = __webpack_require__.p + "static/font/Inter.var-subset.woff2";
|
|
1905
|
-
},
|
|
1906
1894
|
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/api.js": function(module) {
|
|
1907
1895
|
module.exports = function(cssWithMappingToString) {
|
|
1908
1896
|
var list = [];
|
|
@@ -1956,17 +1944,6 @@ var __webpack_modules__ = {
|
|
|
1956
1944
|
return list;
|
|
1957
1945
|
};
|
|
1958
1946
|
},
|
|
1959
|
-
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/getUrl.js": function(module) {
|
|
1960
|
-
module.exports = function(url, options) {
|
|
1961
|
-
if (!options) options = {};
|
|
1962
|
-
if (!url) return url;
|
|
1963
|
-
url = String(url.__esModule ? url.default : url);
|
|
1964
|
-
if (/^['"].*['"]$/.test(url)) url = url.slice(1, -1);
|
|
1965
|
-
if (options.hash) url += options.hash;
|
|
1966
|
-
if (/["'() \t\n]|(%20)/.test(url) || options.needQuotes) return "\"".concat(url.replace(/"/g, '\\"').replace(/\n/g, "\\n"), "\"");
|
|
1967
|
-
return url;
|
|
1968
|
-
};
|
|
1969
|
-
},
|
|
1970
1947
|
"../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/noSourceMaps.js": function(module) {
|
|
1971
1948
|
module.exports = function(i) {
|
|
1972
1949
|
return i[1];
|
|
@@ -2145,7 +2122,6 @@ function __webpack_require__(moduleId) {
|
|
|
2145
2122
|
__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
|
|
2146
2123
|
return module.exports;
|
|
2147
2124
|
}
|
|
2148
|
-
__webpack_require__.m = __webpack_modules__;
|
|
2149
2125
|
(()=>{
|
|
2150
2126
|
__webpack_require__.n = (module)=>{
|
|
2151
2127
|
var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
|
|
@@ -2163,32 +2139,12 @@ __webpack_require__.m = __webpack_modules__;
|
|
|
2163
2139
|
});
|
|
2164
2140
|
};
|
|
2165
2141
|
})();
|
|
2166
|
-
(()=>{
|
|
2167
|
-
__webpack_require__.g = (()=>{
|
|
2168
|
-
if ('object' == typeof globalThis) return globalThis;
|
|
2169
|
-
try {
|
|
2170
|
-
return this || new Function('return this')();
|
|
2171
|
-
} catch (e) {
|
|
2172
|
-
if ('object' == typeof window) return window;
|
|
2173
|
-
}
|
|
2174
|
-
})();
|
|
2175
|
-
})();
|
|
2176
2142
|
(()=>{
|
|
2177
2143
|
__webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
|
|
2178
2144
|
})();
|
|
2179
2145
|
(()=>{
|
|
2180
2146
|
__webpack_require__.nc = void 0;
|
|
2181
2147
|
})();
|
|
2182
|
-
(()=>{
|
|
2183
|
-
var scriptUrl;
|
|
2184
|
-
if ("string" == typeof import.meta.url) scriptUrl = import.meta.url;
|
|
2185
|
-
if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");
|
|
2186
|
-
scriptUrl = scriptUrl.replace(/^blob:/, "").replace(/#.*$/, "").replace(/\?.*$/, "").replace(/\/[^\/]+$/, "/");
|
|
2187
|
-
__webpack_require__.p = scriptUrl + '../';
|
|
2188
|
-
})();
|
|
2189
|
-
(()=>{
|
|
2190
|
-
// __webpack_require__.b = new URL("../", import.meta.url);
|
|
2191
|
-
})();
|
|
2192
2148
|
var injectStylesIntoStyleTag = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/style-loader/runtime/injectStylesIntoStyleTag.js");
|
|
2193
2149
|
var injectStylesIntoStyleTag_default = /*#__PURE__*/ __webpack_require__.n(injectStylesIntoStyleTag);
|
|
2194
2150
|
var styleDomAPI = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/style-loader/runtime/styleDomAPI.js");
|
|
@@ -2229,6 +2185,127 @@ function useSearchContext() {
|
|
|
2229
2185
|
if (!context) throw new Error('useSearchContext must be used within a SearchProvider');
|
|
2230
2186
|
return context;
|
|
2231
2187
|
}
|
|
2188
|
+
function isDoNotTrackEnabled() {
|
|
2189
|
+
let flag;
|
|
2190
|
+
if ('undefined' != typeof window && window.navigator) flag = void 0 !== window.navigator.doNotTrack ? window.navigator.doNotTrack : void 0 !== window.navigator.msDoNotTrack ? window.navigator.msDoNotTrack : window.doNotTrack;
|
|
2191
|
+
return 1 === flag || true === flag || '1' === flag || 'yes' === flag;
|
|
2192
|
+
}
|
|
2193
|
+
const ANALYTICS_EVENT_PREFIX = 'ld.toolbar';
|
|
2194
|
+
const EVENTS = {
|
|
2195
|
+
INITIALIZED: 'initialized',
|
|
2196
|
+
POSITION_CHANGED: 'position.changed',
|
|
2197
|
+
PIN_TOGGLED: 'pin.toggled',
|
|
2198
|
+
TAB_CHANGED: 'tab.changed',
|
|
2199
|
+
SEARCH: 'search',
|
|
2200
|
+
TOGGLE: 'toggle',
|
|
2201
|
+
TOGGLE_FLAG: 'toggle.flag',
|
|
2202
|
+
OPEN_FLAG_DEEPLINK: 'open.flag.deeplink',
|
|
2203
|
+
SHOW_OVERRIDES_ONLY: 'show.overrides.only',
|
|
2204
|
+
EVENT_CLICK: 'event.click'
|
|
2205
|
+
};
|
|
2206
|
+
class ToolbarAnalytics {
|
|
2207
|
+
ldClient = null;
|
|
2208
|
+
searchDebounceTimer = null;
|
|
2209
|
+
constructor(ldClient){
|
|
2210
|
+
this.ldClient = ldClient || null;
|
|
2211
|
+
}
|
|
2212
|
+
track(eventName, properties) {
|
|
2213
|
+
const fullEventName = `${ANALYTICS_EVENT_PREFIX}.${eventName}`;
|
|
2214
|
+
if (!this.ldClient) return void console.debug('ToolbarAnalytics: LDClient not available, skipping track event:', fullEventName);
|
|
2215
|
+
if (isDoNotTrackEnabled()) return;
|
|
2216
|
+
try {
|
|
2217
|
+
this.ldClient.track(fullEventName, properties);
|
|
2218
|
+
} catch (error) {
|
|
2219
|
+
console.error('ToolbarAnalytics: Failed to track event:', fullEventName, error);
|
|
2220
|
+
}
|
|
2221
|
+
}
|
|
2222
|
+
trackInitialization() {
|
|
2223
|
+
this.track(EVENTS.INITIALIZED, {});
|
|
2224
|
+
}
|
|
2225
|
+
trackPositionChange(oldPosition, newPosition, source) {
|
|
2226
|
+
this.track(EVENTS.POSITION_CHANGED, {
|
|
2227
|
+
oldPosition,
|
|
2228
|
+
newPosition,
|
|
2229
|
+
source
|
|
2230
|
+
});
|
|
2231
|
+
}
|
|
2232
|
+
trackPinToggle(action) {
|
|
2233
|
+
this.track(EVENTS.PIN_TOGGLED, {
|
|
2234
|
+
action
|
|
2235
|
+
});
|
|
2236
|
+
}
|
|
2237
|
+
trackTabChange(fromTab, toTab) {
|
|
2238
|
+
this.track(EVENTS.TAB_CHANGED, {
|
|
2239
|
+
fromTab,
|
|
2240
|
+
toTab
|
|
2241
|
+
});
|
|
2242
|
+
}
|
|
2243
|
+
trackSearch(query) {
|
|
2244
|
+
if (this.searchDebounceTimer) clearTimeout(this.searchDebounceTimer);
|
|
2245
|
+
this.searchDebounceTimer = setTimeout(()=>{
|
|
2246
|
+
if (!query) return;
|
|
2247
|
+
this.track(EVENTS.SEARCH, {
|
|
2248
|
+
query
|
|
2249
|
+
});
|
|
2250
|
+
this.searchDebounceTimer = null;
|
|
2251
|
+
}, 1000);
|
|
2252
|
+
}
|
|
2253
|
+
trackToolbarToggle(action, trigger) {
|
|
2254
|
+
this.track(EVENTS.TOGGLE, {
|
|
2255
|
+
action,
|
|
2256
|
+
trigger
|
|
2257
|
+
});
|
|
2258
|
+
}
|
|
2259
|
+
trackFlagOverride(flagKey, value, action) {
|
|
2260
|
+
this.track(EVENTS.TOGGLE_FLAG, {
|
|
2261
|
+
flagKey,
|
|
2262
|
+
value: 'remove' === action ? null : value,
|
|
2263
|
+
action
|
|
2264
|
+
});
|
|
2265
|
+
}
|
|
2266
|
+
trackOpenFlagDeeplink(flagKey, baseUrl) {
|
|
2267
|
+
this.track(EVENTS.OPEN_FLAG_DEEPLINK, {
|
|
2268
|
+
flagKey,
|
|
2269
|
+
baseUrl
|
|
2270
|
+
});
|
|
2271
|
+
}
|
|
2272
|
+
trackShowOverridesOnlyClick(enabled) {
|
|
2273
|
+
this.track(EVENTS.SHOW_OVERRIDES_ONLY, {
|
|
2274
|
+
enabled
|
|
2275
|
+
});
|
|
2276
|
+
}
|
|
2277
|
+
trackEventClick(eventName) {
|
|
2278
|
+
this.track(EVENTS.EVENT_CLICK, {
|
|
2279
|
+
eventName
|
|
2280
|
+
});
|
|
2281
|
+
}
|
|
2282
|
+
}
|
|
2283
|
+
const AnalyticsContext = /*#__PURE__*/ createContext(null);
|
|
2284
|
+
function AnalyticsProvider({ children, ldClient }) {
|
|
2285
|
+
const analytics = useMemo(()=>new ToolbarAnalytics(ldClient), [
|
|
2286
|
+
ldClient
|
|
2287
|
+
]);
|
|
2288
|
+
const hasInitialized = useRef(false);
|
|
2289
|
+
useEffect(()=>{
|
|
2290
|
+
if (!hasInitialized.current) {
|
|
2291
|
+
analytics.trackInitialization();
|
|
2292
|
+
hasInitialized.current = true;
|
|
2293
|
+
}
|
|
2294
|
+
}, [
|
|
2295
|
+
analytics
|
|
2296
|
+
]);
|
|
2297
|
+
return /*#__PURE__*/ jsx(AnalyticsContext.Provider, {
|
|
2298
|
+
value: {
|
|
2299
|
+
analytics
|
|
2300
|
+
},
|
|
2301
|
+
children: children
|
|
2302
|
+
});
|
|
2303
|
+
}
|
|
2304
|
+
function useAnalytics() {
|
|
2305
|
+
const context = useContext(AnalyticsContext);
|
|
2306
|
+
if (!context) throw new Error('useAnalytics must be used within an AnalyticsProvider');
|
|
2307
|
+
return context.analytics;
|
|
2308
|
+
}
|
|
2232
2309
|
const EASING = {
|
|
2233
2310
|
bounce: [
|
|
2234
2311
|
0.34,
|
|
@@ -2250,60 +2327,98 @@ const EASING = {
|
|
|
2250
2327
|
]
|
|
2251
2328
|
};
|
|
2252
2329
|
const ANIMATION_CONFIG = {
|
|
2330
|
+
containerExpand: {
|
|
2331
|
+
width: {
|
|
2332
|
+
duration: 0.25,
|
|
2333
|
+
ease: EASING.smooth
|
|
2334
|
+
},
|
|
2335
|
+
height: {
|
|
2336
|
+
duration: 0.25,
|
|
2337
|
+
ease: EASING.smooth
|
|
2338
|
+
},
|
|
2339
|
+
borderRadius: {
|
|
2340
|
+
duration: 0.2,
|
|
2341
|
+
ease: EASING.smooth
|
|
2342
|
+
},
|
|
2343
|
+
boxShadow: {
|
|
2344
|
+
duration: 0.2,
|
|
2345
|
+
ease: 'easeInOut'
|
|
2346
|
+
}
|
|
2347
|
+
},
|
|
2348
|
+
containerCollapse: {
|
|
2349
|
+
width: {
|
|
2350
|
+
duration: 0.35,
|
|
2351
|
+
ease: EASING.elastic
|
|
2352
|
+
},
|
|
2353
|
+
height: {
|
|
2354
|
+
duration: 0.35,
|
|
2355
|
+
ease: EASING.elastic
|
|
2356
|
+
},
|
|
2357
|
+
borderRadius: {
|
|
2358
|
+
duration: 0.25,
|
|
2359
|
+
ease: EASING.smooth
|
|
2360
|
+
},
|
|
2361
|
+
boxShadow: {
|
|
2362
|
+
duration: 0.25,
|
|
2363
|
+
ease: 'easeInOut'
|
|
2364
|
+
}
|
|
2365
|
+
},
|
|
2253
2366
|
container: {
|
|
2254
2367
|
width: {
|
|
2255
|
-
duration: 0.
|
|
2256
|
-
ease: EASING.
|
|
2368
|
+
duration: 0.25,
|
|
2369
|
+
ease: EASING.smooth
|
|
2257
2370
|
},
|
|
2258
2371
|
height: {
|
|
2259
|
-
duration: 0.
|
|
2260
|
-
ease: EASING.
|
|
2372
|
+
duration: 0.25,
|
|
2373
|
+
ease: EASING.smooth
|
|
2261
2374
|
},
|
|
2262
2375
|
borderRadius: {
|
|
2263
|
-
duration: 0.
|
|
2376
|
+
duration: 0.2,
|
|
2264
2377
|
ease: EASING.smooth
|
|
2265
2378
|
},
|
|
2266
2379
|
boxShadow: {
|
|
2267
|
-
duration: 0.
|
|
2380
|
+
duration: 0.2,
|
|
2268
2381
|
ease: 'easeInOut'
|
|
2269
2382
|
}
|
|
2270
2383
|
},
|
|
2271
2384
|
circleLogo: {
|
|
2272
2385
|
opacity: {
|
|
2273
|
-
duration: 0.
|
|
2386
|
+
duration: 0.15,
|
|
2274
2387
|
ease: 'easeOut'
|
|
2275
2388
|
},
|
|
2276
2389
|
scale: {
|
|
2277
|
-
duration: 0.
|
|
2390
|
+
duration: 0.2,
|
|
2278
2391
|
ease: EASING.smooth
|
|
2279
2392
|
},
|
|
2280
2393
|
rotate: {
|
|
2281
|
-
duration: 0.
|
|
2394
|
+
duration: 0.2,
|
|
2282
2395
|
ease: EASING.smooth
|
|
2283
2396
|
}
|
|
2284
2397
|
},
|
|
2285
2398
|
toolbarContent: {
|
|
2286
2399
|
opacity: {
|
|
2287
|
-
duration: 0.
|
|
2400
|
+
duration: 0.2,
|
|
2288
2401
|
ease: EASING.smooth
|
|
2289
2402
|
},
|
|
2290
2403
|
y: {
|
|
2291
|
-
duration: 0.
|
|
2292
|
-
ease: EASING.
|
|
2404
|
+
duration: 0.25,
|
|
2405
|
+
ease: EASING.smooth
|
|
2293
2406
|
},
|
|
2294
2407
|
scale: {
|
|
2295
|
-
duration: 0.
|
|
2296
|
-
ease: EASING.
|
|
2408
|
+
duration: 0.25,
|
|
2409
|
+
ease: EASING.smooth
|
|
2297
2410
|
}
|
|
2298
2411
|
},
|
|
2299
2412
|
contentArea: {
|
|
2300
2413
|
opacity: {
|
|
2301
|
-
duration: 0.
|
|
2302
|
-
ease: 'easeInOut'
|
|
2414
|
+
duration: 0.2,
|
|
2415
|
+
ease: 'easeInOut',
|
|
2416
|
+
delay: 0.1
|
|
2303
2417
|
},
|
|
2304
|
-
|
|
2305
|
-
duration: 0.
|
|
2306
|
-
ease: EASING.
|
|
2418
|
+
y: {
|
|
2419
|
+
duration: 0.25,
|
|
2420
|
+
ease: EASING.smooth,
|
|
2421
|
+
delay: 0.1
|
|
2307
2422
|
}
|
|
2308
2423
|
},
|
|
2309
2424
|
tabContent: {
|
|
@@ -2312,14 +2427,14 @@ const ANIMATION_CONFIG = {
|
|
|
2312
2427
|
},
|
|
2313
2428
|
tabsContainer: {
|
|
2314
2429
|
opacity: {
|
|
2315
|
-
duration: 0.
|
|
2316
|
-
ease: EASING.
|
|
2430
|
+
duration: 0.2,
|
|
2431
|
+
ease: EASING.smooth
|
|
2317
2432
|
},
|
|
2318
2433
|
y: {
|
|
2319
|
-
duration: 0.
|
|
2320
|
-
ease: EASING.
|
|
2434
|
+
duration: 0.2,
|
|
2435
|
+
ease: EASING.smooth
|
|
2321
2436
|
},
|
|
2322
|
-
delay: 0.
|
|
2437
|
+
delay: 0.05
|
|
2323
2438
|
},
|
|
2324
2439
|
eventList: {
|
|
2325
2440
|
liveTail: {
|
|
@@ -2359,9 +2474,9 @@ const ANIMATION_CONFIG = {
|
|
|
2359
2474
|
};
|
|
2360
2475
|
const DIMENSIONS = {
|
|
2361
2476
|
collapsed: {
|
|
2362
|
-
width:
|
|
2363
|
-
height:
|
|
2364
|
-
borderRadius:
|
|
2477
|
+
width: 48,
|
|
2478
|
+
height: 48,
|
|
2479
|
+
borderRadius: 24
|
|
2365
2480
|
},
|
|
2366
2481
|
expanded: {
|
|
2367
2482
|
width: 400,
|
|
@@ -2378,21 +2493,25 @@ const SHADOWS = {
|
|
|
2378
2493
|
hoveredCollapsed: '0 8px 40px rgba(0, 0, 0, 0.4)',
|
|
2379
2494
|
collapsed: '0 4px 16px rgba(0, 0, 0, 0.3)'
|
|
2380
2495
|
};
|
|
2496
|
+
const DRAG_CONSTANTS = {
|
|
2497
|
+
THRESHOLD_PIXELS: 3,
|
|
2498
|
+
CLICK_RESET_DELAY_MS: 50
|
|
2499
|
+
};
|
|
2381
2500
|
function LaunchDarklyIcon({ className }) {
|
|
2382
2501
|
return /*#__PURE__*/ jsx("svg", {
|
|
2383
2502
|
className: className,
|
|
2384
2503
|
fill: "currentColor",
|
|
2385
2504
|
preserveAspectRatio: "xMidYMid",
|
|
2386
|
-
viewBox: "
|
|
2505
|
+
viewBox: "0 0 64 64",
|
|
2387
2506
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2388
2507
|
role: "img",
|
|
2389
2508
|
"aria-label": "LaunchDarkly",
|
|
2390
2509
|
children: /*#__PURE__*/ jsx("path", {
|
|
2391
|
-
d: "
|
|
2510
|
+
d: "M32.62 60.61c-.445 0-.892-.254-1.147-.7-.191-.444-.191-.889.128-1.27l13.582-18.62-23.785 9.66c-.191.063-.319.126-.51.126-.574 0-1.084-.381-1.212-.89-.191-.508.064-1.08.51-1.397l20.916-12.266-36.794-2.097c-.765-.063-1.211-.635-1.211-1.27 0-.573.382-1.208 1.211-1.272l36.794-2.097-20.916-12.265c-.446-.318-.701-.89-.51-1.398.192-.509.638-.89 1.212-.89.191 0 .319.063.51.127l23.785 9.66L31.601 5.067c-.255-.381-.32-.89-.128-1.271.191-.445.638-.7 1.148-.7.319 0 .638.128.893.382L60.55 30.36c.383.381.574.953.574 1.462 0 .508-.191 1.016-.574 1.461L33.514 60.23a1.26 1.26 0 0 1-.893.38Z"
|
|
2392
2511
|
})
|
|
2393
2512
|
});
|
|
2394
2513
|
}
|
|
2395
|
-
var extracted = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/LaunchDarklyToolbar.css.ts.vanilla.css\",\"source\":\"#
|
|
2514
|
+
var extracted = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/LaunchDarklyToolbar.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA61UwW7jIBC95yvmslJyoMLZZJuSj6kwYHsaAhaMU6er/vsKnKRx4q661R5neLx5M2/g4blwK4XHI4ffM4DWRyT0TkCFvdHbGcAbQ6dNL6DgnKdEKdWuDr5zmilvfRBwkGHOmG2HmNVBHtkT54uM9kGbIKBoe4jeop5EP57Q/mBCZf2rgAa1Ni7lVBdiqtJ6dGRCSmmMrZVHAZU1fUpIi7VjSGYfBShzxr10kbA6MuUdGUcfR++zh3PjRW48YN2QgCVv+0E1kd9/xBSki5UPe+YD1ujECTHcG/EtM5811Xfo0rUR288pdeTbv3GRbyd0rSZ0fYHoTtE689yZcoX4NUJoU8nOUqqQ3GIag1HDjilvu7278y9SMKSaSQMzRSQZxqIeb7ZXltHbjsylyTX/sb20fwpeUVMjYLUZ+m/MMOVz/D+XbJP1nQoubwqeY1++GEWswsThHUnMs6nQUnpBZfbUmRjnfAHoDibQvFhcBhubgG4ngI/El9ar3UjL07WWgg+zuGv2M6+uiGQm+rfvYOqBD18EC1JjFwUUyzSOqzplrrNHxy4WrfkNRmXMVy1rpdboagGbtofT9L/zrX2uWWc9SYaAYjt7/wMZkZDPaAUAAA==\"}!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/extracted.js");
|
|
2396
2515
|
var extracted_options = {};
|
|
2397
2516
|
extracted_options.styleTagTransform = styleTagTransform_default();
|
|
2398
2517
|
extracted_options.setAttributes = setAttributesWithoutAttributes_default();
|
|
@@ -2401,21 +2520,27 @@ extracted_options.domAPI = styleDomAPI_default();
|
|
|
2401
2520
|
extracted_options.insertStyleElement = insertStyleElement_default();
|
|
2402
2521
|
injectStylesIntoStyleTag_default()(extracted.A, extracted_options);
|
|
2403
2522
|
extracted.A && extracted.A.locals && extracted.A.locals;
|
|
2404
|
-
var contentArea = '
|
|
2405
|
-
var
|
|
2406
|
-
var scrollableContent = '
|
|
2407
|
-
var
|
|
2408
|
-
var
|
|
2409
|
-
var circleLogo = '
|
|
2410
|
-
var
|
|
2411
|
-
var
|
|
2412
|
-
var
|
|
2523
|
+
var contentArea = '_1n4ciyya';
|
|
2524
|
+
var positionBottomLeft = '_1n4ciyy2';
|
|
2525
|
+
var scrollableContent = '_1n4ciyyb';
|
|
2526
|
+
var tabsContainer = '_1n4ciyyc';
|
|
2527
|
+
var toolbarContent = '_1n4ciyy9';
|
|
2528
|
+
var circleLogo = '_1n4ciyy8';
|
|
2529
|
+
var positionTopLeft = '_1n4ciyy4';
|
|
2530
|
+
var circleContent = '_1n4ciyy7';
|
|
2531
|
+
var positionTopRight = '_1n4ciyy3';
|
|
2532
|
+
var toolbarCircle = '_1n4ciyy5';
|
|
2533
|
+
var positionBottomRight = '_1n4ciyy1';
|
|
2413
2534
|
var toolbarContainer = '_1n4ciyy0';
|
|
2414
|
-
var toolbarExpanded = '
|
|
2415
|
-
|
|
2416
|
-
const {
|
|
2417
|
-
return /*#__PURE__*/ jsx(motion.
|
|
2535
|
+
var toolbarExpanded = '_1n4ciyy6';
|
|
2536
|
+
const CircleLogo = /*#__PURE__*/ forwardRef((props, ref)=>{
|
|
2537
|
+
const { onClick, onMouseDown } = props;
|
|
2538
|
+
return /*#__PURE__*/ jsx(motion.button, {
|
|
2539
|
+
ref: ref,
|
|
2418
2540
|
className: circleContent,
|
|
2541
|
+
onClick: onClick,
|
|
2542
|
+
onMouseDown: onMouseDown,
|
|
2543
|
+
"aria-label": "Open LaunchDarkly toolbar",
|
|
2419
2544
|
initial: {
|
|
2420
2545
|
opacity: 0,
|
|
2421
2546
|
x: '-50%',
|
|
@@ -2441,7 +2566,7 @@ function CircleLogo(props) {
|
|
|
2441
2566
|
...ANIMATION_CONFIG.circleLogo,
|
|
2442
2567
|
opacity: {
|
|
2443
2568
|
...ANIMATION_CONFIG.circleLogo.opacity,
|
|
2444
|
-
delay:
|
|
2569
|
+
delay: 0
|
|
2445
2570
|
}
|
|
2446
2571
|
},
|
|
2447
2572
|
children: /*#__PURE__*/ jsx(motion.div, {
|
|
@@ -2453,12 +2578,13 @@ function CircleLogo(props) {
|
|
|
2453
2578
|
ease: 'easeInOut'
|
|
2454
2579
|
},
|
|
2455
2580
|
children: /*#__PURE__*/ jsx(LaunchDarklyIcon, {
|
|
2456
|
-
className: circleLogo
|
|
2581
|
+
className: circleLogo,
|
|
2582
|
+
"aria-hidden": "true"
|
|
2457
2583
|
})
|
|
2458
2584
|
})
|
|
2459
2585
|
}, "circle-logo");
|
|
2460
|
-
}
|
|
2461
|
-
var _vanilla_extract_webpack_plugin_extracted = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/Header/Header.css.ts.vanilla.css\",\"source\":\"#
|
|
2586
|
+
});
|
|
2587
|
+
var _vanilla_extract_webpack_plugin_extracted = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/Header/Header.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA62V227jIBBA3/MVo0ortdJS4TRJE/K4H7LCNrZpMSDAjbOr/vsKbC924qSp2pckMMNczlzy+HvXVDv6guHvAiDnVgt6JFAanu8XEL6RY7UW1DGUKdHU0hKgjVOQFCb8ONejhlFL4E6oUkHGpGMGaOa4kvbOa1PBS4m4Y7Ulvdxfa5rnXJYEMGx1CxiSjW69IKXZa2lUI3MfgjIE3qi5R0jo7oxKQ49oh/FD0FYmZwalyjlVE0h0C1YJns8+ep4+MjTnjSWQLHXbfWDAXl5ziSrGy8oRWPdhlVR3mvvF++KxB5kEkIGHx0DAQ9iP2RaCtVcoBKvbqdFlMHrguasIJOtV53+IZyiCSl9Y5lDBHYFMSUe59NcFF44ZAqnx6pJZe48fgMs3Ztx98jD28xT8FEo6ZPkfRiDpXYWrQ+9vgwOSK6VY9VTDs4LWXBxHiqNblFLLguqh4o4hq2nGCEh1MFSPI1udYo3AzsC+NNbx4og8AybdWPcCc1/dnm5XbdoO5wTjH+NA1iGQ2zpyO99c647p/MPUUG/0SGVk8z/DVKjs9TawtZIq0IyF6EuKO/fqjZlCqAOBiuc5k5MJXOm260EAx1qHojITgmvL7cWazdDrjQT4EXtkujktbr8sPj02eDo2z9Ol9oGFi20TDW6/2+DupJs8Rsliz8Rz1hjr20UrfrYvhzU5bbP+9svRAjhDpeW+JKTrWsCPSwuMWvbzbBSibJIoqXwPhXSvTMxymJhPzFd0Qrv1xYW4tpaifhr0hzX6tJl2TxakPWRkOiX81VWeT1Z5Px4frtL4nt2UY/Swmf5XJCdJFufhRGE5F+vMdM+tktu3cvRXTfzNRj6knjXGMOl++cT3i/d/eH3aB8cIAAA=\"}!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/extracted.js");
|
|
2462
2588
|
var webpack_plugin_extracted_options = {};
|
|
2463
2589
|
webpack_plugin_extracted_options.styleTagTransform = styleTagTransform_default();
|
|
2464
2590
|
webpack_plugin_extracted_options.setAttributes = setAttributesWithoutAttributes_default();
|
|
@@ -2473,7 +2599,6 @@ var searchButtonArea = '_9uh9aj7';
|
|
|
2473
2599
|
var closeButtonArea = '_9uh9aj8';
|
|
2474
2600
|
var rightSection = '_9uh9aj6';
|
|
2475
2601
|
var environmentWrapper = '_9uh9ajg';
|
|
2476
|
-
var headerTitle = '_9uh9aj3';
|
|
2477
2602
|
var logo = '_9uh9aj2';
|
|
2478
2603
|
var environmentLabel = '_9uh9aj5';
|
|
2479
2604
|
var searchWrapper = '_9uh9ajf';
|
|
@@ -2482,18 +2607,27 @@ var header = '_9uh9aj0';
|
|
|
2482
2607
|
var actionButton = '_9uh9aj9';
|
|
2483
2608
|
var searchGroup = '_9uh9ajc';
|
|
2484
2609
|
var leftSection = '_9uh9aj1';
|
|
2610
|
+
function LaunchDarklyLogo({ className }) {
|
|
2611
|
+
return /*#__PURE__*/ jsx("svg", {
|
|
2612
|
+
className: className,
|
|
2613
|
+
fill: "currentColor",
|
|
2614
|
+
preserveAspectRatio: "xMidYMid",
|
|
2615
|
+
viewBox: "0 0 156 24",
|
|
2616
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2617
|
+
role: "img",
|
|
2618
|
+
"aria-label": "LaunchDarkly",
|
|
2619
|
+
children: /*#__PURE__*/ jsx("path", {
|
|
2620
|
+
d: "M9.33 18.729V16.45H2.578V5.272H0v13.457h9.33Zm6.485-.424a4.01 4.01 0 0 0 1.276-1.67v2.093h2.472v-6.49c0-.688-.16-1.324-.505-1.854s-.85-.954-1.488-1.245c-.638-.291-1.41-.45-2.286-.45a8.26 8.26 0 0 0-1.41.132c-.45.08-.876.212-1.275.371-.399.159-.77.344-1.09.556l.08 2.305a8.662 8.662 0 0 1 1.78-.9 5.624 5.624 0 0 1 1.941-.319c.558 0 1.01.133 1.33.398.318.265.478.609.478 1.033v.662h-2.233c-1.329 0-2.366.265-3.136.821-.771.557-1.143 1.325-1.143 2.305 0 .556.133 1.033.372 1.483.265.45.611.795 1.09 1.034.478.264 1.036.37 1.648.37.85 0 1.541-.212 2.1-.635Zm-2.232-1.67a1.078 1.078 0 0 1-.426-.873c0-.45.186-.795.585-1.034.372-.238.957-.37 1.701-.37h1.595v.37c0 .318-.08.636-.266.98a2.349 2.349 0 0 1-.824.875c-.372.238-.797.37-1.276.37-.452 0-.824-.105-1.09-.317Zm13.848 1.643c.585-.503 1.01-1.192 1.276-2.04v2.49h2.498V8.98h-2.498v4.556c0 .663-.107 1.245-.32 1.749-.212.503-.504.927-.903 1.192a2.23 2.23 0 0 1-1.356.424c-.558 0-.983-.16-1.302-.477-.292-.318-.452-.795-.452-1.404V8.98h-2.498v6.093c0 1.271.292 2.225.903 2.914.612.689 1.41 1.033 2.446 1.033.903 0 1.621-.239 2.206-.742Zm9.01-4.106c0-.662.107-1.245.32-1.748.212-.503.505-.927.877-1.192.372-.292.824-.424 1.329-.424.558 0 .983.159 1.302.477.293.318.452.794.452 1.404v6.066h2.525v-6.093c0-1.271-.292-2.225-.904-2.914-.61-.688-1.408-1.033-2.445-1.033-.877 0-1.595.265-2.18.742-.558.503-.983 1.192-1.275 2.04v-2.49h-2.499v9.748h2.499v-4.583ZM51.7 18.94c.319-.053.638-.132.904-.212.292-.079.531-.185.797-.264l.026-2.358c-.398.212-.824.344-1.275.45a5.923 5.923 0 0 1-1.356.16c-.665 0-1.25-.133-1.701-.372a2.24 2.24 0 0 1-1.01-1.033 3.26 3.26 0 0 1-.32-1.457c0-.53.107-1.006.32-1.457.212-.424.558-.768 1.01-1.033.452-.265 1.01-.37 1.648-.37.505 0 .957.052 1.409.158.451.106.85.265 1.249.45l-.027-2.436c-.292-.106-.558-.212-.824-.265a4.252 4.252 0 0 0-.903-.16 6.336 6.336 0 0 0-1.037-.079c-1.116 0-2.073.239-2.897.689a4.949 4.949 0 0 0-1.914 1.854c-.452.795-.665 1.67-.665 2.676 0 .98.24 1.88.691 2.649a4.646 4.646 0 0 0 1.914 1.801c.824.424 1.781.662 2.871.662.399.027.77 0 1.09-.053Zm6.459-.212v-4.556c0-.662.106-1.245.319-1.748.212-.503.505-.927.904-1.192a2.15 2.15 0 0 1 1.328-.424c.585 0 1.01.159 1.303.477.292.318.452.794.452 1.404v6.066h2.498v-6.093c0-1.271-.292-2.225-.903-2.914-.612-.688-1.41-1.033-2.446-1.033-.877 0-1.621.265-2.18.742-.584.503-1.01 1.192-1.275 2.04V5.27h-2.472v13.457h2.472Zm14.885 0c1.435 0 2.658-.264 3.668-.82 1.01-.557 1.78-1.325 2.312-2.332.532-1.007.798-2.199.798-3.55 0-1.35-.266-2.543-.798-3.55a5.657 5.657 0 0 0-2.312-2.357c-1.01-.556-2.233-.821-3.668-.821H67.86v13.457h5.183v-.026Zm-2.605-2.278v-8.9h2.578c1.303 0 2.313.397 3.03 1.165.745.795 1.09 1.881 1.09 3.285 0 1.404-.372 2.517-1.09 3.285-.744.768-1.754 1.165-3.03 1.165h-2.578Zm15.921 1.855a4.01 4.01 0 0 0 1.276-1.67v2.093h2.472v-6.49c0-.688-.16-1.324-.505-1.854s-.85-.954-1.488-1.245c-.638-.291-1.409-.45-2.286-.45-.479 0-.957.053-1.409.132-.452.08-.877.212-1.276.371-.398.159-.77.344-1.09.556l.08 2.305a8.662 8.662 0 0 1 1.781-.9 5.624 5.624 0 0 1 1.94-.319c.559 0 1.01.133 1.33.398.319.265.478.609.478 1.033v.662h-2.18c-1.329 0-2.365.265-3.136.821-.771.557-1.143 1.325-1.143 2.305 0 .556.133 1.033.372 1.483.266.45.611.795 1.09 1.034.478.264 1.036.37 1.648.37.824 0 1.488-.212 2.046-.635Zm-2.232-1.67a1.078 1.078 0 0 1-.425-.873c0-.45.186-.795.584-1.034.372-.238.957-.37 1.701-.37h1.595v.37c0 .318-.08.636-.266.98a2.349 2.349 0 0 1-.824.875c-.372.238-.77.344-1.249.344-.452.027-.824-.08-1.116-.291Zm11.03 2.093V14.57c0-1.086.24-1.907.692-2.463.452-.556 1.09-.848 1.86-.848.372 0 .718.053 1.037.16V9.006a3.096 3.096 0 0 0-.478-.106c-.16-.027-.346-.027-.532-.027a2.15 2.15 0 0 0-1.568.636c-.426.424-.771 1.033-.984 1.775v-2.33h-2.498v9.748h2.472v.026Zm7.682 0v-3.152l.904-.848 2.924 4h2.977l-4.173-5.695 4.093-4.053h-3.136l-3.562 3.444V5.272h-2.472v13.457h2.445Zm10.819 0V5.271h-2.499v13.457h2.499Zm3.827 3.63c.93 0 1.675-.186 2.259-.557.585-.37 1.064-1.033 1.462-1.96l4.492-10.86h-2.578l-2.631 6.807-2.712-6.808H115.2l4.014 9.722-.213.503c-.133.318-.292.583-.531.716-.213.158-.559.238-1.011.238h-2.073v2.199h2.1ZM144.092 24a.56.56 0 0 1-.478-.291c-.08-.186-.08-.371.053-.53l5.661-7.762-9.914 4.027c-.08.026-.133.053-.213.053a.518.518 0 0 1-.505-.371c-.079-.212.027-.45.213-.583l8.718-5.112-15.337-.875a.525.525 0 0 1-.505-.53c0-.238.16-.503.505-.53l15.337-.873-8.718-5.113c-.186-.133-.292-.37-.213-.583a.544.544 0 0 1 .505-.37c.08 0 .133.026.213.052l9.914 4.027-5.661-7.788c-.106-.16-.133-.371-.053-.53.079-.186.265-.292.478-.292.133 0 .266.053.372.16l11.27 11.205a.88.88 0 0 1 .24.609.93.93 0 0 1-.24.61l-11.27 11.231a.525.525 0 0 1-.372.159Z"
|
|
2621
|
+
})
|
|
2622
|
+
});
|
|
2623
|
+
}
|
|
2485
2624
|
function LogoSection() {
|
|
2486
|
-
return /*#__PURE__*/
|
|
2625
|
+
return /*#__PURE__*/ jsx("div", {
|
|
2487
2626
|
className: leftSection,
|
|
2488
|
-
|
|
2489
|
-
|
|
2490
|
-
|
|
2491
|
-
|
|
2492
|
-
/*#__PURE__*/ jsx("span", {
|
|
2493
|
-
className: headerTitle,
|
|
2494
|
-
children: "Developers"
|
|
2495
|
-
})
|
|
2496
|
-
]
|
|
2627
|
+
"aria-hidden": "true",
|
|
2628
|
+
children: /*#__PURE__*/ jsx(LaunchDarklyLogo, {
|
|
2629
|
+
className: logo
|
|
2630
|
+
})
|
|
2497
2631
|
});
|
|
2498
2632
|
}
|
|
2499
2633
|
function EnvironmentLabel(props) {
|
|
@@ -2627,21 +2761,152 @@ function SyncIcon({ className }) {
|
|
|
2627
2761
|
})
|
|
2628
2762
|
});
|
|
2629
2763
|
}
|
|
2630
|
-
function
|
|
2631
|
-
return /*#__PURE__*/ jsx("svg", {
|
|
2632
|
-
className: `${Icon_css_icon} ${className}`,
|
|
2633
|
-
fill: "currentColor",
|
|
2634
|
-
viewBox: "0 0
|
|
2635
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
2636
|
-
children: /*#__PURE__*/ jsx("path", {
|
|
2637
|
-
|
|
2638
|
-
|
|
2639
|
-
|
|
2764
|
+
function ChevronUpIcon({ className }) {
|
|
2765
|
+
return /*#__PURE__*/ jsx("svg", {
|
|
2766
|
+
className: `${Icon_css_icon} ${className}`,
|
|
2767
|
+
fill: "currentColor",
|
|
2768
|
+
viewBox: "0 0 20 20",
|
|
2769
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2770
|
+
children: /*#__PURE__*/ jsx("path", {
|
|
2771
|
+
fillRule: "evenodd",
|
|
2772
|
+
d: "M9.47 6.97a.75.75 0 0 1 1.06 0l5 5a.75.75 0 0 1-1.06 1.06L10 8.56l-4.47 4.47a.75.75 0 1 1-1.06-1.06z",
|
|
2773
|
+
clipRule: "evenodd"
|
|
2774
|
+
})
|
|
2775
|
+
});
|
|
2776
|
+
}
|
|
2777
|
+
function ChevronDownIcon({ className }) {
|
|
2778
|
+
return /*#__PURE__*/ jsx("svg", {
|
|
2779
|
+
className: `${Icon_css_icon} ${className}`,
|
|
2780
|
+
fill: "currentColor",
|
|
2781
|
+
viewBox: "0 0 24 24",
|
|
2782
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2783
|
+
children: /*#__PURE__*/ jsx("path", {
|
|
2784
|
+
"fill-rule": "evenodd",
|
|
2785
|
+
d: "M4.47 6.97a.75.75 0 0 1 1.06 0L10 11.44l4.47-4.47a.75.75 0 1 1 1.06 1.06l-5 5a.75.75 0 0 1-1.06 0l-5-5a.75.75 0 0 1 0-1.06",
|
|
2786
|
+
"clip-rule": "evenodd"
|
|
2787
|
+
})
|
|
2788
|
+
});
|
|
2789
|
+
}
|
|
2790
|
+
const TAB_ORDER = [
|
|
2791
|
+
'flag-sdk',
|
|
2792
|
+
'flag-dev-server',
|
|
2793
|
+
'events',
|
|
2794
|
+
'settings'
|
|
2795
|
+
];
|
|
2796
|
+
function getToolbarMode(devServerUrl) {
|
|
2797
|
+
return devServerUrl ? 'dev-server' : 'sdk';
|
|
2798
|
+
}
|
|
2799
|
+
function getTabsForMode(mode, hasFlagOverridePlugin, hasEventInterceptionPlugin) {
|
|
2800
|
+
if ('dev-server' === mode) {
|
|
2801
|
+
const tabs = [
|
|
2802
|
+
'flag-dev-server'
|
|
2803
|
+
];
|
|
2804
|
+
tabs.push('settings');
|
|
2805
|
+
return tabs;
|
|
2806
|
+
}
|
|
2807
|
+
const tabs = [];
|
|
2808
|
+
if (hasFlagOverridePlugin) tabs.push('flag-sdk');
|
|
2809
|
+
if (hasEventInterceptionPlugin) tabs.push('events');
|
|
2810
|
+
tabs.push('settings');
|
|
2811
|
+
return tabs;
|
|
2812
|
+
}
|
|
2813
|
+
function getDefaultActiveTab(mode, hasFlagOverridePlugin, hasEventInterceptionPlugin) {
|
|
2814
|
+
if ('dev-server' === mode) return 'flag-dev-server';
|
|
2815
|
+
if ('sdk' === mode) {
|
|
2816
|
+
if (hasFlagOverridePlugin) return 'flag-sdk';
|
|
2817
|
+
if (hasEventInterceptionPlugin) return 'events';
|
|
2818
|
+
}
|
|
2819
|
+
return 'settings';
|
|
2820
|
+
}
|
|
2821
|
+
const TOOLBAR_POSITIONS = [
|
|
2822
|
+
'top-left',
|
|
2823
|
+
'top-right',
|
|
2824
|
+
'bottom-left',
|
|
2825
|
+
'bottom-right'
|
|
2826
|
+
];
|
|
2827
|
+
const TOOLBAR_STORAGE_KEYS = {
|
|
2828
|
+
SETTINGS: 'ld-toolbar-settings',
|
|
2829
|
+
DISABLED: 'ld-toolbar-disabled',
|
|
2830
|
+
PROJECT: 'ld-toolbar-project'
|
|
2831
|
+
};
|
|
2832
|
+
const DEFAULT_SETTINGS = {
|
|
2833
|
+
position: 'bottom-right',
|
|
2834
|
+
pinned: false
|
|
2835
|
+
};
|
|
2836
|
+
function updateSetting(key, value) {
|
|
2837
|
+
try {
|
|
2838
|
+
const stored = localStorage.getItem(TOOLBAR_STORAGE_KEYS.SETTINGS);
|
|
2839
|
+
let currentSettings = {};
|
|
2840
|
+
if (stored) currentSettings = JSON.parse(stored);
|
|
2841
|
+
const newSettings = {
|
|
2842
|
+
...currentSettings,
|
|
2843
|
+
[key]: value
|
|
2844
|
+
};
|
|
2845
|
+
localStorage.setItem(TOOLBAR_STORAGE_KEYS.SETTINGS, JSON.stringify(newSettings));
|
|
2846
|
+
} catch (error) {
|
|
2847
|
+
console.warn(`Failed to save toolbar ${key} to localStorage:`, error);
|
|
2848
|
+
}
|
|
2849
|
+
}
|
|
2850
|
+
function saveToolbarPosition(position) {
|
|
2851
|
+
updateSetting('position', position);
|
|
2852
|
+
}
|
|
2853
|
+
function loadToolbarPosition() {
|
|
2854
|
+
try {
|
|
2855
|
+
const stored = localStorage.getItem(TOOLBAR_STORAGE_KEYS.SETTINGS);
|
|
2856
|
+
if (!stored) return null;
|
|
2857
|
+
const parsed = JSON.parse(stored);
|
|
2858
|
+
if (!parsed.position) return null;
|
|
2859
|
+
return TOOLBAR_POSITIONS.includes(parsed.position) ? parsed.position : null;
|
|
2860
|
+
} catch (error) {
|
|
2861
|
+
console.warn('Failed to load toolbar position from localStorage:', error);
|
|
2862
|
+
return null;
|
|
2863
|
+
}
|
|
2864
|
+
}
|
|
2865
|
+
function saveToolbarPinned(isPinned) {
|
|
2866
|
+
updateSetting('pinned', isPinned);
|
|
2867
|
+
}
|
|
2868
|
+
function loadToolbarPinned() {
|
|
2869
|
+
try {
|
|
2870
|
+
const stored = localStorage.getItem(TOOLBAR_STORAGE_KEYS.SETTINGS);
|
|
2871
|
+
if (!stored) return DEFAULT_SETTINGS.pinned;
|
|
2872
|
+
const parsed = JSON.parse(stored);
|
|
2873
|
+
return 'boolean' == typeof parsed.pinned ? parsed.pinned : DEFAULT_SETTINGS.pinned;
|
|
2874
|
+
} catch (error) {
|
|
2875
|
+
console.warn('Failed to load toolbar pinned state from localStorage:', error);
|
|
2876
|
+
return false;
|
|
2877
|
+
}
|
|
2640
2878
|
}
|
|
2879
|
+
const ToolbarUIContext = /*#__PURE__*/ createContext(null);
|
|
2880
|
+
const useToolbarUIContext = ()=>{
|
|
2881
|
+
const context = useContext(ToolbarUIContext);
|
|
2882
|
+
if (!context) throw new Error('useToolbarUIContext must be used within ToolbarUIProvider');
|
|
2883
|
+
return context;
|
|
2884
|
+
};
|
|
2885
|
+
const ToolbarUIProvider = ({ children, initialPosition })=>{
|
|
2886
|
+
const initialValidPosition = initialPosition && TOOLBAR_POSITIONS.includes(initialPosition) ? initialPosition : void 0;
|
|
2887
|
+
const [position, setPosition] = useState(()=>loadToolbarPosition() || initialValidPosition || DEFAULT_SETTINGS.position);
|
|
2888
|
+
const handlePositionChange = useCallback((newPosition)=>{
|
|
2889
|
+
setPosition(newPosition);
|
|
2890
|
+
saveToolbarPosition(newPosition);
|
|
2891
|
+
}, []);
|
|
2892
|
+
const value = useMemo(()=>({
|
|
2893
|
+
position,
|
|
2894
|
+
handlePositionChange
|
|
2895
|
+
}), [
|
|
2896
|
+
position,
|
|
2897
|
+
handlePositionChange
|
|
2898
|
+
]);
|
|
2899
|
+
return /*#__PURE__*/ jsx(ToolbarUIContext.Provider, {
|
|
2900
|
+
value: value,
|
|
2901
|
+
children: children
|
|
2902
|
+
});
|
|
2903
|
+
};
|
|
2641
2904
|
function ActionButtons(props) {
|
|
2642
2905
|
const { searchIsExpanded, setSearchIsExpanded, onClose, onRefresh, showSearchButton, showRefreshButton } = props;
|
|
2643
2906
|
const [isSpinning, setIsSpinning] = useState(false);
|
|
2644
2907
|
const [rotationCount, setRotationCount] = useState(0);
|
|
2908
|
+
const { position } = useToolbarUIContext();
|
|
2909
|
+
const isTop = position.startsWith('top-');
|
|
2645
2910
|
const handleRefreshClick = useCallback(()=>{
|
|
2646
2911
|
if (isSpinning) return;
|
|
2647
2912
|
setIsSpinning(true);
|
|
@@ -2719,7 +2984,7 @@ function ActionButtons(props) {
|
|
|
2719
2984
|
duration: 0.1
|
|
2720
2985
|
},
|
|
2721
2986
|
children: /*#__PURE__*/ jsx(IconButton, {
|
|
2722
|
-
icon: /*#__PURE__*/ jsx(ChevronDownIcon, {}),
|
|
2987
|
+
icon: isTop ? /*#__PURE__*/ jsx(ChevronUpIcon, {}) : /*#__PURE__*/ jsx(ChevronDownIcon, {}),
|
|
2723
2988
|
label: "Close toolbar",
|
|
2724
2989
|
onClick: onClose,
|
|
2725
2990
|
className: actionButton
|
|
@@ -2858,92 +3123,6 @@ class FlagStateManager {
|
|
|
2858
3123
|
this.listeners.clear();
|
|
2859
3124
|
}
|
|
2860
3125
|
}
|
|
2861
|
-
const TAB_ORDER = [
|
|
2862
|
-
'flag-sdk',
|
|
2863
|
-
'flag-dev-server',
|
|
2864
|
-
'events',
|
|
2865
|
-
'settings'
|
|
2866
|
-
];
|
|
2867
|
-
function getToolbarMode(devServerUrl) {
|
|
2868
|
-
return devServerUrl ? 'dev-server' : 'sdk';
|
|
2869
|
-
}
|
|
2870
|
-
function getTabsForMode(mode, hasFlagOverridePlugin, hasEventInterceptionPlugin) {
|
|
2871
|
-
if ('dev-server' === mode) {
|
|
2872
|
-
const tabs = [
|
|
2873
|
-
'flag-dev-server'
|
|
2874
|
-
];
|
|
2875
|
-
tabs.push('settings');
|
|
2876
|
-
return tabs;
|
|
2877
|
-
}
|
|
2878
|
-
const tabs = [];
|
|
2879
|
-
if (hasFlagOverridePlugin) tabs.push('flag-sdk');
|
|
2880
|
-
if (hasEventInterceptionPlugin) tabs.push('events');
|
|
2881
|
-
tabs.push('settings');
|
|
2882
|
-
return tabs;
|
|
2883
|
-
}
|
|
2884
|
-
function getDefaultActiveTab(mode, hasFlagOverridePlugin, hasEventInterceptionPlugin) {
|
|
2885
|
-
if ('dev-server' === mode) return 'flag-dev-server';
|
|
2886
|
-
if ('sdk' === mode) {
|
|
2887
|
-
if (hasFlagOverridePlugin) return 'flag-sdk';
|
|
2888
|
-
if (hasEventInterceptionPlugin) return 'events';
|
|
2889
|
-
}
|
|
2890
|
-
return 'settings';
|
|
2891
|
-
}
|
|
2892
|
-
const TOOLBAR_POSITIONS = [
|
|
2893
|
-
'left',
|
|
2894
|
-
'right'
|
|
2895
|
-
];
|
|
2896
|
-
const TOOLBAR_STORAGE_KEYS = {
|
|
2897
|
-
SETTINGS: 'ld-toolbar-settings',
|
|
2898
|
-
DISABLED: 'ld-toolbar-disabled',
|
|
2899
|
-
PROJECT: 'ld-toolbar-project'
|
|
2900
|
-
};
|
|
2901
|
-
const DEFAULT_SETTINGS = {
|
|
2902
|
-
position: 'right',
|
|
2903
|
-
pinned: false
|
|
2904
|
-
};
|
|
2905
|
-
function updateSetting(key, value) {
|
|
2906
|
-
try {
|
|
2907
|
-
const stored = localStorage.getItem(TOOLBAR_STORAGE_KEYS.SETTINGS);
|
|
2908
|
-
let currentSettings = {};
|
|
2909
|
-
if (stored) currentSettings = JSON.parse(stored);
|
|
2910
|
-
const newSettings = {
|
|
2911
|
-
...currentSettings,
|
|
2912
|
-
[key]: value
|
|
2913
|
-
};
|
|
2914
|
-
localStorage.setItem(TOOLBAR_STORAGE_KEYS.SETTINGS, JSON.stringify(newSettings));
|
|
2915
|
-
} catch (error) {
|
|
2916
|
-
console.warn(`Failed to save toolbar ${key} to localStorage:`, error);
|
|
2917
|
-
}
|
|
2918
|
-
}
|
|
2919
|
-
function saveToolbarPosition(position) {
|
|
2920
|
-
updateSetting('position', position);
|
|
2921
|
-
}
|
|
2922
|
-
function loadToolbarPosition() {
|
|
2923
|
-
try {
|
|
2924
|
-
const stored = localStorage.getItem(TOOLBAR_STORAGE_KEYS.SETTINGS);
|
|
2925
|
-
if (!stored) return null;
|
|
2926
|
-
const parsed = JSON.parse(stored);
|
|
2927
|
-
return parsed.position && TOOLBAR_POSITIONS.includes(parsed.position) ? parsed.position : null;
|
|
2928
|
-
} catch (error) {
|
|
2929
|
-
console.warn('Failed to load toolbar position from localStorage:', error);
|
|
2930
|
-
return null;
|
|
2931
|
-
}
|
|
2932
|
-
}
|
|
2933
|
-
function saveToolbarPinned(isPinned) {
|
|
2934
|
-
updateSetting('pinned', isPinned);
|
|
2935
|
-
}
|
|
2936
|
-
function loadToolbarPinned() {
|
|
2937
|
-
try {
|
|
2938
|
-
const stored = localStorage.getItem(TOOLBAR_STORAGE_KEYS.SETTINGS);
|
|
2939
|
-
if (!stored) return DEFAULT_SETTINGS.pinned;
|
|
2940
|
-
const parsed = JSON.parse(stored);
|
|
2941
|
-
return 'boolean' == typeof parsed.pinned ? parsed.pinned : DEFAULT_SETTINGS.pinned;
|
|
2942
|
-
} catch (error) {
|
|
2943
|
-
console.warn('Failed to load toolbar pinned state from localStorage:', error);
|
|
2944
|
-
return false;
|
|
2945
|
-
}
|
|
2946
|
-
}
|
|
2947
3126
|
const STORAGE_KEY = TOOLBAR_STORAGE_KEYS.PROJECT;
|
|
2948
3127
|
const DevServerContext = /*#__PURE__*/ createContext(null);
|
|
2949
3128
|
const useDevServerContext = ()=>{
|
|
@@ -2951,10 +3130,8 @@ const useDevServerContext = ()=>{
|
|
|
2951
3130
|
if (!context) throw new Error('useDevServerContext must be used within DevServerProvider');
|
|
2952
3131
|
return context;
|
|
2953
3132
|
};
|
|
2954
|
-
const DevServerProvider = ({ children, config
|
|
2955
|
-
const [toolbarState, setToolbarState] = useState(()=>{
|
|
2956
|
-
const savedPosition = loadToolbarPosition();
|
|
2957
|
-
return {
|
|
3133
|
+
const DevServerProvider = ({ children, config })=>{
|
|
3134
|
+
const [toolbarState, setToolbarState] = useState(()=>({
|
|
2958
3135
|
flags: {},
|
|
2959
3136
|
connectionStatus: 'disconnected',
|
|
2960
3137
|
lastSyncTime: 0,
|
|
@@ -2962,10 +3139,8 @@ const DevServerProvider = ({ children, config, initialPosition })=>{
|
|
|
2962
3139
|
error: null,
|
|
2963
3140
|
sourceEnvironmentKey: null,
|
|
2964
3141
|
availableProjects: [],
|
|
2965
|
-
currentProjectKey: null
|
|
2966
|
-
|
|
2967
|
-
};
|
|
2968
|
-
});
|
|
3142
|
+
currentProjectKey: null
|
|
3143
|
+
}));
|
|
2969
3144
|
const devServerClient = useMemo(()=>{
|
|
2970
3145
|
if (config.devServerUrl) return new DevServerClient(config.devServerUrl, config.projectKey);
|
|
2971
3146
|
return null;
|
|
@@ -3309,29 +3484,20 @@ const DevServerProvider = ({ children, config, initialPosition })=>{
|
|
|
3309
3484
|
flagStateManager,
|
|
3310
3485
|
toolbarState.availableProjects
|
|
3311
3486
|
]);
|
|
3312
|
-
const handlePositionChange = useCallback((newPosition)=>{
|
|
3313
|
-
setToolbarState((prev)=>({
|
|
3314
|
-
...prev,
|
|
3315
|
-
position: newPosition
|
|
3316
|
-
}));
|
|
3317
|
-
saveToolbarPosition(newPosition);
|
|
3318
|
-
}, []);
|
|
3319
3487
|
const value = useMemo(()=>({
|
|
3320
3488
|
state: toolbarState,
|
|
3321
3489
|
setOverride,
|
|
3322
3490
|
clearOverride,
|
|
3323
3491
|
clearAllOverrides,
|
|
3324
3492
|
refresh,
|
|
3325
|
-
switchProject
|
|
3326
|
-
handlePositionChange
|
|
3493
|
+
switchProject
|
|
3327
3494
|
}), [
|
|
3328
3495
|
toolbarState,
|
|
3329
3496
|
setOverride,
|
|
3330
3497
|
clearOverride,
|
|
3331
3498
|
clearAllOverrides,
|
|
3332
3499
|
refresh,
|
|
3333
|
-
switchProject
|
|
3334
|
-
handlePositionChange
|
|
3500
|
+
switchProject
|
|
3335
3501
|
]);
|
|
3336
3502
|
return /*#__PURE__*/ jsx(DevServerContext.Provider, {
|
|
3337
3503
|
value: value,
|
|
@@ -3422,11 +3588,16 @@ function Header(props) {
|
|
|
3422
3588
|
const { state, refresh } = useDevServerContext();
|
|
3423
3589
|
const { connectionStatus } = state;
|
|
3424
3590
|
const isConnected = 'connected' === connectionStatus;
|
|
3591
|
+
const analytics = useAnalytics();
|
|
3425
3592
|
const isDevServer = 'dev-server' === mode;
|
|
3426
3593
|
const showEnvironment = isDevServer && isConnected;
|
|
3427
3594
|
const showSearch = isDevServer ? isConnected : true;
|
|
3428
3595
|
const showRefresh = isDevServer;
|
|
3429
3596
|
const showConnectionStatus = isDevServer;
|
|
3597
|
+
const handleSearch = (term)=>{
|
|
3598
|
+
onSearch(term);
|
|
3599
|
+
analytics.trackSearch(term);
|
|
3600
|
+
};
|
|
3430
3601
|
return /*#__PURE__*/ jsxs(Fragment, {
|
|
3431
3602
|
children: [
|
|
3432
3603
|
/*#__PURE__*/ jsxs("div", {
|
|
@@ -3456,7 +3627,7 @@ function Header(props) {
|
|
|
3456
3627
|
},
|
|
3457
3628
|
children: /*#__PURE__*/ jsx(SearchSection, {
|
|
3458
3629
|
searchTerm: searchTerm,
|
|
3459
|
-
onSearch:
|
|
3630
|
+
onSearch: handleSearch,
|
|
3460
3631
|
setSearchIsExpanded: setSearchIsExpanded
|
|
3461
3632
|
})
|
|
3462
3633
|
}, "search") : showEnvironment ? /*#__PURE__*/ jsx(motion.div, {
|
|
@@ -3547,7 +3718,7 @@ const Tabs_Tabs = /*#__PURE__*/ react.forwardRef(function(props, ref) {
|
|
|
3547
3718
|
}, []);
|
|
3548
3719
|
useEffect(()=>{
|
|
3549
3720
|
updateIndicatorPosition();
|
|
3550
|
-
const timeoutId = setTimeout(updateIndicatorPosition,
|
|
3721
|
+
const timeoutId = setTimeout(updateIndicatorPosition, 250);
|
|
3551
3722
|
return ()=>clearTimeout(timeoutId);
|
|
3552
3723
|
}, [
|
|
3553
3724
|
currentActiveTab,
|
|
@@ -4367,17 +4538,26 @@ function LocalObjectFlagControl(props) {
|
|
|
4367
4538
|
function FlagSdkOverrideTabContentInner(props) {
|
|
4368
4539
|
const { flagOverridePlugin } = props;
|
|
4369
4540
|
const { searchTerm } = useSearchContext();
|
|
4541
|
+
const analytics = useAnalytics();
|
|
4370
4542
|
const { flags, isLoading } = useFlagSdkOverrideContext();
|
|
4371
4543
|
const [showOverriddenOnly, setShowOverriddenOnly] = useState(false);
|
|
4372
4544
|
const parentRef = useRef(null);
|
|
4373
4545
|
const handleClearOverride = useCallback((flagKey)=>{
|
|
4374
|
-
if (flagOverridePlugin)
|
|
4546
|
+
if (flagOverridePlugin) {
|
|
4547
|
+
flagOverridePlugin.removeOverride(flagKey);
|
|
4548
|
+
analytics.trackFlagOverride(flagKey, null, 'remove');
|
|
4549
|
+
}
|
|
4375
4550
|
}, [
|
|
4376
|
-
flagOverridePlugin
|
|
4551
|
+
flagOverridePlugin,
|
|
4552
|
+
analytics
|
|
4377
4553
|
]);
|
|
4378
4554
|
const totalOverriddenFlags = useMemo(()=>Object.values(flags).filter((flag)=>flag.isOverridden).length, [
|
|
4379
4555
|
flags
|
|
4380
4556
|
]);
|
|
4557
|
+
const showOverridesOnlyChanged = (enabled)=>{
|
|
4558
|
+
setShowOverriddenOnly(enabled);
|
|
4559
|
+
analytics.trackShowOverridesOnlyClick(enabled);
|
|
4560
|
+
};
|
|
4381
4561
|
const flagEntries = Object.entries(flags);
|
|
4382
4562
|
const filteredFlags = flagEntries.filter(([flagKey, flag])=>{
|
|
4383
4563
|
const matchesSearch = flag.name.toLowerCase().includes(searchTerm.toLowerCase()) || flagKey.toLowerCase().includes(searchTerm.trim().toLowerCase());
|
|
@@ -4397,9 +4577,15 @@ function FlagSdkOverrideTabContentInner(props) {
|
|
|
4397
4577
|
const ldClient = flagOverridePlugin.getClient();
|
|
4398
4578
|
const handleSetOverride = (flagKey, value)=>{
|
|
4399
4579
|
flagOverridePlugin.setOverride(flagKey, value);
|
|
4580
|
+
analytics.trackFlagOverride(flagKey, value, 'set');
|
|
4400
4581
|
};
|
|
4401
4582
|
const handleClearAllOverrides = ()=>{
|
|
4583
|
+
const currentOverrides = flagOverridePlugin.getAllOverrides();
|
|
4584
|
+
const overrideCount = Object.keys(currentOverrides).length;
|
|
4402
4585
|
flagOverridePlugin.clearAllOverrides();
|
|
4586
|
+
analytics.trackFlagOverride('*', {
|
|
4587
|
+
count: overrideCount
|
|
4588
|
+
}, 'clear_all');
|
|
4403
4589
|
};
|
|
4404
4590
|
const renderFlagControl = (flag)=>{
|
|
4405
4591
|
const handleOverride = (value)=>handleSetOverride(flag.key, value);
|
|
@@ -4449,7 +4635,7 @@ function FlagSdkOverrideTabContentInner(props) {
|
|
|
4449
4635
|
children: [
|
|
4450
4636
|
/*#__PURE__*/ jsx("button", {
|
|
4451
4637
|
className: `${toggleButton} ${showOverriddenOnly ? active : ''}`,
|
|
4452
|
-
onClick: ()=>
|
|
4638
|
+
onClick: ()=>showOverridesOnlyChanged(!showOverriddenOnly),
|
|
4453
4639
|
"data-testid": "show-overrides-only-button",
|
|
4454
4640
|
"aria-label": showOverriddenOnly ? 'Show all flags' : 'Show only overridden flags',
|
|
4455
4641
|
children: "Show overrides only"
|
|
@@ -4579,11 +4765,6 @@ function DoNotTrackWarning() {
|
|
|
4579
4765
|
})
|
|
4580
4766
|
});
|
|
4581
4767
|
}
|
|
4582
|
-
function isDoNotTrackEnabled() {
|
|
4583
|
-
let flag;
|
|
4584
|
-
if ('undefined' != typeof window && window.navigator) flag = void 0 !== window.navigator.doNotTrack ? window.navigator.doNotTrack : void 0 !== window.navigator.msDoNotTrack ? window.navigator.msDoNotTrack : window.doNotTrack;
|
|
4585
|
-
return 1 === flag || true === flag || '1' === flag || 'yes' === flag;
|
|
4586
|
-
}
|
|
4587
4768
|
var HPD5XNmW7Wxmjh37F_nCHZ6uCwAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/TabContent/EventsTabContent.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA6VW247bIBB9369AqiptH4jwNQn70l/B9hCzwWAB3iSt+u+VsdfBa3sv7VMuwzlnbszw8ww3blgDFvFYxc83iX4/IES++w+EdMtK4W4URU/+tzNMWa5NQ5EtmYTH6Edv+POAULYEkV2yBdvFEzAiX5f787Ab/CUe2bKqEupE0aG9opi01/5UoU0FBhfaOd1QFLVXZLUUFXph5hFj2eJSS23wybAb3hPiqQtWnk9Gd6oarHT19MGfnpyIvBNcK4et+AUURfHgwjsU6SjoURcQp9pRlBES0MYDrYTrmJBK2FayG/X/PY02XAkDpRNa0V6va1RvObGWonTwohEKX0TlaopI/1u/gOFSXyiqRVWBP98wcxIKm8GPKO+RkyPJIr6ReeZ8SsgHMcdjzGsOOLg6fDeAlKK1wvamSy0cYNuyEihS+mJYuwxrcjb952JMFNmCIlqJNxvinXovbq8on7WeYZXo7FQHH2LQ0l3bgimZhd4owTkwPkrPRnbZrAa592nZnt9InvE0DwL8VkWcQRZg91tYDjwp9yH2GKeEQIA9eOzYHhK485dstRuZFCeFhYPGUlSCcmACoqMnmkCF1OU5NNO6rz5V2j3SSlhWSKh+eMwnOupz1zafl5ltpSWChB3YLKUFMB6mpdjCpkWW5UmI5QlPeR5gyy3s8RgVUTHDQslKFmCrLWx2iMrDrJRwrDLOAyxs6rIkjeK5brVnoS7fwib7NMqimW4GeygC7Mlj6/uYGPrnftlZ53T/jy2NlrJg5qPZOyyGlhlQbg4cB4KrhQo9GJrL+/Epkf1CJOCi+ALFWTg8UXniUXq8HfdU0S8QYVd3zdveem8Hrc+at4H/n9L+c0prGoaV54XGejrqMIn9m8APV23FsNoMSObES3gHxbD7pyOssFp2zo9Tp9tx2w0zy3+dkd9pgub4yvofnyej+FskIrvYIvDTfZJ6ns/Aj9f46khF6LmzTvAbLrVyoFxoWlwz/xL4+g48r7u64VAgMjE0K7fi1bvD6p7MhqKvTWRSHA9+yjAlGjak6fXFGu2yIdNYKKw7h4TiQgkXZl4tVnq+vdLfyVIyz5Leehm9Q5G9dk//HPD5XNmW7Wxmjh37F+nCHZ6uCwAA\"}!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/extracted.js");
|
|
4588
4769
|
var HPD5XNmW7Wxmjh37F_nCHZ6uCwAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted_options = {};
|
|
4589
4770
|
HPD5XNmW7Wxmjh37F_nCHZ6uCwAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted_options.styleTagTransform = styleTagTransform_default();
|
|
@@ -4598,7 +4779,7 @@ var addButtonContainer = 'f2n2jy8';
|
|
|
4598
4779
|
var eventListItem = 'f2n2jyp';
|
|
4599
4780
|
var eventMeta = 'f2n2jy4';
|
|
4600
4781
|
var eventBadgeIdentify = 'f2n2jya f2n2jy5';
|
|
4601
|
-
var
|
|
4782
|
+
var EventsTabContent_css_eventName = 'f2n2jy3';
|
|
4602
4783
|
var liveTailText = 'f2n2jyn';
|
|
4603
4784
|
var eventBadgeFeature = 'f2n2jy6 f2n2jy5';
|
|
4604
4785
|
var eventBadgeCustom = 'f2n2jyb f2n2jy5';
|
|
@@ -4699,6 +4880,7 @@ function formatTimeAgo(timestamp, currentDate) {
|
|
|
4699
4880
|
function EventsTabContent(props) {
|
|
4700
4881
|
const { eventInterceptionPlugin, baseUrl } = props;
|
|
4701
4882
|
const { searchTerm } = useSearchContext();
|
|
4883
|
+
const analytics = useAnalytics();
|
|
4702
4884
|
const { events, eventStats } = useEvents(eventInterceptionPlugin, searchTerm);
|
|
4703
4885
|
const currentDate = useCurrentDate();
|
|
4704
4886
|
const parentRef = useRef(null);
|
|
@@ -4706,8 +4888,15 @@ function EventsTabContent(props) {
|
|
|
4706
4888
|
const handleClearEvents = ()=>{
|
|
4707
4889
|
if (eventInterceptionPlugin) eventInterceptionPlugin.clearEvents();
|
|
4708
4890
|
};
|
|
4891
|
+
const handleEventClick = (event)=>{
|
|
4892
|
+
analytics.trackEventClick(event?.key ?? event.displayName);
|
|
4893
|
+
console.group(`\u{1F4DD} Event Details: [kind: ${event.kind}, displayName: ${event.displayName}]`);
|
|
4894
|
+
console.table(event);
|
|
4895
|
+
console.groupEnd();
|
|
4896
|
+
};
|
|
4709
4897
|
const handleAddFeatureFlag = (flagKey)=>{
|
|
4710
4898
|
const url = createFlagDeeplinkUrl(flagKey);
|
|
4899
|
+
analytics.trackOpenFlagDeeplink(flagKey, baseUrl);
|
|
4711
4900
|
window.open(url, '_blank');
|
|
4712
4901
|
};
|
|
4713
4902
|
const createFlagDeeplinkUrl = (flagKey)=>`${baseUrl}/flags/new?selectProject=1&flagKey=${flagKey}`;
|
|
@@ -4822,17 +5011,13 @@ function EventsTabContent(props) {
|
|
|
4822
5011
|
},
|
|
4823
5012
|
children: /*#__PURE__*/ jsxs(ListItem, {
|
|
4824
5013
|
className: eventListItem,
|
|
4825
|
-
onClick: ()=>
|
|
4826
|
-
console.group(`\u{1F4DD} Event Details: [kind: ${event.kind}, displayName: ${event.displayName}]`);
|
|
4827
|
-
console.table(event);
|
|
4828
|
-
console.groupEnd();
|
|
4829
|
-
},
|
|
5014
|
+
onClick: ()=>handleEventClick(event),
|
|
4830
5015
|
children: [
|
|
4831
5016
|
/*#__PURE__*/ jsxs("div", {
|
|
4832
5017
|
className: eventInfo,
|
|
4833
5018
|
children: [
|
|
4834
5019
|
/*#__PURE__*/ jsx("span", {
|
|
4835
|
-
className:
|
|
5020
|
+
className: EventsTabContent_css_eventName,
|
|
4836
5021
|
children: event.displayName
|
|
4837
5022
|
}),
|
|
4838
5023
|
/*#__PURE__*/ jsx("span", {
|
|
@@ -4866,25 +5051,26 @@ function EventsTabContent(props) {
|
|
|
4866
5051
|
]
|
|
4867
5052
|
});
|
|
4868
5053
|
}
|
|
4869
|
-
var
|
|
4870
|
-
var
|
|
4871
|
-
|
|
4872
|
-
|
|
4873
|
-
|
|
4874
|
-
|
|
4875
|
-
|
|
4876
|
-
injectStylesIntoStyleTag_default()(
|
|
4877
|
-
|
|
4878
|
-
var settingName = '
|
|
4879
|
-
var
|
|
4880
|
-
var
|
|
4881
|
-
var
|
|
5054
|
+
var GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted = __webpack_require__("../../node_modules/.pnpm/@rsbuild+core@1.5.4/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[2].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[2].use[2]!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/ui/Toolbar/TabContent/SettingsTab.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA6VUy3LbMAy8+ytwbA/0SIrjOvSxH5KhRUhCQ5EcErbkdPLvHdKPyI+kmfakEUDurhZYzZ/LsmEbdwX8ngFsXNAYxMYxu15C6UeIzpCGnQrfhDBe1M64INqg9mJVFN/Xs7fZ/IwhjYos6o6MvgdnncWLC2U+1avQkpVQrGcAXmlNtpVQLv0IVeFHWPkxdRpnWUR6RQllNSkNSG3HEpZFBsgC5V3BiywYgHFkwUHZ2LjQS9h6j6FWEVPTIDMGEb2qs45i/pjIJqqrrPqOnI2qX9rgtlaLT1Q8Xdv2cMAzOEooE46m6I3ay1xLBWWotYIY+yihRssYUvnXNjI1e1E7y2hZQhKNYoM8INp0olX+JG9CuMiENyzpKTQFrJmclcnJbf8Oc43yeGPD4s5UFn+dSnXtx/Ijf78w2nyrUT2Z/eTgpCp6Z1326ZL0x31PPnA+G3Lcy5spZB/R6gv81T981MP/ftRTJh1Ic3cIVELrjpM5vTdkjIR6GwJa/pnYz8sQu0D2JSdzgqoO2T4vu4ScJa8SQLrbkxUn0pTgXFPjqVYVx9onHJvM4XYYGuMGCR1pfVjpHN73BhpDPlJMraEjxpxcTD+bISi/nibr7Q/GMgCb7gQAAA==\"}!../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.22_webpack@5.101.3/node_modules/@vanilla-extract/webpack-plugin/extracted.js");
|
|
5055
|
+
var GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted_options = {};
|
|
5056
|
+
GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted_options.styleTagTransform = styleTagTransform_default();
|
|
5057
|
+
GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted_options.setAttributes = setAttributesWithoutAttributes_default();
|
|
5058
|
+
GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted_options.insert = insertBySelector_default().bind(null, "head");
|
|
5059
|
+
GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted_options.domAPI = styleDomAPI_default();
|
|
5060
|
+
GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted_options.insertStyleElement = insertStyleElement_default();
|
|
5061
|
+
injectStylesIntoStyleTag_default()(GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted.A, GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted_options);
|
|
5062
|
+
GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted.A && GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted.A.locals && GMgCb7gQAAA_node_modules_pnpm_vanilla_extract_webpack_plugin_2_3_22_webpack_5_101_3_node_modules_vanilla_extract_webpack_plugin_extracted.A.locals;
|
|
5063
|
+
var settingName = '_11ftnsv5';
|
|
5064
|
+
var SettingsTab_css_switch_ = '_11ftnsv2';
|
|
5065
|
+
var settingInfo = '_11ftnsv3';
|
|
5066
|
+
var SettingsTab_css_icon = '_11ftnsv9';
|
|
5067
|
+
var settingDetails = '_11ftnsv4';
|
|
4882
5068
|
var settingsGroup = '_11ftnsv0';
|
|
4883
|
-
var SettingsTab_css_statusText = '
|
|
5069
|
+
var SettingsTab_css_statusText = '_11ftnsv8';
|
|
4884
5070
|
var settingsGroupTitle = '_11ftnsv1';
|
|
4885
|
-
var settingValue = '
|
|
4886
|
-
var SettingsTab_css_statusIndicator = '
|
|
4887
|
-
var SettingsTab_css_select = '
|
|
5071
|
+
var settingValue = '_11ftnsv6';
|
|
5072
|
+
var SettingsTab_css_statusIndicator = '_11ftnsv7';
|
|
5073
|
+
var SettingsTab_css_select = '_11ftnsva';
|
|
4888
5074
|
function ProjectSelector(props) {
|
|
4889
5075
|
const { availableProjects, currentProject, onProjectChange, isLoading } = props;
|
|
4890
5076
|
const handleProjectSelect = (key)=>{
|
|
@@ -4925,7 +5111,7 @@ function ProjectSelector(props) {
|
|
|
4925
5111
|
function PositionSelector(props) {
|
|
4926
5112
|
const { currentPosition, onPositionChange } = props;
|
|
4927
5113
|
function getPositionsDisplayName(position) {
|
|
4928
|
-
return position.charAt(0).toUpperCase() +
|
|
5114
|
+
return position.split('-').map((part)=>part.charAt(0).toUpperCase() + part.slice(1)).join(' ');
|
|
4929
5115
|
}
|
|
4930
5116
|
const handlePositionSelect = (key)=>{
|
|
4931
5117
|
if (key && 'string' == typeof key) {
|
|
@@ -4963,10 +5149,16 @@ function PositionSelector(props) {
|
|
|
4963
5149
|
}
|
|
4964
5150
|
function PinToggle(props) {
|
|
4965
5151
|
const { isPinned, onTogglePin } = props;
|
|
5152
|
+
const analytics = useAnalytics();
|
|
5153
|
+
const handleToggle = (isSelected)=>{
|
|
5154
|
+
analytics.trackPinToggle(isSelected ? 'pin' : 'unpin');
|
|
5155
|
+
onTogglePin();
|
|
5156
|
+
};
|
|
4966
5157
|
return /*#__PURE__*/ jsx(Switch, {
|
|
5158
|
+
className: SettingsTab_css_switch_,
|
|
4967
5159
|
"data-theme": "dark",
|
|
4968
5160
|
isSelected: isPinned,
|
|
4969
|
-
onChange:
|
|
5161
|
+
onChange: handleToggle,
|
|
4970
5162
|
"aria-label": "Pin toolbar"
|
|
4971
5163
|
});
|
|
4972
5164
|
}
|
|
@@ -4997,9 +5189,10 @@ function ConnectionStatusDisplay(props) {
|
|
|
4997
5189
|
}
|
|
4998
5190
|
function SettingsTabContent(props) {
|
|
4999
5191
|
const { mode, isPinned, onTogglePin } = props;
|
|
5000
|
-
const { state, switchProject
|
|
5192
|
+
const { state, switchProject } = useDevServerContext();
|
|
5193
|
+
const { position, handlePositionChange } = useToolbarUIContext();
|
|
5001
5194
|
const { searchTerm } = useSearchContext();
|
|
5002
|
-
const
|
|
5195
|
+
const analytics = useAnalytics();
|
|
5003
5196
|
const handleProjectSwitch = async (projectKey)=>{
|
|
5004
5197
|
try {
|
|
5005
5198
|
await switchProject(projectKey);
|
|
@@ -5008,6 +5201,7 @@ function SettingsTabContent(props) {
|
|
|
5008
5201
|
}
|
|
5009
5202
|
};
|
|
5010
5203
|
const handlePositionSelect = (newPosition)=>{
|
|
5204
|
+
analytics.trackPositionChange(position, newPosition, 'settings');
|
|
5011
5205
|
handlePositionChange(newPosition);
|
|
5012
5206
|
};
|
|
5013
5207
|
const getSettingsGroups = ()=>{
|
|
@@ -5243,16 +5437,19 @@ function getHeaderLabel(currentProjectKey, sourceEnvironmentKey) {
|
|
|
5243
5437
|
if (currentProjectKey && sourceEnvironmentKey) label = `${currentProjectKey} - ${sourceEnvironmentKey}`;
|
|
5244
5438
|
return label;
|
|
5245
5439
|
}
|
|
5246
|
-
|
|
5247
|
-
const {
|
|
5440
|
+
const ExpandedToolbarContent = /*#__PURE__*/ react.forwardRef((props, ref)=>{
|
|
5441
|
+
const { activeTab, slideDirection, searchTerm, searchIsExpanded, onSearch, onClose, onTogglePin, isPinned, onTabChange, setSearchIsExpanded, mode, flagOverridePlugin, eventInterceptionPlugin, baseUrl, defaultActiveTab } = props;
|
|
5248
5442
|
const { state } = useDevServerContext();
|
|
5249
5443
|
const headerLabel = getHeaderLabel(state.currentProjectKey, state.sourceEnvironmentKey);
|
|
5250
5444
|
const { error } = state;
|
|
5251
5445
|
const availableTabs = getTabsForMode(mode, !!flagOverridePlugin, !!eventInterceptionPlugin);
|
|
5252
|
-
const defaultActiveTab = getDefaultActiveTab(mode, !!flagOverridePlugin, !!eventInterceptionPlugin);
|
|
5253
5446
|
const shouldShowError = error && 'dev-server' === mode && 'error' === state.connectionStatus;
|
|
5254
5447
|
return /*#__PURE__*/ jsxs(motion.div, {
|
|
5448
|
+
ref: ref,
|
|
5255
5449
|
className: toolbarContent,
|
|
5450
|
+
tabIndex: 0,
|
|
5451
|
+
role: "group",
|
|
5452
|
+
"aria-label": "LaunchDarkly developer toolbar content",
|
|
5256
5453
|
initial: {
|
|
5257
5454
|
opacity: 0,
|
|
5258
5455
|
y: 10,
|
|
@@ -5270,66 +5467,64 @@ function ExpandedToolbarContent(props) {
|
|
|
5270
5467
|
},
|
|
5271
5468
|
transition: ANIMATION_CONFIG.toolbarContent,
|
|
5272
5469
|
children: [
|
|
5273
|
-
/*#__PURE__*/
|
|
5274
|
-
|
|
5275
|
-
|
|
5276
|
-
|
|
5277
|
-
|
|
5278
|
-
|
|
5279
|
-
|
|
5280
|
-
|
|
5281
|
-
|
|
5282
|
-
|
|
5283
|
-
|
|
5284
|
-
|
|
5285
|
-
|
|
5286
|
-
|
|
5287
|
-
|
|
5288
|
-
|
|
5289
|
-
|
|
5290
|
-
|
|
5291
|
-
|
|
5292
|
-
|
|
5293
|
-
|
|
5294
|
-
|
|
5295
|
-
|
|
5296
|
-
|
|
5297
|
-
|
|
5298
|
-
|
|
5299
|
-
|
|
5300
|
-
|
|
5301
|
-
|
|
5302
|
-
|
|
5303
|
-
|
|
5304
|
-
|
|
5305
|
-
|
|
5306
|
-
|
|
5307
|
-
|
|
5308
|
-
|
|
5309
|
-
|
|
5310
|
-
|
|
5311
|
-
|
|
5312
|
-
|
|
5313
|
-
|
|
5314
|
-
|
|
5315
|
-
|
|
5316
|
-
|
|
5317
|
-
|
|
5318
|
-
|
|
5319
|
-
|
|
5320
|
-
|
|
5321
|
-
|
|
5322
|
-
|
|
5323
|
-
|
|
5324
|
-
|
|
5325
|
-
|
|
5326
|
-
|
|
5327
|
-
onTogglePin: onTogglePin
|
|
5328
|
-
})
|
|
5470
|
+
/*#__PURE__*/ jsxs(motion.div, {
|
|
5471
|
+
className: contentArea,
|
|
5472
|
+
initial: {
|
|
5473
|
+
opacity: 0,
|
|
5474
|
+
y: -10
|
|
5475
|
+
},
|
|
5476
|
+
animate: {
|
|
5477
|
+
opacity: 1,
|
|
5478
|
+
y: 0
|
|
5479
|
+
},
|
|
5480
|
+
exit: {
|
|
5481
|
+
opacity: 0,
|
|
5482
|
+
y: -10
|
|
5483
|
+
},
|
|
5484
|
+
transition: ANIMATION_CONFIG.contentArea,
|
|
5485
|
+
children: [
|
|
5486
|
+
/*#__PURE__*/ jsx(Header, {
|
|
5487
|
+
onSearch: onSearch,
|
|
5488
|
+
searchTerm: searchTerm,
|
|
5489
|
+
onClose: onClose,
|
|
5490
|
+
searchIsExpanded: searchIsExpanded,
|
|
5491
|
+
setSearchIsExpanded: setSearchIsExpanded,
|
|
5492
|
+
label: headerLabel,
|
|
5493
|
+
mode: mode
|
|
5494
|
+
}),
|
|
5495
|
+
shouldShowError && /*#__PURE__*/ jsx(ErrorMessage, {
|
|
5496
|
+
error: error
|
|
5497
|
+
}),
|
|
5498
|
+
!shouldShowError && /*#__PURE__*/ jsx(motion.div, {
|
|
5499
|
+
className: scrollableContent,
|
|
5500
|
+
initial: {
|
|
5501
|
+
opacity: 0,
|
|
5502
|
+
y: -10
|
|
5503
|
+
},
|
|
5504
|
+
animate: {
|
|
5505
|
+
opacity: 1,
|
|
5506
|
+
y: 0
|
|
5507
|
+
},
|
|
5508
|
+
transition: {
|
|
5509
|
+
duration: 0.25,
|
|
5510
|
+
ease: EASING.smooth,
|
|
5511
|
+
delay: 0.05
|
|
5512
|
+
},
|
|
5513
|
+
children: /*#__PURE__*/ jsx(AnimatePresence, {
|
|
5514
|
+
mode: "wait",
|
|
5515
|
+
children: activeTab && /*#__PURE__*/ jsx(TabContentRenderer, {
|
|
5516
|
+
activeTab: activeTab,
|
|
5517
|
+
baseUrl: baseUrl,
|
|
5518
|
+
slideDirection: slideDirection,
|
|
5519
|
+
mode: mode,
|
|
5520
|
+
flagOverridePlugin: flagOverridePlugin,
|
|
5521
|
+
eventInterceptionPlugin: eventInterceptionPlugin,
|
|
5522
|
+
isPinned: isPinned,
|
|
5523
|
+
onTogglePin: onTogglePin
|
|
5329
5524
|
})
|
|
5330
5525
|
})
|
|
5331
|
-
|
|
5332
|
-
|
|
5526
|
+
})
|
|
5527
|
+
]
|
|
5333
5528
|
}),
|
|
5334
5529
|
/*#__PURE__*/ jsx(motion.div, {
|
|
5335
5530
|
className: tabsContainer,
|
|
@@ -5380,44 +5575,12 @@ function ExpandedToolbarContent(props) {
|
|
|
5380
5575
|
})
|
|
5381
5576
|
]
|
|
5382
5577
|
}, "toolbar-content");
|
|
5383
|
-
}
|
|
5384
|
-
function
|
|
5385
|
-
const
|
|
5386
|
-
|
|
5387
|
-
|
|
5388
|
-
if (event.key === targetKey) setKeyPressed(true);
|
|
5389
|
-
};
|
|
5390
|
-
const upHandler = (event)=>{
|
|
5391
|
-
if (event.key === targetKey) setKeyPressed(false);
|
|
5392
|
-
};
|
|
5393
|
-
const resetKeyState = ()=>{
|
|
5394
|
-
setKeyPressed(false);
|
|
5395
|
-
};
|
|
5396
|
-
const visibilityChangeHandler = ()=>{
|
|
5397
|
-
if (document.hidden) resetKeyState();
|
|
5398
|
-
};
|
|
5399
|
-
window.addEventListener('keydown', downHandler);
|
|
5400
|
-
window.addEventListener('keyup', upHandler);
|
|
5401
|
-
window.addEventListener('blur', resetKeyState);
|
|
5402
|
-
window.addEventListener('focusout', resetKeyState);
|
|
5403
|
-
document.addEventListener('visibilitychange', visibilityChangeHandler);
|
|
5404
|
-
window.addEventListener('focus', resetKeyState);
|
|
5405
|
-
return ()=>{
|
|
5406
|
-
window.removeEventListener('keydown', downHandler);
|
|
5407
|
-
window.removeEventListener('keyup', upHandler);
|
|
5408
|
-
window.removeEventListener('blur', resetKeyState);
|
|
5409
|
-
window.removeEventListener('focusout', resetKeyState);
|
|
5410
|
-
document.removeEventListener('visibilitychange', visibilityChangeHandler);
|
|
5411
|
-
window.removeEventListener('focus', resetKeyState);
|
|
5412
|
-
};
|
|
5413
|
-
}, [
|
|
5414
|
-
targetKey
|
|
5415
|
-
]);
|
|
5416
|
-
return keyPressed;
|
|
5417
|
-
}
|
|
5418
|
-
function useToolbarState() {
|
|
5578
|
+
});
|
|
5579
|
+
function useToolbarState(props) {
|
|
5580
|
+
const { defaultActiveTab } = props;
|
|
5581
|
+
const { setSearchTerm } = useSearchContext();
|
|
5582
|
+
const analytics = useAnalytics();
|
|
5419
5583
|
const [isExpanded, setIsExpanded] = useState(false);
|
|
5420
|
-
const [isHovered, setIsHovered] = useState(false);
|
|
5421
5584
|
const [activeTab, setActiveTab] = useState();
|
|
5422
5585
|
const [previousTab, setPreviousTab] = useState();
|
|
5423
5586
|
const [isAnimating, setIsAnimating] = useState(false);
|
|
@@ -5425,15 +5588,6 @@ function useToolbarState() {
|
|
|
5425
5588
|
const [isPinned, setIsPinned] = useState(()=>loadToolbarPinned());
|
|
5426
5589
|
const hasBeenExpandedRef = useRef(false);
|
|
5427
5590
|
const toolbarRef = useRef(null);
|
|
5428
|
-
const isMetaPressed = useKeyPressed('Meta');
|
|
5429
|
-
const isControlPressed = useKeyPressed('Control');
|
|
5430
|
-
const isDragModifierPressed = isMetaPressed || isControlPressed;
|
|
5431
|
-
const { setSearchTerm } = useSearchContext();
|
|
5432
|
-
const showFullToolbar = useMemo(()=>isExpanded || isHovered && !isExpanded && !isDragModifierPressed, [
|
|
5433
|
-
isExpanded,
|
|
5434
|
-
isHovered,
|
|
5435
|
-
isDragModifierPressed
|
|
5436
|
-
]);
|
|
5437
5591
|
const slideDirection = useMemo(()=>{
|
|
5438
5592
|
if (!activeTab || !previousTab) return 1;
|
|
5439
5593
|
const currentIndex = TAB_ORDER.indexOf(activeTab);
|
|
@@ -5448,7 +5602,12 @@ function useToolbarState() {
|
|
|
5448
5602
|
setSearchIsExpanded(false);
|
|
5449
5603
|
setSearchTerm('');
|
|
5450
5604
|
const newTabId = tabId;
|
|
5451
|
-
if (newTabId === activeTab && isExpanded)
|
|
5605
|
+
if (newTabId === activeTab && isExpanded) {
|
|
5606
|
+
analytics.trackToolbarToggle('collapse', 'tab_toggle');
|
|
5607
|
+
setIsExpanded(false);
|
|
5608
|
+
return;
|
|
5609
|
+
}
|
|
5610
|
+
analytics.trackTabChange(activeTab || null, newTabId);
|
|
5452
5611
|
setPreviousTab(activeTab);
|
|
5453
5612
|
setActiveTab(newTabId);
|
|
5454
5613
|
if (!isExpanded) setIsExpanded(true);
|
|
@@ -5456,19 +5615,17 @@ function useToolbarState() {
|
|
|
5456
5615
|
activeTab,
|
|
5457
5616
|
isExpanded,
|
|
5458
5617
|
setSearchTerm,
|
|
5459
|
-
isAnimating
|
|
5618
|
+
isAnimating,
|
|
5619
|
+
analytics
|
|
5460
5620
|
]);
|
|
5461
|
-
const handleMouseEnter = useCallback(()=>{
|
|
5462
|
-
setIsHovered(true);
|
|
5463
|
-
}, []);
|
|
5464
|
-
const handleMouseLeave = useCallback(()=>{
|
|
5465
|
-
setIsHovered(false);
|
|
5466
|
-
}, []);
|
|
5467
5621
|
const handleClose = useCallback(()=>{
|
|
5622
|
+
analytics.trackToolbarToggle('collapse', 'close_button');
|
|
5468
5623
|
setIsExpanded(false);
|
|
5469
5624
|
setIsPinned(false);
|
|
5470
5625
|
saveToolbarPinned(false);
|
|
5471
|
-
}, [
|
|
5626
|
+
}, [
|
|
5627
|
+
analytics
|
|
5628
|
+
]);
|
|
5472
5629
|
const handleSearch = useCallback((newSearchTerm)=>{
|
|
5473
5630
|
setSearchTerm(newSearchTerm);
|
|
5474
5631
|
}, [
|
|
@@ -5481,22 +5638,27 @@ function useToolbarState() {
|
|
|
5481
5638
|
return newValue;
|
|
5482
5639
|
});
|
|
5483
5640
|
}, []);
|
|
5484
|
-
|
|
5485
|
-
if (
|
|
5641
|
+
const handleCircleClick = useCallback(()=>{
|
|
5642
|
+
if (!isExpanded) {
|
|
5643
|
+
if (!activeTab) setActiveTab(defaultActiveTab);
|
|
5644
|
+
setIsExpanded(true);
|
|
5645
|
+
}
|
|
5486
5646
|
}, [
|
|
5487
|
-
|
|
5647
|
+
isExpanded,
|
|
5648
|
+
activeTab,
|
|
5649
|
+
defaultActiveTab
|
|
5488
5650
|
]);
|
|
5489
5651
|
useEffect(()=>{
|
|
5490
|
-
if (
|
|
5491
|
-
setActiveTab(void 0);
|
|
5492
|
-
setPreviousTab(void 0);
|
|
5493
|
-
}
|
|
5652
|
+
if (isExpanded) hasBeenExpandedRef.current = true;
|
|
5494
5653
|
}, [
|
|
5495
5654
|
isExpanded
|
|
5496
5655
|
]);
|
|
5497
5656
|
useEffect(()=>{
|
|
5498
5657
|
const handleClickOutside = (event)=>{
|
|
5499
|
-
if (isExpanded && !isPinned && toolbarRef.current && !toolbarRef.current.contains(event.target))
|
|
5658
|
+
if (isExpanded && !isPinned && toolbarRef.current && !toolbarRef.current.contains(event.target)) {
|
|
5659
|
+
analytics.trackToolbarToggle('collapse', 'click_outside');
|
|
5660
|
+
setIsExpanded(false);
|
|
5661
|
+
}
|
|
5500
5662
|
};
|
|
5501
5663
|
document.addEventListener('mousedown', handleClickOutside);
|
|
5502
5664
|
return ()=>{
|
|
@@ -5504,42 +5666,49 @@ function useToolbarState() {
|
|
|
5504
5666
|
};
|
|
5505
5667
|
}, [
|
|
5506
5668
|
isExpanded,
|
|
5507
|
-
isPinned
|
|
5669
|
+
isPinned,
|
|
5670
|
+
analytics
|
|
5508
5671
|
]);
|
|
5509
5672
|
return {
|
|
5510
5673
|
isExpanded,
|
|
5511
|
-
isHovered,
|
|
5512
5674
|
activeTab,
|
|
5513
5675
|
previousTab,
|
|
5514
5676
|
isAnimating,
|
|
5515
5677
|
searchIsExpanded,
|
|
5516
|
-
showFullToolbar,
|
|
5517
5678
|
slideDirection,
|
|
5518
5679
|
hasBeenExpanded: hasBeenExpandedRef.current,
|
|
5519
|
-
isDragModifierPressed,
|
|
5520
5680
|
isPinned,
|
|
5521
5681
|
toolbarRef,
|
|
5522
5682
|
handleTabChange,
|
|
5523
|
-
handleMouseEnter,
|
|
5524
|
-
handleMouseLeave,
|
|
5525
5683
|
handleClose,
|
|
5526
5684
|
handleSearch,
|
|
5527
5685
|
handleTogglePin,
|
|
5686
|
+
handleCircleClick,
|
|
5528
5687
|
setIsAnimating,
|
|
5529
5688
|
setSearchIsExpanded
|
|
5530
5689
|
};
|
|
5531
5690
|
}
|
|
5532
5691
|
function useToolbarAnimations(props) {
|
|
5533
|
-
const {
|
|
5692
|
+
const { isExpanded, setIsAnimating, onExpandComplete, onCollapseComplete } = props;
|
|
5693
|
+
const previousIsExpanded = useRef(isExpanded);
|
|
5534
5694
|
const containerAnimations = useMemo(()=>({
|
|
5535
|
-
width:
|
|
5536
|
-
height:
|
|
5537
|
-
borderRadius:
|
|
5538
|
-
scale:
|
|
5539
|
-
boxShadow:
|
|
5695
|
+
width: isExpanded ? DIMENSIONS.expanded.width : DIMENSIONS.collapsed.width,
|
|
5696
|
+
height: isExpanded ? 'auto' : DIMENSIONS.collapsed.height,
|
|
5697
|
+
borderRadius: isExpanded ? DIMENSIONS.expanded.borderRadius : DIMENSIONS.collapsed.borderRadius,
|
|
5698
|
+
scale: isExpanded ? DIMENSIONS.scale.expanded : DIMENSIONS.scale.collapsed,
|
|
5699
|
+
boxShadow: isExpanded ? SHADOWS.expanded : SHADOWS.collapsed
|
|
5540
5700
|
}), [
|
|
5541
|
-
|
|
5542
|
-
|
|
5701
|
+
isExpanded
|
|
5702
|
+
]);
|
|
5703
|
+
const animationConfig = useMemo(()=>{
|
|
5704
|
+
const wasExpanded = previousIsExpanded.current;
|
|
5705
|
+
const currentlyExpanded = isExpanded;
|
|
5706
|
+
previousIsExpanded.current = isExpanded;
|
|
5707
|
+
if (!wasExpanded && currentlyExpanded) return ANIMATION_CONFIG.containerExpand;
|
|
5708
|
+
if (wasExpanded && !currentlyExpanded) return ANIMATION_CONFIG.containerCollapse;
|
|
5709
|
+
return ANIMATION_CONFIG.containerExpand;
|
|
5710
|
+
}, [
|
|
5711
|
+
isExpanded
|
|
5543
5712
|
]);
|
|
5544
5713
|
const handleAnimationStart = useCallback(()=>{
|
|
5545
5714
|
setIsAnimating(true);
|
|
@@ -5548,20 +5717,25 @@ function useToolbarAnimations(props) {
|
|
|
5548
5717
|
]);
|
|
5549
5718
|
const handleAnimationComplete = useCallback(()=>{
|
|
5550
5719
|
setIsAnimating(false);
|
|
5720
|
+
if (isExpanded && onExpandComplete) onExpandComplete();
|
|
5721
|
+
else if (!isExpanded && onCollapseComplete) onCollapseComplete();
|
|
5551
5722
|
}, [
|
|
5552
|
-
setIsAnimating
|
|
5723
|
+
setIsAnimating,
|
|
5724
|
+
isExpanded,
|
|
5725
|
+
onExpandComplete,
|
|
5726
|
+
onCollapseComplete
|
|
5553
5727
|
]);
|
|
5554
5728
|
return {
|
|
5555
5729
|
containerAnimations,
|
|
5556
|
-
animationConfig
|
|
5730
|
+
animationConfig,
|
|
5557
5731
|
handleAnimationStart,
|
|
5558
5732
|
handleAnimationComplete
|
|
5559
5733
|
};
|
|
5560
5734
|
}
|
|
5561
5735
|
function useToolbarDrag({ enabled, onDragEnd, elementRef }) {
|
|
5736
|
+
const draggedRef = useRef(false);
|
|
5562
5737
|
const handleMouseDown = useCallback((event)=>{
|
|
5563
5738
|
if (!enabled || !elementRef.current) return;
|
|
5564
|
-
event.preventDefault();
|
|
5565
5739
|
const startPosition = {
|
|
5566
5740
|
x: event.clientX,
|
|
5567
5741
|
y: event.clientY
|
|
@@ -5577,13 +5751,21 @@ function useToolbarDrag({ enabled, onDragEnd, elementRef }) {
|
|
|
5577
5751
|
x: mouseEvent.clientX - startPosition.x,
|
|
5578
5752
|
y: mouseEvent.clientY - startPosition.y
|
|
5579
5753
|
};
|
|
5580
|
-
const
|
|
5581
|
-
|
|
5582
|
-
|
|
5583
|
-
|
|
5584
|
-
|
|
5585
|
-
|
|
5754
|
+
const distance = Math.sqrt(offset.x * offset.x + offset.y * offset.y);
|
|
5755
|
+
if (distance > DRAG_CONSTANTS.THRESHOLD_PIXELS && !draggedRef.current) {
|
|
5756
|
+
draggedRef.current = true;
|
|
5757
|
+
document.addEventListener('selectstart', preventDefault);
|
|
5758
|
+
}
|
|
5759
|
+
if (draggedRef.current) {
|
|
5760
|
+
const newPosition = {
|
|
5761
|
+
x: initialPosition.x + offset.x,
|
|
5762
|
+
y: initialPosition.y + offset.y
|
|
5763
|
+
};
|
|
5764
|
+
elementRef.current.style.left = `${newPosition.x}px`;
|
|
5765
|
+
elementRef.current.style.top = `${newPosition.y}px`;
|
|
5766
|
+
}
|
|
5586
5767
|
};
|
|
5768
|
+
const preventDefault = (e)=>e.preventDefault();
|
|
5587
5769
|
const resetElementStyles = ()=>{
|
|
5588
5770
|
if (elementRef.current) {
|
|
5589
5771
|
elementRef.current.style.left = '';
|
|
@@ -5597,8 +5779,12 @@ function useToolbarDrag({ enabled, onDragEnd, elementRef }) {
|
|
|
5597
5779
|
const handleDragComplete = (upEvent)=>{
|
|
5598
5780
|
document.removeEventListener('mousemove', updateElementPosition);
|
|
5599
5781
|
document.removeEventListener('mouseup', handleDragComplete);
|
|
5782
|
+
document.removeEventListener('selectstart', preventDefault);
|
|
5600
5783
|
resetElementStyles();
|
|
5601
|
-
onDragEnd(upEvent.clientX);
|
|
5784
|
+
if (draggedRef.current) onDragEnd(upEvent.clientX, upEvent.clientY);
|
|
5785
|
+
setTimeout(()=>{
|
|
5786
|
+
draggedRef.current = false;
|
|
5787
|
+
}, DRAG_CONSTANTS.CLICK_RESET_DELAY_MS);
|
|
5602
5788
|
};
|
|
5603
5789
|
document.addEventListener('mousemove', updateElementPosition);
|
|
5604
5790
|
document.addEventListener('mouseup', handleDragComplete);
|
|
@@ -5607,8 +5793,10 @@ function useToolbarDrag({ enabled, onDragEnd, elementRef }) {
|
|
|
5607
5793
|
onDragEnd,
|
|
5608
5794
|
elementRef
|
|
5609
5795
|
]);
|
|
5796
|
+
const isDragging = useCallback(()=>draggedRef.current, []);
|
|
5610
5797
|
return {
|
|
5611
|
-
handleMouseDown
|
|
5798
|
+
handleMouseDown,
|
|
5799
|
+
isDragging
|
|
5612
5800
|
};
|
|
5613
5801
|
}
|
|
5614
5802
|
const useToolbarVisibility_STORAGE_KEY = TOOLBAR_STORAGE_KEYS.DISABLED;
|
|
@@ -5660,52 +5848,92 @@ function useToolbarVisibility() {
|
|
|
5660
5848
|
function LdToolbar(props) {
|
|
5661
5849
|
const { mode, flagOverridePlugin, eventInterceptionPlugin, baseUrl } = props;
|
|
5662
5850
|
const { searchTerm } = useSearchContext();
|
|
5663
|
-
const {
|
|
5664
|
-
const
|
|
5665
|
-
const
|
|
5666
|
-
const
|
|
5667
|
-
|
|
5668
|
-
|
|
5669
|
-
|
|
5670
|
-
|
|
5851
|
+
const { position, handlePositionChange } = useToolbarUIContext();
|
|
5852
|
+
const analytics = useAnalytics();
|
|
5853
|
+
const defaultActiveTab = getDefaultActiveTab(mode, !!flagOverridePlugin, !!eventInterceptionPlugin);
|
|
5854
|
+
const toolbarState = useToolbarState({
|
|
5855
|
+
defaultActiveTab
|
|
5856
|
+
});
|
|
5857
|
+
const circleButtonRef = useRef(null);
|
|
5858
|
+
const expandedContentRef = useRef(null);
|
|
5859
|
+
const { activeTab, slideDirection, searchIsExpanded, isExpanded, toolbarRef, handleTabChange, handleClose, handleSearch, handleTogglePin, handleCircleClick, isPinned, setSearchIsExpanded, setIsAnimating } = toolbarState;
|
|
5860
|
+
const focusExpandedToolbar = useCallback(()=>{
|
|
5861
|
+
if (expandedContentRef.current) expandedContentRef.current.focus();
|
|
5862
|
+
}, [
|
|
5863
|
+
expandedContentRef
|
|
5864
|
+
]);
|
|
5865
|
+
const focusCollapsedToolbar = useCallback(()=>{
|
|
5866
|
+
if (circleButtonRef.current) circleButtonRef.current.focus();
|
|
5867
|
+
}, [
|
|
5868
|
+
circleButtonRef
|
|
5869
|
+
]);
|
|
5870
|
+
const { containerAnimations, animationConfig, handleAnimationStart, handleAnimationComplete } = useToolbarAnimations({
|
|
5871
|
+
isExpanded,
|
|
5872
|
+
setIsAnimating,
|
|
5873
|
+
onExpandComplete: focusExpandedToolbar,
|
|
5874
|
+
onCollapseComplete: focusCollapsedToolbar
|
|
5671
5875
|
});
|
|
5672
|
-
const
|
|
5673
|
-
const
|
|
5674
|
-
const handleDragEnd = useCallback((clientX)=>{
|
|
5876
|
+
const isDragEnabled = !isExpanded;
|
|
5877
|
+
const handleDragEnd = useCallback((clientX, clientY)=>{
|
|
5675
5878
|
const screenWidth = window.innerWidth;
|
|
5676
|
-
const
|
|
5879
|
+
const screenHeight = window.innerHeight;
|
|
5880
|
+
const isLeft = clientX < screenWidth / 2;
|
|
5881
|
+
const isTop = clientY < screenHeight / 2;
|
|
5882
|
+
const newPosition = isTop ? isLeft ? 'top-left' : 'top-right' : isLeft ? 'bottom-left' : 'bottom-right';
|
|
5883
|
+
if (newPosition !== position) analytics.trackPositionChange(position, newPosition, 'drag');
|
|
5677
5884
|
handlePositionChange(newPosition);
|
|
5678
5885
|
}, [
|
|
5679
|
-
handlePositionChange
|
|
5886
|
+
handlePositionChange,
|
|
5887
|
+
position,
|
|
5888
|
+
analytics
|
|
5680
5889
|
]);
|
|
5681
|
-
const { handleMouseDown } = useToolbarDrag({
|
|
5890
|
+
const { handleMouseDown, isDragging } = useToolbarDrag({
|
|
5682
5891
|
enabled: isDragEnabled,
|
|
5683
5892
|
onDragEnd: handleDragEnd,
|
|
5684
5893
|
elementRef: toolbarRef
|
|
5685
5894
|
});
|
|
5895
|
+
const handleCircleClickWithDragCheck = useCallback(()=>{
|
|
5896
|
+
if (!isDragging()) handleCircleClick();
|
|
5897
|
+
}, [
|
|
5898
|
+
handleCircleClick,
|
|
5899
|
+
isDragging
|
|
5900
|
+
]);
|
|
5901
|
+
const positionClassMap = {
|
|
5902
|
+
'bottom-left': positionBottomLeft,
|
|
5903
|
+
'bottom-right': positionBottomRight,
|
|
5904
|
+
'top-left': positionTopLeft,
|
|
5905
|
+
'top-right': positionTopRight
|
|
5906
|
+
};
|
|
5686
5907
|
return /*#__PURE__*/ jsxs(motion.div, {
|
|
5687
5908
|
ref: toolbarRef,
|
|
5688
|
-
className: `${toolbarContainer} ${
|
|
5689
|
-
onMouseEnter: handleMouseEnter,
|
|
5690
|
-
onMouseLeave: handleMouseLeave,
|
|
5691
|
-
onMouseDown: handleMouseDown,
|
|
5909
|
+
className: `${toolbarContainer} ${positionClassMap[position]} ${isExpanded ? toolbarExpanded : toolbarCircle}`,
|
|
5692
5910
|
initial: false,
|
|
5693
5911
|
animate: containerAnimations,
|
|
5694
5912
|
transition: animationConfig,
|
|
5695
5913
|
onAnimationStart: handleAnimationStart,
|
|
5696
5914
|
onAnimationComplete: handleAnimationComplete,
|
|
5915
|
+
onKeyDown: (e)=>{
|
|
5916
|
+
if (isExpanded) return;
|
|
5917
|
+
if ('Enter' === e.key || ' ' === e.key) {
|
|
5918
|
+
e.preventDefault();
|
|
5919
|
+
handleCircleClickWithDragCheck();
|
|
5920
|
+
}
|
|
5921
|
+
},
|
|
5697
5922
|
"data-testid": "launchdarkly-toolbar",
|
|
5698
|
-
role:
|
|
5699
|
-
"aria-label":
|
|
5923
|
+
role: isExpanded ? 'toolbar' : 'button',
|
|
5924
|
+
"aria-label": isExpanded ? 'LaunchDarkly toolbar' : 'Open LaunchDarkly toolbar',
|
|
5925
|
+
tabIndex: isExpanded ? -1 : 0,
|
|
5700
5926
|
children: [
|
|
5701
5927
|
/*#__PURE__*/ jsx(AnimatePresence, {
|
|
5702
|
-
children: !
|
|
5703
|
-
|
|
5928
|
+
children: !isExpanded && /*#__PURE__*/ jsx(CircleLogo, {
|
|
5929
|
+
ref: circleButtonRef,
|
|
5930
|
+
onClick: handleCircleClickWithDragCheck,
|
|
5931
|
+
onMouseDown: handleMouseDown
|
|
5704
5932
|
})
|
|
5705
5933
|
}),
|
|
5706
5934
|
/*#__PURE__*/ jsx(AnimatePresence, {
|
|
5707
|
-
children:
|
|
5708
|
-
|
|
5935
|
+
children: isExpanded && /*#__PURE__*/ jsx(ExpandedToolbarContent, {
|
|
5936
|
+
ref: expandedContentRef,
|
|
5709
5937
|
activeTab: activeTab,
|
|
5710
5938
|
slideDirection: slideDirection,
|
|
5711
5939
|
searchTerm: searchTerm,
|
|
@@ -5719,7 +5947,8 @@ function LdToolbar(props) {
|
|
|
5719
5947
|
flagOverridePlugin: flagOverridePlugin,
|
|
5720
5948
|
eventInterceptionPlugin: eventInterceptionPlugin,
|
|
5721
5949
|
mode: mode,
|
|
5722
|
-
baseUrl: baseUrl
|
|
5950
|
+
baseUrl: baseUrl,
|
|
5951
|
+
defaultActiveTab: defaultActiveTab
|
|
5723
5952
|
})
|
|
5724
5953
|
})
|
|
5725
5954
|
]
|
|
@@ -5730,19 +5959,24 @@ function LaunchDarklyToolbar(props) {
|
|
|
5730
5959
|
const isVisible = useToolbarVisibility();
|
|
5731
5960
|
if (!isVisible) return null;
|
|
5732
5961
|
const mode = getToolbarMode(devServerUrl);
|
|
5733
|
-
return /*#__PURE__*/ jsx(
|
|
5734
|
-
config: {
|
|
5735
|
-
projectKey,
|
|
5736
|
-
devServerUrl,
|
|
5737
|
-
pollIntervalInMs
|
|
5738
|
-
},
|
|
5962
|
+
return /*#__PURE__*/ jsx(ToolbarUIProvider, {
|
|
5739
5963
|
initialPosition: position,
|
|
5740
|
-
children: /*#__PURE__*/ jsx(
|
|
5741
|
-
|
|
5742
|
-
|
|
5743
|
-
|
|
5744
|
-
|
|
5745
|
-
|
|
5964
|
+
children: /*#__PURE__*/ jsx(DevServerProvider, {
|
|
5965
|
+
config: {
|
|
5966
|
+
projectKey,
|
|
5967
|
+
devServerUrl,
|
|
5968
|
+
pollIntervalInMs
|
|
5969
|
+
},
|
|
5970
|
+
children: /*#__PURE__*/ jsx(AnalyticsProvider, {
|
|
5971
|
+
ldClient: flagOverridePlugin?.getClient() ?? eventInterceptionPlugin?.getClient(),
|
|
5972
|
+
children: /*#__PURE__*/ jsx(SearchProvider, {
|
|
5973
|
+
children: /*#__PURE__*/ jsx(LdToolbar, {
|
|
5974
|
+
mode: mode,
|
|
5975
|
+
baseUrl: baseUrl,
|
|
5976
|
+
flagOverridePlugin: flagOverridePlugin,
|
|
5977
|
+
eventInterceptionPlugin: eventInterceptionPlugin
|
|
5978
|
+
})
|
|
5979
|
+
})
|
|
5746
5980
|
})
|
|
5747
5981
|
})
|
|
5748
5982
|
});
|
|
@@ -6121,6 +6355,7 @@ class EventInterceptionPlugin {
|
|
|
6121
6355
|
afterEvaluationHook;
|
|
6122
6356
|
eventStore;
|
|
6123
6357
|
config;
|
|
6358
|
+
ldClient = null;
|
|
6124
6359
|
constructor(config = {}){
|
|
6125
6360
|
this.config = {
|
|
6126
6361
|
enableLogging: false,
|
|
@@ -6131,6 +6366,8 @@ class EventInterceptionPlugin {
|
|
|
6131
6366
|
maxEvents: this.config.eventCapacity
|
|
6132
6367
|
});
|
|
6133
6368
|
const onNewEvent = (event)=>{
|
|
6369
|
+
const isToolbarEvent = this.isToolbarEvent(event);
|
|
6370
|
+
if (isToolbarEvent) return;
|
|
6134
6371
|
if (this.config.enableLogging) console.log("\uD83C\uDFAF Event intercepted:", {
|
|
6135
6372
|
kind: event.kind,
|
|
6136
6373
|
key: event.key,
|
|
@@ -6152,6 +6389,9 @@ class EventInterceptionPlugin {
|
|
|
6152
6389
|
onNewEvent
|
|
6153
6390
|
});
|
|
6154
6391
|
}
|
|
6392
|
+
isToolbarEvent(event) {
|
|
6393
|
+
return event.key?.startsWith(ANALYTICS_EVENT_PREFIX) ?? false;
|
|
6394
|
+
}
|
|
6155
6395
|
getMetadata() {
|
|
6156
6396
|
return {
|
|
6157
6397
|
name: 'EventInterceptionPlugin'
|
|
@@ -6164,7 +6404,12 @@ class EventInterceptionPlugin {
|
|
|
6164
6404
|
this.afterEvaluationHook
|
|
6165
6405
|
];
|
|
6166
6406
|
}
|
|
6167
|
-
register(
|
|
6407
|
+
register(ldClient) {
|
|
6408
|
+
this.ldClient = ldClient;
|
|
6409
|
+
}
|
|
6410
|
+
getClient() {
|
|
6411
|
+
return this.ldClient;
|
|
6412
|
+
}
|
|
6168
6413
|
getEvents() {
|
|
6169
6414
|
return this.eventStore.getEvents();
|
|
6170
6415
|
}
|