@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.
- package/LICENSE +58 -0
- package/lib/commonjs/index.js +1 -91
- package/lib/commonjs/preset.js +1 -102
- package/lib/commonjs/zustand/components/ZustandActionButton.js +1 -116
- package/lib/commonjs/zustand/components/ZustandDetailViewToggle.js +1 -134
- package/lib/commonjs/zustand/components/ZustandEventFilterView.js +1 -291
- package/lib/commonjs/zustand/components/ZustandIcon.js +1 -35
- package/lib/commonjs/zustand/components/ZustandModal.js +1 -603
- package/lib/commonjs/zustand/components/ZustandStateChangeItem.js +1 -165
- package/lib/commonjs/zustand/components/ZustandStateDetailContent.js +1 -352
- package/lib/commonjs/zustand/components/ZustandStateInfoView.js +1 -508
- package/lib/commonjs/zustand/components/ZustandStoreBrowser.js +1 -307
- package/lib/commonjs/zustand/components/index.js +1 -73
- package/lib/commonjs/zustand/hooks/index.js +1 -12
- package/lib/commonjs/zustand/hooks/useZustandStateChanges.js +1 -92
- package/lib/commonjs/zustand/index.js +1 -99
- package/lib/commonjs/zustand/utils/buoyZustandMiddleware.js +1 -220
- package/lib/commonjs/zustand/utils/index.js +1 -31
- package/lib/commonjs/zustand/utils/zustandStateStore.js +1 -361
- package/lib/module/index.js +1 -80
- package/lib/module/preset.js +1 -98
- package/lib/module/zustand/components/ZustandActionButton.js +1 -112
- package/lib/module/zustand/components/ZustandDetailViewToggle.js +1 -129
- package/lib/module/zustand/components/ZustandEventFilterView.js +1 -287
- package/lib/module/zustand/components/ZustandIcon.js +1 -32
- package/lib/module/zustand/components/ZustandModal.js +1 -599
- package/lib/module/zustand/components/ZustandStateChangeItem.js +1 -161
- package/lib/module/zustand/components/ZustandStateDetailContent.js +1 -348
- package/lib/module/zustand/components/ZustandStateInfoView.js +1 -503
- package/lib/module/zustand/components/ZustandStoreBrowser.js +1 -303
- package/lib/module/zustand/components/index.js +1 -10
- package/lib/module/zustand/hooks/index.js +1 -3
- package/lib/module/zustand/hooks/useZustandStateChanges.js +1 -88
- package/lib/module/zustand/index.js +1 -12
- package/lib/module/zustand/utils/buoyZustandMiddleware.js +1 -214
- package/lib/module/zustand/utils/index.js +1 -4
- package/lib/module/zustand/utils/zustandStateStore.js +1 -357
- package/package.json +10 -10
- package/lib/typescript/index.d.ts.map +0 -1
- package/lib/typescript/preset.d.ts.map +0 -1
- package/lib/typescript/zustand/components/ZustandActionButton.d.ts.map +0 -1
- package/lib/typescript/zustand/components/ZustandDetailViewToggle.d.ts.map +0 -1
- package/lib/typescript/zustand/components/ZustandEventFilterView.d.ts.map +0 -1
- package/lib/typescript/zustand/components/ZustandIcon.d.ts.map +0 -1
- package/lib/typescript/zustand/components/ZustandModal.d.ts.map +0 -1
- package/lib/typescript/zustand/components/ZustandStateChangeItem.d.ts.map +0 -1
- package/lib/typescript/zustand/components/ZustandStateDetailContent.d.ts.map +0 -1
- package/lib/typescript/zustand/components/ZustandStateInfoView.d.ts.map +0 -1
- package/lib/typescript/zustand/components/ZustandStoreBrowser.d.ts.map +0 -1
- package/lib/typescript/zustand/components/index.d.ts.map +0 -1
- package/lib/typescript/zustand/hooks/index.d.ts.map +0 -1
- package/lib/typescript/zustand/hooks/useZustandStateChanges.d.ts.map +0 -1
- package/lib/typescript/zustand/index.d.ts.map +0 -1
- package/lib/typescript/zustand/types/index.d.ts.map +0 -1
- package/lib/typescript/zustand/utils/buoyZustandMiddleware.d.ts.map +0 -1
- package/lib/typescript/zustand/utils/index.d.ts.map +0 -1
- 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.
|
package/lib/commonjs/index.js
CHANGED
|
@@ -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");
|
package/lib/commonjs/preset.js
CHANGED
|
@@ -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}});
|