@buoy-gg/zustand 2.1.11 → 2.1.13

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.
Files changed (57) hide show
  1. package/LICENSE +58 -0
  2. package/lib/commonjs/index.js +1 -91
  3. package/lib/commonjs/preset.js +1 -102
  4. package/lib/commonjs/zustand/components/ZustandActionButton.js +1 -116
  5. package/lib/commonjs/zustand/components/ZustandDetailViewToggle.js +1 -134
  6. package/lib/commonjs/zustand/components/ZustandEventFilterView.js +1 -291
  7. package/lib/commonjs/zustand/components/ZustandIcon.js +1 -35
  8. package/lib/commonjs/zustand/components/ZustandModal.js +1 -603
  9. package/lib/commonjs/zustand/components/ZustandStateChangeItem.js +1 -165
  10. package/lib/commonjs/zustand/components/ZustandStateDetailContent.js +1 -352
  11. package/lib/commonjs/zustand/components/ZustandStateInfoView.js +1 -508
  12. package/lib/commonjs/zustand/components/ZustandStoreBrowser.js +1 -307
  13. package/lib/commonjs/zustand/components/index.js +1 -73
  14. package/lib/commonjs/zustand/hooks/index.js +1 -12
  15. package/lib/commonjs/zustand/hooks/useZustandStateChanges.js +1 -92
  16. package/lib/commonjs/zustand/index.js +1 -99
  17. package/lib/commonjs/zustand/utils/buoyZustandMiddleware.js +1 -220
  18. package/lib/commonjs/zustand/utils/index.js +1 -31
  19. package/lib/commonjs/zustand/utils/zustandStateStore.js +1 -361
  20. package/lib/module/index.js +1 -80
  21. package/lib/module/preset.js +1 -98
  22. package/lib/module/zustand/components/ZustandActionButton.js +1 -112
  23. package/lib/module/zustand/components/ZustandDetailViewToggle.js +1 -129
  24. package/lib/module/zustand/components/ZustandEventFilterView.js +1 -287
  25. package/lib/module/zustand/components/ZustandIcon.js +1 -32
  26. package/lib/module/zustand/components/ZustandModal.js +1 -599
  27. package/lib/module/zustand/components/ZustandStateChangeItem.js +1 -161
  28. package/lib/module/zustand/components/ZustandStateDetailContent.js +1 -348
  29. package/lib/module/zustand/components/ZustandStateInfoView.js +1 -503
  30. package/lib/module/zustand/components/ZustandStoreBrowser.js +1 -303
  31. package/lib/module/zustand/components/index.js +1 -10
  32. package/lib/module/zustand/hooks/index.js +1 -3
  33. package/lib/module/zustand/hooks/useZustandStateChanges.js +1 -88
  34. package/lib/module/zustand/index.js +1 -12
  35. package/lib/module/zustand/utils/buoyZustandMiddleware.js +1 -214
  36. package/lib/module/zustand/utils/index.js +1 -4
  37. package/lib/module/zustand/utils/zustandStateStore.js +1 -357
  38. package/package.json +10 -10
  39. package/lib/typescript/index.d.ts.map +0 -1
  40. package/lib/typescript/preset.d.ts.map +0 -1
  41. package/lib/typescript/zustand/components/ZustandActionButton.d.ts.map +0 -1
  42. package/lib/typescript/zustand/components/ZustandDetailViewToggle.d.ts.map +0 -1
  43. package/lib/typescript/zustand/components/ZustandEventFilterView.d.ts.map +0 -1
  44. package/lib/typescript/zustand/components/ZustandIcon.d.ts.map +0 -1
  45. package/lib/typescript/zustand/components/ZustandModal.d.ts.map +0 -1
  46. package/lib/typescript/zustand/components/ZustandStateChangeItem.d.ts.map +0 -1
  47. package/lib/typescript/zustand/components/ZustandStateDetailContent.d.ts.map +0 -1
  48. package/lib/typescript/zustand/components/ZustandStateInfoView.d.ts.map +0 -1
  49. package/lib/typescript/zustand/components/ZustandStoreBrowser.d.ts.map +0 -1
  50. package/lib/typescript/zustand/components/index.d.ts.map +0 -1
  51. package/lib/typescript/zustand/hooks/index.d.ts.map +0 -1
  52. package/lib/typescript/zustand/hooks/useZustandStateChanges.d.ts.map +0 -1
  53. package/lib/typescript/zustand/index.d.ts.map +0 -1
  54. package/lib/typescript/zustand/types/index.d.ts.map +0 -1
  55. package/lib/typescript/zustand/utils/buoyZustandMiddleware.d.ts.map +0 -1
  56. package/lib/typescript/zustand/utils/index.d.ts.map +0 -1
  57. package/lib/typescript/zustand/utils/zustandStateStore.d.ts.map +0 -1
package/LICENSE ADDED
@@ -0,0 +1,58 @@
1
+ PROPRIETARY SOFTWARE LICENSE
2
+
3
+ Copyright (c) 2024-present Buoy. All rights reserved.
4
+
5
+ This software and its source code are proprietary and confidential.
6
+
7
+ NOTICE: This is NOT open source software. This software is licensed,
8
+ not sold, and is protected by copyright laws and international treaties.
9
+
10
+ TERMS AND CONDITIONS:
11
+
12
+ 1. LICENSE GRANT
13
+ Subject to the terms of this Agreement and payment of applicable fees,
14
+ Buoy grants you a limited, non-exclusive, non-transferable license
15
+ to use the compiled software packages in your applications.
16
+
17
+ 2. RESTRICTIONS
18
+ You may NOT:
19
+ - Copy, modify, or distribute the source code
20
+ - Reverse engineer, decompile, or disassemble the software
21
+ - Remove or alter any proprietary notices or labels
22
+ - Sublicense, rent, lease, or lend the software
23
+ - Use the software to create competing products
24
+ - Share access credentials with unauthorized parties
25
+
26
+ 3. OWNERSHIP
27
+ React Buoy retains all right, title, and interest in the software,
28
+ including all intellectual property rights. This license does not
29
+ grant you any rights to trademarks or service marks.
30
+
31
+ 4. TERMINATION
32
+ This license is effective until terminated. Your rights under this
33
+ license will terminate automatically without notice if you fail to
34
+ comply with any of its terms. Upon termination, you must cease all
35
+ use and destroy all copies of the software.
36
+
37
+ 5. DISCLAIMER OF WARRANTIES
38
+ THE SOFTWARE IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND,
39
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
40
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, AND NONINFRINGEMENT.
41
+
42
+ 6. LIMITATION OF LIABILITY
43
+ IN NO EVENT SHALL BUOY BE LIABLE FOR ANY INDIRECT, INCIDENTAL,
44
+ SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES ARISING OUT OF OR IN
45
+ CONNECTION WITH THIS LICENSE OR THE USE OF THE SOFTWARE.
46
+
47
+ 7. GOVERNING LAW
48
+ This Agreement shall be governed by and construed in accordance with
49
+ the laws of the United States, without regard to its conflict of
50
+ law provisions.
51
+
52
+ For licensing inquiries and subscription information:
53
+ - Website: https://buoy.gg
54
+ - Email: AustinLovesWorking@gmail.com
55
+
56
+ Unauthorized reproduction or distribution of this software, or any
57
+ portion of it, may result in severe civil and criminal penalties,
58
+ and will be prosecuted to the maximum extent possible under the law.
@@ -1,91 +1 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "ZUSTAND_ICON_COLOR", {
7
- enumerable: true,
8
- get: function () {
9
- return _ZustandIcon.ZUSTAND_ICON_COLOR;
10
- }
11
- });
12
- Object.defineProperty(exports, "ZustandIcon", {
13
- enumerable: true,
14
- get: function () {
15
- return _ZustandIcon.ZustandIcon;
16
- }
17
- });
18
- Object.defineProperty(exports, "ZustandModal", {
19
- enumerable: true,
20
- get: function () {
21
- return _ZustandModal.ZustandModal;
22
- }
23
- });
24
- Object.defineProperty(exports, "ZustandStateChangeItem", {
25
- enumerable: true,
26
- get: function () {
27
- return _ZustandStateChangeItem.ZustandStateChangeItem;
28
- }
29
- });
30
- Object.defineProperty(exports, "ZustandStateDetailContent", {
31
- enumerable: true,
32
- get: function () {
33
- return _ZustandStateDetailContent.ZustandStateDetailContent;
34
- }
35
- });
36
- Object.defineProperty(exports, "ZustandStateDetailFooter", {
37
- enumerable: true,
38
- get: function () {
39
- return _ZustandStateDetailContent.ZustandStateDetailFooter;
40
- }
41
- });
42
- Object.defineProperty(exports, "buoyDevTools", {
43
- enumerable: true,
44
- get: function () {
45
- return _buoyZustandMiddleware.buoyDevTools;
46
- }
47
- });
48
- Object.defineProperty(exports, "createZustandTool", {
49
- enumerable: true,
50
- get: function () {
51
- return _preset.createZustandTool;
52
- }
53
- });
54
- Object.defineProperty(exports, "isStoreInstrumented", {
55
- enumerable: true,
56
- get: function () {
57
- return _buoyZustandMiddleware.isStoreInstrumented;
58
- }
59
- });
60
- Object.defineProperty(exports, "useZustandStateChanges", {
61
- enumerable: true,
62
- get: function () {
63
- return _useZustandStateChanges.useZustandStateChanges;
64
- }
65
- });
66
- Object.defineProperty(exports, "watchStores", {
67
- enumerable: true,
68
- get: function () {
69
- return _buoyZustandMiddleware.watchStores;
70
- }
71
- });
72
- Object.defineProperty(exports, "zustandStateStore", {
73
- enumerable: true,
74
- get: function () {
75
- return _zustandStateStore.zustandStateStore;
76
- }
77
- });
78
- Object.defineProperty(exports, "zustandToolPreset", {
79
- enumerable: true,
80
- get: function () {
81
- return _preset.zustandToolPreset;
82
- }
83
- });
84
- var _preset = require("./preset");
85
- var _buoyZustandMiddleware = require("./zustand/utils/buoyZustandMiddleware");
86
- var _useZustandStateChanges = require("./zustand/hooks/useZustandStateChanges");
87
- var _ZustandModal = require("./zustand/components/ZustandModal");
88
- var _ZustandStateChangeItem = require("./zustand/components/ZustandStateChangeItem");
89
- var _ZustandStateDetailContent = require("./zustand/components/ZustandStateDetailContent");
90
- var _ZustandIcon = require("./zustand/components/ZustandIcon");
91
- var _zustandStateStore = require("./zustand/utils/zustandStateStore");
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"ZUSTAND_ICON_COLOR",{enumerable:!0,get:function(){return _ZustandIcon.ZUSTAND_ICON_COLOR}}),Object.defineProperty(exports,"ZustandIcon",{enumerable:!0,get:function(){return _ZustandIcon.ZustandIcon}}),Object.defineProperty(exports,"ZustandModal",{enumerable:!0,get:function(){return _ZustandModal.ZustandModal}}),Object.defineProperty(exports,"ZustandStateChangeItem",{enumerable:!0,get:function(){return _ZustandStateChangeItem.ZustandStateChangeItem}}),Object.defineProperty(exports,"ZustandStateDetailContent",{enumerable:!0,get:function(){return _ZustandStateDetailContent.ZustandStateDetailContent}}),Object.defineProperty(exports,"ZustandStateDetailFooter",{enumerable:!0,get:function(){return _ZustandStateDetailContent.ZustandStateDetailFooter}}),Object.defineProperty(exports,"buoyDevTools",{enumerable:!0,get:function(){return _buoyZustandMiddleware.buoyDevTools}}),Object.defineProperty(exports,"createZustandTool",{enumerable:!0,get:function(){return _preset.createZustandTool}}),Object.defineProperty(exports,"isStoreInstrumented",{enumerable:!0,get:function(){return _buoyZustandMiddleware.isStoreInstrumented}}),Object.defineProperty(exports,"useZustandStateChanges",{enumerable:!0,get:function(){return _useZustandStateChanges.useZustandStateChanges}}),Object.defineProperty(exports,"watchStores",{enumerable:!0,get:function(){return _buoyZustandMiddleware.watchStores}}),Object.defineProperty(exports,"zustandStateStore",{enumerable:!0,get:function(){return _zustandStateStore.zustandStateStore}}),Object.defineProperty(exports,"zustandToolPreset",{enumerable:!0,get:function(){return _preset.zustandToolPreset}});var _preset=require("./preset"),_buoyZustandMiddleware=require("./zustand/utils/buoyZustandMiddleware"),_useZustandStateChanges=require("./zustand/hooks/useZustandStateChanges"),_ZustandModal=require("./zustand/components/ZustandModal"),_ZustandStateChangeItem=require("./zustand/components/ZustandStateChangeItem"),_ZustandStateDetailContent=require("./zustand/components/ZustandStateDetailContent"),_ZustandIcon=require("./zustand/components/ZustandIcon"),_zustandStateStore=require("./zustand/utils/zustandStateStore");
@@ -1,102 +1 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.createZustandTool = createZustandTool;
7
- exports.zustandToolPreset = void 0;
8
- var _ZustandModal = require("./zustand/components/ZustandModal");
9
- var _ZustandIcon = require("./zustand/components/ZustandIcon");
10
- var _jsxRuntime = require("react/jsx-runtime");
11
- /**
12
- * Pre-configured Zustand DevTools preset for FloatingDevTools
13
- *
14
- * ZERO-CONFIG: This preset is auto-discovered by FloatingDevTools!
15
- * Just install @buoy-gg/zustand and wrap your stores with buoyDevTools().
16
- *
17
- * @example Automatic (recommended)
18
- * ```tsx
19
- * import { create } from 'zustand';
20
- * import { buoyDevTools } from '@buoy-gg/zustand';
21
- *
22
- * const useCounterStore = create(
23
- * buoyDevTools(
24
- * (set) => ({ count: 0, increment: () => set((s) => ({ count: s.count + 1 })) }),
25
- * { name: 'counterStore' }
26
- * )
27
- * );
28
- *
29
- * // The Zustand tool appears automatically in FloatingDevTools!
30
- * <FloatingDevTools />
31
- * ```
32
- *
33
- * @example Manual (only for custom configuration)
34
- * ```tsx
35
- * import { createZustandTool } from '@buoy-gg/zustand';
36
- *
37
- * const customZustandTool = createZustandTool({
38
- * name: "STATE",
39
- * iconColor: "#463B3F",
40
- * });
41
- *
42
- * <FloatingDevTools apps={[customZustandTool]} />
43
- * ```
44
- */
45
-
46
- /**
47
- * Pre-configured Zustand DevTools preset for FloatingDevTools.
48
- * Includes:
49
- * - Live state change monitoring
50
- * - State inspection (JSON viewer)
51
- * - State diff visualization (tree + split)
52
- * - Filter by store name
53
- * - Changed keys tracking
54
- */
55
- const zustandToolPreset = exports.zustandToolPreset = {
56
- id: "zustand",
57
- name: "ZUSTAND",
58
- description: "Zustand store & state inspector",
59
- slot: "both",
60
- icon: ({
61
- size
62
- }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_ZustandIcon.ZustandIcon, {
63
- size: size
64
- }),
65
- component: _ZustandModal.ZustandModal,
66
- props: {
67
- enableSharedModalDimensions: false
68
- }
69
- };
70
-
71
- /**
72
- * Create a custom Zustand DevTools configuration.
73
- * Use this if you want to override default settings.
74
- *
75
- * @example
76
- * ```tsx
77
- * import { createZustandTool } from '@buoy-gg/zustand';
78
- *
79
- * const myZustandTool = createZustandTool({
80
- * name: "STATE",
81
- * iconColor: "#463B3F",
82
- * });
83
- * ```
84
- */
85
- function createZustandTool(options) {
86
- return {
87
- id: options?.id || "zustand",
88
- name: options?.name || "ZUSTAND",
89
- description: options?.description || "Zustand store & state inspector",
90
- slot: "both",
91
- icon: ({
92
- size
93
- }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_ZustandIcon.ZustandIcon, {
94
- size: size,
95
- color: options?.iconColor
96
- }),
97
- component: _ZustandModal.ZustandModal,
98
- props: {
99
- enableSharedModalDimensions: options?.enableSharedModalDimensions !== undefined ? options.enableSharedModalDimensions : false
100
- }
101
- };
102
- }
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.createZustandTool=createZustandTool,exports.zustandToolPreset=void 0;var _ZustandModal=require("./zustand/components/ZustandModal"),_ZustandIcon=require("./zustand/components/ZustandIcon"),_jsxRuntime=require("react/jsx-runtime");const zustandToolPreset=exports.zustandToolPreset={id:"zustand",name:"ZUSTAND",description:"Zustand store & state inspector",slot:"both",icon:({size:e})=>(0,_jsxRuntime.jsx)(_ZustandIcon.ZustandIcon,{size:e}),component:_ZustandModal.ZustandModal,props:{enableSharedModalDimensions:!1}};function createZustandTool(e){return{id:e?.id||"zustand",name:e?.name||"ZUSTAND",description:e?.description||"Zustand store & state inspector",slot:"both",icon:({size:n})=>(0,_jsxRuntime.jsx)(_ZustandIcon.ZustandIcon,{size:n,color:e?.iconColor}),component:_ZustandModal.ZustandModal,props:{enableSharedModalDimensions:void 0!==e?.enableSharedModalDimensions&&e.enableSharedModalDimensions}}}
@@ -1,116 +1 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.ZustandActionButton = ZustandActionButton;
7
- var _reactNative = require("react-native");
8
- var _sharedUi = require("@buoy-gg/shared-ui");
9
- var _jsxRuntime = require("react/jsx-runtime");
10
- /**
11
- * ZustandActionButton
12
- *
13
- * Generic action button for Zustand DevTools footer.
14
- * Mirrors ReduxActionButton.tsx
15
- */
16
-
17
- const buttonConfigs = {
18
- copy: {
19
- color: _sharedUi.buoyColors.primary,
20
- backgroundColor: _sharedUi.buoyColors.primary + "15",
21
- borderColor: _sharedUi.buoyColors.primary + "40",
22
- textColor: _sharedUi.buoyColors.primary
23
- },
24
- reset: {
25
- color: _sharedUi.buoyColors.warning,
26
- backgroundColor: _sharedUi.buoyColors.warning + "15",
27
- borderColor: _sharedUi.buoyColors.warning + "40",
28
- textColor: _sharedUi.buoyColors.warning
29
- },
30
- clear: {
31
- color: _sharedUi.buoyColors.error,
32
- backgroundColor: _sharedUi.buoyColors.error + "15",
33
- borderColor: _sharedUi.buoyColors.error + "40",
34
- textColor: _sharedUi.buoyColors.error
35
- },
36
- jump: {
37
- color: _sharedUi.buoyColors.warning,
38
- backgroundColor: _sharedUi.buoyColors.warning + "15",
39
- borderColor: _sharedUi.buoyColors.warning + "40",
40
- textColor: _sharedUi.buoyColors.warning
41
- }
42
- };
43
- function ZustandActionButton({
44
- onPress,
45
- text,
46
- type,
47
- disabled = false
48
- }) {
49
- const config = buttonConfigs[type];
50
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
51
- disabled: disabled,
52
- onPress: onPress,
53
- style: [styles.button, {
54
- backgroundColor: disabled ? _sharedUi.buoyColors.textMuted + "1A" : config.backgroundColor,
55
- borderColor: disabled ? _sharedUi.buoyColors.textMuted + "33" : config.borderColor,
56
- opacity: disabled ? 0.5 : 1
57
- }],
58
- activeOpacity: 0.7,
59
- accessibilityRole: "button",
60
- accessibilityLabel: text,
61
- accessibilityState: {
62
- disabled
63
- },
64
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
65
- style: [styles.dot, {
66
- backgroundColor: disabled ? _sharedUi.buoyColors.textMuted : config.color
67
- }]
68
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
69
- style: [styles.text, {
70
- color: disabled ? _sharedUi.buoyColors.textMuted : config.textColor
71
- }],
72
- children: text
73
- })]
74
- });
75
- }
76
- const styles = _reactNative.StyleSheet.create({
77
- button: {
78
- flexDirection: "row",
79
- alignItems: "center",
80
- justifyContent: "center",
81
- borderRadius: 6,
82
- borderWidth: 1,
83
- paddingHorizontal: 12,
84
- paddingVertical: 6,
85
- height: 25,
86
- minWidth: 80,
87
- shadowOffset: {
88
- width: 0,
89
- height: 1
90
- },
91
- shadowOpacity: 0.2,
92
- shadowRadius: 2,
93
- elevation: 2
94
- },
95
- dot: {
96
- width: 5,
97
- height: 5,
98
- borderRadius: 3,
99
- marginRight: 6,
100
- shadowColor: _sharedUi.buoyColors.text,
101
- shadowOffset: {
102
- width: 0,
103
- height: 0
104
- },
105
- shadowOpacity: 0.6,
106
- shadowRadius: 2
107
- },
108
- text: {
109
- fontSize: 10,
110
- fontWeight: "600",
111
- letterSpacing: 0.5,
112
- textTransform: "uppercase",
113
- fontFamily: "monospace",
114
- height: 12
115
- }
116
- });
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ZustandActionButton=ZustandActionButton;var _reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_jsxRuntime=require("react/jsx-runtime");const buttonConfigs={copy:{color:_sharedUi.buoyColors.primary,backgroundColor:_sharedUi.buoyColors.primary+"15",borderColor:_sharedUi.buoyColors.primary+"40",textColor:_sharedUi.buoyColors.primary},reset:{color:_sharedUi.buoyColors.warning,backgroundColor:_sharedUi.buoyColors.warning+"15",borderColor:_sharedUi.buoyColors.warning+"40",textColor:_sharedUi.buoyColors.warning},clear:{color:_sharedUi.buoyColors.error,backgroundColor:_sharedUi.buoyColors.error+"15",borderColor:_sharedUi.buoyColors.error+"40",textColor:_sharedUi.buoyColors.error},jump:{color:_sharedUi.buoyColors.warning,backgroundColor:_sharedUi.buoyColors.warning+"15",borderColor:_sharedUi.buoyColors.warning+"40",textColor:_sharedUi.buoyColors.warning}};function ZustandActionButton({onPress:o,text:r,type:e,disabled:t=!1}){const s=buttonConfigs[e];return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{disabled:t,onPress:o,style:[styles.button,{backgroundColor:t?_sharedUi.buoyColors.textMuted+"1A":s.backgroundColor,borderColor:t?_sharedUi.buoyColors.textMuted+"33":s.borderColor,opacity:t?.5:1}],activeOpacity:.7,accessibilityRole:"button",accessibilityLabel:r,accessibilityState:{disabled:t},children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.dot,{backgroundColor:t?_sharedUi.buoyColors.textMuted:s.color}]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.text,{color:t?_sharedUi.buoyColors.textMuted:s.textColor}],children:r})]})}const styles=_reactNative.StyleSheet.create({button:{flexDirection:"row",alignItems:"center",justifyContent:"center",borderRadius:6,borderWidth:1,paddingHorizontal:12,paddingVertical:6,height:25,minWidth:80,shadowOffset:{width:0,height:1},shadowOpacity:.2,shadowRadius:2,elevation:2},dot:{width:5,height:5,borderRadius:3,marginRight:6,shadowColor:_sharedUi.buoyColors.text,shadowOffset:{width:0,height:0},shadowOpacity:.6,shadowRadius:2},text:{fontSize:10,fontWeight:"600",letterSpacing:.5,textTransform:"uppercase",fontFamily:"monospace",height:12}});
@@ -1,134 +1 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.ZustandDetailViewToggle = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _reactNative = require("react-native");
9
- var _sharedUi = require("@buoy-gg/shared-ui");
10
- var _jsxRuntime = require("react/jsx-runtime");
11
- function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
12
- /**
13
- * ZustandDetailViewToggle
14
- *
15
- * Three-card toggle for switching between Change, State, and Diff views.
16
- * Mirrors ReduxDetailViewToggle.tsx
17
- */
18
-
19
- const VIEW_CONFIGS = [{
20
- key: "change",
21
- label: "CHANGE",
22
- description: "View change details",
23
- icon: _sharedUi.FileText,
24
- activeColor: _sharedUi.macOSColors.semantic.warning
25
- }, {
26
- key: "state",
27
- label: "STATE",
28
- description: "View current state",
29
- icon: _sharedUi.Database,
30
- activeColor: _sharedUi.macOSColors.semantic.info
31
- }, {
32
- key: "diff",
33
- label: "DIFF",
34
- description: "Compare changes",
35
- icon: _sharedUi.GitBranch,
36
- activeColor: _sharedUi.macOSColors.semantic.success
37
- }];
38
- const ZustandDetailViewToggle = exports.ZustandDetailViewToggle = /*#__PURE__*/(0, _react.memo)(function ZustandDetailViewToggle({
39
- activeView,
40
- onViewChange,
41
- diffDisabled = false
42
- }) {
43
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
44
- style: styles.container,
45
- children: VIEW_CONFIGS.map(config => {
46
- const isActive = activeView === config.key;
47
- const isDisabled = config.key === "diff" && diffDisabled;
48
- const IconComponent = config.icon;
49
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
50
- style: [styles.card, isActive && [styles.cardActive, {
51
- borderColor: config.activeColor
52
- }], isDisabled && styles.cardDisabled],
53
- onPress: () => !isDisabled && onViewChange(config.key),
54
- activeOpacity: isDisabled ? 1 : 0.8,
55
- disabled: isDisabled,
56
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
57
- style: styles.cardContent,
58
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
59
- size: 14,
60
- color: isActive ? config.activeColor : isDisabled ? _sharedUi.macOSColors.text.muted : _sharedUi.macOSColors.text.secondary
61
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
62
- style: [styles.cardLabel, isActive && [styles.cardLabelActive, {
63
- color: config.activeColor
64
- }], isDisabled && styles.cardLabelDisabled],
65
- children: config.label
66
- })]
67
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
68
- style: [styles.cardDescription, isActive && styles.cardDescriptionActive, isDisabled && styles.cardDescriptionDisabled],
69
- children: config.description
70
- })]
71
- }, config.key);
72
- })
73
- });
74
- });
75
- const styles = _reactNative.StyleSheet.create({
76
- container: {
77
- flexDirection: "row",
78
- gap: 8,
79
- padding: 14,
80
- backgroundColor: _sharedUi.macOSColors.background.base
81
- },
82
- card: {
83
- flex: 1,
84
- backgroundColor: _sharedUi.macOSColors.background.card,
85
- borderRadius: 12,
86
- borderWidth: 1,
87
- borderColor: _sharedUi.macOSColors.border.default,
88
- padding: 10,
89
- gap: 4
90
- },
91
- cardActive: {
92
- borderWidth: 1.5,
93
- backgroundColor: "rgba(0, 184, 230, 0.05)",
94
- shadowColor: _sharedUi.macOSColors.semantic.info,
95
- shadowOffset: {
96
- width: 0,
97
- height: 2
98
- },
99
- shadowOpacity: 0.1,
100
- shadowRadius: 8,
101
- elevation: 3
102
- },
103
- cardDisabled: {
104
- opacity: 0.5
105
- },
106
- cardContent: {
107
- flexDirection: "row",
108
- alignItems: "center",
109
- gap: 6
110
- },
111
- cardLabel: {
112
- fontSize: 10,
113
- fontWeight: "700",
114
- letterSpacing: 0.5,
115
- color: _sharedUi.macOSColors.text.secondary
116
- },
117
- cardLabelActive: {
118
- color: _sharedUi.macOSColors.text.primary
119
- },
120
- cardLabelDisabled: {
121
- color: _sharedUi.macOSColors.text.muted
122
- },
123
- cardDescription: {
124
- fontSize: 9,
125
- color: _sharedUi.macOSColors.text.muted,
126
- lineHeight: 12
127
- },
128
- cardDescriptionActive: {
129
- color: _sharedUi.macOSColors.text.secondary
130
- },
131
- cardDescriptionDisabled: {
132
- color: _sharedUi.macOSColors.text.muted
133
- }
134
- });
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ZustandDetailViewToggle=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,r){if("function"==typeof WeakMap)var t=new WeakMap,a=new WeakMap;return(_interopRequireWildcard=function(e,r){if(!r&&e&&e.__esModule)return e;var i,o,s={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return s;if(i=r?a:t){if(i.has(e))return i.get(e);i.set(e,s)}for(const r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((o=(i=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,r))&&(o.get||o.set)?i(s,r,o):s[r]=e[r]);return s})(e,r)}const VIEW_CONFIGS=[{key:"change",label:"CHANGE",description:"View change details",icon:_sharedUi.FileText,activeColor:_sharedUi.macOSColors.semantic.warning},{key:"state",label:"STATE",description:"View current state",icon:_sharedUi.Database,activeColor:_sharedUi.macOSColors.semantic.info},{key:"diff",label:"DIFF",description:"Compare changes",icon:_sharedUi.GitBranch,activeColor:_sharedUi.macOSColors.semantic.success}],ZustandDetailViewToggle=exports.ZustandDetailViewToggle=(0,_react.memo)(function({activeView:e,onViewChange:r,diffDisabled:t=!1}){return(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.container,children:VIEW_CONFIGS.map(a=>{const i=e===a.key,o="diff"===a.key&&t,s=a.icon;return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:[styles.card,i&&[styles.cardActive,{borderColor:a.activeColor}],o&&styles.cardDisabled],onPress:()=>!o&&r(a.key),activeOpacity:o?1:.8,disabled:o,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.cardContent,children:[(0,_jsxRuntime.jsx)(s,{size:14,color:i?a.activeColor:o?_sharedUi.macOSColors.text.muted:_sharedUi.macOSColors.text.secondary}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.cardLabel,i&&[styles.cardLabelActive,{color:a.activeColor}],o&&styles.cardLabelDisabled],children:a.label})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.cardDescription,i&&styles.cardDescriptionActive,o&&styles.cardDescriptionDisabled],children:a.description})]},a.key)})})}),styles=_reactNative.StyleSheet.create({container:{flexDirection:"row",gap:8,padding:14,backgroundColor:_sharedUi.macOSColors.background.base},card:{flex:1,backgroundColor:_sharedUi.macOSColors.background.card,borderRadius:12,borderWidth:1,borderColor:_sharedUi.macOSColors.border.default,padding:10,gap:4},cardActive:{borderWidth:1.5,backgroundColor:"rgba(0, 184, 230, 0.05)",shadowColor:_sharedUi.macOSColors.semantic.info,shadowOffset:{width:0,height:2},shadowOpacity:.1,shadowRadius:8,elevation:3},cardDisabled:{opacity:.5},cardContent:{flexDirection:"row",alignItems:"center",gap:6},cardLabel:{fontSize:10,fontWeight:"700",letterSpacing:.5,color:_sharedUi.macOSColors.text.secondary},cardLabelActive:{color:_sharedUi.macOSColors.text.primary},cardLabelDisabled:{color:_sharedUi.macOSColors.text.muted},cardDescription:{fontSize:9,color:_sharedUi.macOSColors.text.muted,lineHeight:12},cardDescriptionActive:{color:_sharedUi.macOSColors.text.secondary},cardDescriptionDisabled:{color:_sharedUi.macOSColors.text.muted}});