@heymantle/litho 0.0.9 → 0.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/Banner.js +6 -1
- package/dist/cjs/components/Button.js +33 -4
- package/dist/cjs/components/ButtonGroup.js +19 -4
- package/dist/cjs/components/Card.js +39 -3
- package/dist/cjs/components/Checkbox.js +13 -2
- package/dist/cjs/components/ChoiceList.js +3 -2
- package/dist/cjs/components/Code.js +227 -0
- package/dist/cjs/components/Filters.js +1 -1
- package/dist/cjs/components/Frame.js +2 -2
- package/dist/cjs/components/Layout.js +16 -4
- package/dist/cjs/components/Link.js +35 -4
- package/dist/cjs/components/Modal.js +4 -0
- package/dist/cjs/components/Page.js +5 -2
- package/dist/cjs/components/Pane.js +669 -84
- package/dist/cjs/components/ResourceList.js +2 -2
- package/dist/cjs/components/TabNavigation.js +300 -0
- package/dist/cjs/components/TextField.js +3 -0
- package/dist/cjs/components/Tip.js +3 -0
- package/dist/cjs/components/Tooltip.js +12 -13
- package/dist/cjs/index.js +4 -0
- package/dist/cjs/stories/Checkbox.stories.js +172 -1
- package/dist/cjs/stories/Pane.stories.js +352 -3
- package/dist/cjs/utilities/useBodyScrollLock.js +63 -0
- package/dist/cjs/utilities/useKeyboardAction.js +19 -0
- package/dist/cjs/utilities/useLocalStorage.js +126 -0
- package/dist/cjs/utilities/useMobile.js +92 -0
- package/dist/cjs/utilities/usePaneState.js +340 -0
- package/dist/cjs/utilities/useTabStorage.js +325 -0
- package/dist/esm/components/Banner.js +7 -2
- package/dist/esm/components/Button.js +33 -4
- package/dist/esm/components/ButtonGroup.js +19 -4
- package/dist/esm/components/Card.js +39 -3
- package/dist/esm/components/Checkbox.js +13 -2
- package/dist/esm/components/ChoiceList.js +3 -2
- package/dist/esm/components/Code.js +212 -0
- package/dist/esm/components/Filters.js +2 -2
- package/dist/esm/components/Frame.js +2 -2
- package/dist/esm/components/Layout.js +16 -4
- package/dist/esm/components/Link.js +31 -5
- package/dist/esm/components/Modal.js +4 -0
- package/dist/esm/components/Page.js +5 -2
- package/dist/esm/components/Pane.js +619 -83
- package/dist/esm/components/ResourceList.js +2 -2
- package/dist/esm/components/TabNavigation.js +285 -0
- package/dist/esm/components/TextField.js +4 -1
- package/dist/esm/components/Tip.js +4 -1
- package/dist/esm/components/Tooltip.js +12 -13
- package/dist/esm/index.js +1 -0
- package/dist/esm/stories/Checkbox.stories.js +166 -1
- package/dist/esm/stories/Pane.stories.js +346 -3
- package/dist/esm/utilities/useBodyScrollLock.js +53 -0
- package/dist/esm/utilities/useKeyboardAction.js +25 -0
- package/dist/esm/utilities/useLocalStorage.js +115 -0
- package/dist/esm/utilities/useMobile.js +79 -0
- package/dist/esm/utilities/usePaneState.js +334 -0
- package/dist/esm/utilities/useTabStorage.js +311 -0
- package/dist/types/components/Banner.d.ts.map +1 -1
- package/dist/types/components/Button.d.ts +2 -2
- package/dist/types/components/Button.d.ts.map +1 -1
- package/dist/types/components/ButtonGroup.d.ts.map +1 -1
- package/dist/types/components/Card.d.ts +34 -1
- package/dist/types/components/Card.d.ts.map +1 -1
- package/dist/types/components/Checkbox.d.ts +11 -2
- package/dist/types/components/Checkbox.d.ts.map +1 -1
- package/dist/types/components/Code.d.ts +28 -0
- package/dist/types/components/Code.d.ts.map +1 -0
- package/dist/types/components/Filters.d.ts.map +1 -1
- package/dist/types/components/Layout.d.ts +2 -0
- package/dist/types/components/Layout.d.ts.map +1 -1
- package/dist/types/components/Link.d.ts +4 -0
- package/dist/types/components/Link.d.ts.map +1 -1
- package/dist/types/components/Modal.d.ts +2 -0
- package/dist/types/components/Modal.d.ts.map +1 -1
- package/dist/types/components/Page.d.ts.map +1 -1
- package/dist/types/components/Pane.d.ts +2 -0
- package/dist/types/components/Pane.d.ts.map +1 -1
- package/dist/types/components/TabNavigation.d.ts +3 -0
- package/dist/types/components/TabNavigation.d.ts.map +1 -0
- package/dist/types/components/TextField.d.ts.map +1 -1
- package/dist/types/components/Tip.d.ts.map +1 -1
- package/dist/types/components/Tooltip.d.ts +2 -0
- package/dist/types/components/Tooltip.d.ts.map +1 -1
- package/dist/types/index.d.ts +1 -0
- package/dist/types/utilities/useBodyScrollLock.d.ts +12 -0
- package/dist/types/utilities/useBodyScrollLock.d.ts.map +1 -0
- package/dist/types/utilities/useKeyboardAction.d.ts +2 -0
- package/dist/types/utilities/useKeyboardAction.d.ts.map +1 -0
- package/dist/types/utilities/useLocalStorage.d.ts +13 -0
- package/dist/types/utilities/useLocalStorage.d.ts.map +1 -0
- package/dist/types/utilities/useMobile.d.ts +9 -0
- package/dist/types/utilities/useMobile.d.ts.map +1 -0
- package/dist/types/utilities/usePaneState.d.ts +2 -0
- package/dist/types/utilities/usePaneState.d.ts.map +1 -0
- package/dist/types/utilities/useTabStorage.d.ts +8 -0
- package/dist/types/utilities/useTabStorage.d.ts.map +1 -0
- package/index.css +77 -6
- package/package.json +1 -1
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
function _export(target, all) {
|
|
7
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
8
|
+
enumerable: true,
|
|
9
|
+
get: Object.getOwnPropertyDescriptor(all, name).get
|
|
10
|
+
});
|
|
11
|
+
}
|
|
12
|
+
_export(exports, {
|
|
13
|
+
get default () {
|
|
14
|
+
return _default;
|
|
15
|
+
},
|
|
16
|
+
get useLocalStorage () {
|
|
17
|
+
return useLocalStorage;
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
var _react = require("react");
|
|
21
|
+
function _array_like_to_array(arr, len) {
|
|
22
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
23
|
+
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
24
|
+
return arr2;
|
|
25
|
+
}
|
|
26
|
+
function _array_with_holes(arr) {
|
|
27
|
+
if (Array.isArray(arr)) return arr;
|
|
28
|
+
}
|
|
29
|
+
function _instanceof(left, right) {
|
|
30
|
+
if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
|
|
31
|
+
return !!right[Symbol.hasInstance](left);
|
|
32
|
+
} else {
|
|
33
|
+
return left instanceof right;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
function _iterable_to_array_limit(arr, i) {
|
|
37
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
38
|
+
if (_i == null) return;
|
|
39
|
+
var _arr = [];
|
|
40
|
+
var _n = true;
|
|
41
|
+
var _d = false;
|
|
42
|
+
var _s, _e;
|
|
43
|
+
try {
|
|
44
|
+
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
45
|
+
_arr.push(_s.value);
|
|
46
|
+
if (i && _arr.length === i) break;
|
|
47
|
+
}
|
|
48
|
+
} catch (err) {
|
|
49
|
+
_d = true;
|
|
50
|
+
_e = err;
|
|
51
|
+
} finally{
|
|
52
|
+
try {
|
|
53
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
54
|
+
} finally{
|
|
55
|
+
if (_d) throw _e;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
return _arr;
|
|
59
|
+
}
|
|
60
|
+
function _non_iterable_rest() {
|
|
61
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
62
|
+
}
|
|
63
|
+
function _sliced_to_array(arr, i) {
|
|
64
|
+
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
|
|
65
|
+
}
|
|
66
|
+
function _unsupported_iterable_to_array(o, minLen) {
|
|
67
|
+
if (!o) return;
|
|
68
|
+
if (typeof o === "string") return _array_like_to_array(o, minLen);
|
|
69
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
70
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
71
|
+
if (n === "Map" || n === "Set") return Array.from(n);
|
|
72
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
|
|
73
|
+
}
|
|
74
|
+
function useLocalStorage(key, initialValue) {
|
|
75
|
+
var options = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
|
|
76
|
+
var _options_serialize = options.serialize, serialize = _options_serialize === void 0 ? true : _options_serialize;
|
|
77
|
+
// State to store our value
|
|
78
|
+
var _useState = _sliced_to_array((0, _react.useState)(function() {
|
|
79
|
+
if (typeof window === 'undefined') {
|
|
80
|
+
return initialValue;
|
|
81
|
+
}
|
|
82
|
+
try {
|
|
83
|
+
var item = window.localStorage.getItem(key);
|
|
84
|
+
if (item === null) {
|
|
85
|
+
return initialValue;
|
|
86
|
+
}
|
|
87
|
+
if (serialize) {
|
|
88
|
+
return JSON.parse(item);
|
|
89
|
+
}
|
|
90
|
+
return item;
|
|
91
|
+
} catch (error) {
|
|
92
|
+
console.warn('Error reading localStorage key "'.concat(key, '":'), error);
|
|
93
|
+
return initialValue;
|
|
94
|
+
}
|
|
95
|
+
}), 2), storedValue = _useState[0], setStoredValue = _useState[1];
|
|
96
|
+
// Return a wrapped version of useState's setter function that
|
|
97
|
+
// persists the new value to localStorage.
|
|
98
|
+
var setValue = (0, _react.useCallback)(function(value) {
|
|
99
|
+
try {
|
|
100
|
+
// Use functional update to get current value without needing it in dependencies
|
|
101
|
+
setStoredValue(function(currentValue) {
|
|
102
|
+
// Allow value to be a function so we have the same API as useState
|
|
103
|
+
var valueToStore = _instanceof(value, Function) ? value(currentValue) : value;
|
|
104
|
+
// Save to local storage
|
|
105
|
+
if (typeof window !== 'undefined') {
|
|
106
|
+
if (serialize) {
|
|
107
|
+
window.localStorage.setItem(key, JSON.stringify(valueToStore));
|
|
108
|
+
} else {
|
|
109
|
+
window.localStorage.setItem(key, valueToStore);
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
return valueToStore;
|
|
113
|
+
});
|
|
114
|
+
} catch (error) {
|
|
115
|
+
console.warn('Error setting localStorage key "'.concat(key, '":'), error);
|
|
116
|
+
}
|
|
117
|
+
}, [
|
|
118
|
+
key,
|
|
119
|
+
serialize
|
|
120
|
+
]);
|
|
121
|
+
return [
|
|
122
|
+
storedValue,
|
|
123
|
+
setValue
|
|
124
|
+
];
|
|
125
|
+
}
|
|
126
|
+
var _default = useLocalStorage;
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
function _export(target, all) {
|
|
7
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
8
|
+
enumerable: true,
|
|
9
|
+
get: Object.getOwnPropertyDescriptor(all, name).get
|
|
10
|
+
});
|
|
11
|
+
}
|
|
12
|
+
_export(exports, {
|
|
13
|
+
get default () {
|
|
14
|
+
return _default;
|
|
15
|
+
},
|
|
16
|
+
get useMobile () {
|
|
17
|
+
return useMobile;
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
var _react = require("react");
|
|
21
|
+
var _usedebounce = require("use-debounce");
|
|
22
|
+
function _array_like_to_array(arr, len) {
|
|
23
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
24
|
+
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
25
|
+
return arr2;
|
|
26
|
+
}
|
|
27
|
+
function _array_with_holes(arr) {
|
|
28
|
+
if (Array.isArray(arr)) return arr;
|
|
29
|
+
}
|
|
30
|
+
function _iterable_to_array_limit(arr, i) {
|
|
31
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
32
|
+
if (_i == null) return;
|
|
33
|
+
var _arr = [];
|
|
34
|
+
var _n = true;
|
|
35
|
+
var _d = false;
|
|
36
|
+
var _s, _e;
|
|
37
|
+
try {
|
|
38
|
+
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
39
|
+
_arr.push(_s.value);
|
|
40
|
+
if (i && _arr.length === i) break;
|
|
41
|
+
}
|
|
42
|
+
} catch (err) {
|
|
43
|
+
_d = true;
|
|
44
|
+
_e = err;
|
|
45
|
+
} finally{
|
|
46
|
+
try {
|
|
47
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
48
|
+
} finally{
|
|
49
|
+
if (_d) throw _e;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
return _arr;
|
|
53
|
+
}
|
|
54
|
+
function _non_iterable_rest() {
|
|
55
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
56
|
+
}
|
|
57
|
+
function _sliced_to_array(arr, i) {
|
|
58
|
+
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
|
|
59
|
+
}
|
|
60
|
+
function _unsupported_iterable_to_array(o, minLen) {
|
|
61
|
+
if (!o) return;
|
|
62
|
+
if (typeof o === "string") return _array_like_to_array(o, minLen);
|
|
63
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
64
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
65
|
+
if (n === "Map" || n === "Set") return Array.from(n);
|
|
66
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
|
|
67
|
+
}
|
|
68
|
+
function useMobile() {
|
|
69
|
+
var breakpoint = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 768, debounceMs = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 150;
|
|
70
|
+
var _useState = _sliced_to_array((0, _react.useState)(function() {
|
|
71
|
+
if (typeof window === 'undefined') return false;
|
|
72
|
+
return window.innerWidth < breakpoint;
|
|
73
|
+
}), 2), isMobile = _useState[0], setIsMobile = _useState[1];
|
|
74
|
+
// Debounced resize handler
|
|
75
|
+
var handleResize = (0, _usedebounce.useDebouncedCallback)(function() {
|
|
76
|
+
if (typeof window === 'undefined') return;
|
|
77
|
+
var mobile = window.innerWidth < breakpoint;
|
|
78
|
+
setIsMobile(mobile);
|
|
79
|
+
}, debounceMs);
|
|
80
|
+
(0, _react.useEffect)(function() {
|
|
81
|
+
if (typeof window === 'undefined') return;
|
|
82
|
+
window.addEventListener('resize', handleResize);
|
|
83
|
+
return function() {
|
|
84
|
+
window.removeEventListener('resize', handleResize);
|
|
85
|
+
handleResize.cancel();
|
|
86
|
+
};
|
|
87
|
+
}, [
|
|
88
|
+
handleResize
|
|
89
|
+
]);
|
|
90
|
+
return isMobile;
|
|
91
|
+
}
|
|
92
|
+
var _default = useMobile;
|
|
@@ -0,0 +1,340 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "usePaneState", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function() {
|
|
9
|
+
return usePaneState;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _react = require("react");
|
|
13
|
+
var _useLocalStorage = require("./useLocalStorage");
|
|
14
|
+
function _array_like_to_array(arr, len) {
|
|
15
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
16
|
+
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
17
|
+
return arr2;
|
|
18
|
+
}
|
|
19
|
+
function _array_with_holes(arr) {
|
|
20
|
+
if (Array.isArray(arr)) return arr;
|
|
21
|
+
}
|
|
22
|
+
function _define_property(obj, key, value) {
|
|
23
|
+
if (key in obj) {
|
|
24
|
+
Object.defineProperty(obj, key, {
|
|
25
|
+
value: value,
|
|
26
|
+
enumerable: true,
|
|
27
|
+
configurable: true,
|
|
28
|
+
writable: true
|
|
29
|
+
});
|
|
30
|
+
} else {
|
|
31
|
+
obj[key] = value;
|
|
32
|
+
}
|
|
33
|
+
return obj;
|
|
34
|
+
}
|
|
35
|
+
function _iterable_to_array_limit(arr, i) {
|
|
36
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
37
|
+
if (_i == null) return;
|
|
38
|
+
var _arr = [];
|
|
39
|
+
var _n = true;
|
|
40
|
+
var _d = false;
|
|
41
|
+
var _s, _e;
|
|
42
|
+
try {
|
|
43
|
+
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
44
|
+
_arr.push(_s.value);
|
|
45
|
+
if (i && _arr.length === i) break;
|
|
46
|
+
}
|
|
47
|
+
} catch (err) {
|
|
48
|
+
_d = true;
|
|
49
|
+
_e = err;
|
|
50
|
+
} finally{
|
|
51
|
+
try {
|
|
52
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
53
|
+
} finally{
|
|
54
|
+
if (_d) throw _e;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
return _arr;
|
|
58
|
+
}
|
|
59
|
+
function _non_iterable_rest() {
|
|
60
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
61
|
+
}
|
|
62
|
+
function _object_spread(target) {
|
|
63
|
+
for(var i = 1; i < arguments.length; i++){
|
|
64
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
65
|
+
var ownKeys = Object.keys(source);
|
|
66
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
67
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
68
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
69
|
+
}));
|
|
70
|
+
}
|
|
71
|
+
ownKeys.forEach(function(key) {
|
|
72
|
+
_define_property(target, key, source[key]);
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
return target;
|
|
76
|
+
}
|
|
77
|
+
function ownKeys(object, enumerableOnly) {
|
|
78
|
+
var keys = Object.keys(object);
|
|
79
|
+
if (Object.getOwnPropertySymbols) {
|
|
80
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
81
|
+
if (enumerableOnly) {
|
|
82
|
+
symbols = symbols.filter(function(sym) {
|
|
83
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
84
|
+
});
|
|
85
|
+
}
|
|
86
|
+
keys.push.apply(keys, symbols);
|
|
87
|
+
}
|
|
88
|
+
return keys;
|
|
89
|
+
}
|
|
90
|
+
function _object_spread_props(target, source) {
|
|
91
|
+
source = source != null ? source : {};
|
|
92
|
+
if (Object.getOwnPropertyDescriptors) {
|
|
93
|
+
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
94
|
+
} else {
|
|
95
|
+
ownKeys(Object(source)).forEach(function(key) {
|
|
96
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
return target;
|
|
100
|
+
}
|
|
101
|
+
function _sliced_to_array(arr, i) {
|
|
102
|
+
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
|
|
103
|
+
}
|
|
104
|
+
function _type_of(obj) {
|
|
105
|
+
"@swc/helpers - typeof";
|
|
106
|
+
return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
|
|
107
|
+
}
|
|
108
|
+
function _unsupported_iterable_to_array(o, minLen) {
|
|
109
|
+
if (!o) return;
|
|
110
|
+
if (typeof o === "string") return _array_like_to_array(o, minLen);
|
|
111
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
112
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
113
|
+
if (n === "Map" || n === "Set") return Array.from(n);
|
|
114
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
|
|
115
|
+
}
|
|
116
|
+
var PANE_STATE_STORAGE_KEY = 'litho-pane-state';
|
|
117
|
+
var DEFAULT_ORG_STATE = {
|
|
118
|
+
activeTabId: null,
|
|
119
|
+
width: 400,
|
|
120
|
+
collapsed: false,
|
|
121
|
+
open: false,
|
|
122
|
+
tabs: []
|
|
123
|
+
};
|
|
124
|
+
// Module-level refs to track recent values across all hook instances
|
|
125
|
+
// This ensures we can track values even when multiple components use the hook
|
|
126
|
+
// Used to handle race conditions where updates are called in the same render cycle
|
|
127
|
+
var recentValuesRef = {}; // { [orgId]: { [key]: value } }
|
|
128
|
+
// Stable empty object reference to prevent unnecessary recalculations
|
|
129
|
+
var EMPTY_OBJECT = {};
|
|
130
|
+
// Helper to merge state with defaults (for reading)
|
|
131
|
+
// Preserves original array references when possible to prevent unnecessary re-renders
|
|
132
|
+
var mergeWithDefaults = function(state) {
|
|
133
|
+
if (!state || (typeof state === "undefined" ? "undefined" : _type_of(state)) !== 'object') {
|
|
134
|
+
return _object_spread({}, DEFAULT_ORG_STATE);
|
|
135
|
+
}
|
|
136
|
+
return _object_spread_props(_object_spread({}, DEFAULT_ORG_STATE, state), {
|
|
137
|
+
// Preserve original tabs array reference if it exists and is valid, otherwise use default
|
|
138
|
+
tabs: Array.isArray(state.tabs) ? state.tabs : DEFAULT_ORG_STATE.tabs
|
|
139
|
+
});
|
|
140
|
+
};
|
|
141
|
+
var usePaneState = function(orgId) {
|
|
142
|
+
var currentOrgIdRef = (0, _react.useRef)(orgId);
|
|
143
|
+
// Ref to track current React state so we can access it in setState callbacks
|
|
144
|
+
var currentStateRef = (0, _react.useRef)(null);
|
|
145
|
+
// Update ref when orgId changes
|
|
146
|
+
(0, _react.useEffect)(function() {
|
|
147
|
+
currentOrgIdRef.current = orgId;
|
|
148
|
+
}, [
|
|
149
|
+
orgId
|
|
150
|
+
]);
|
|
151
|
+
// Only initialize localStorage if there's existing data, otherwise use null
|
|
152
|
+
// This prevents saving empty objects on page load
|
|
153
|
+
var _useLocalStorage1 = _sliced_to_array((0, _useLocalStorage.useLocalStorage)(PANE_STATE_STORAGE_KEY, null, {
|
|
154
|
+
serialize: true
|
|
155
|
+
}), 2), allOrgsState = _useLocalStorage1[0], setAllOrgsState = _useLocalStorage1[1];
|
|
156
|
+
// Normalize null to empty object for internal use (memoize to prevent unnecessary recalculations)
|
|
157
|
+
// Use stable EMPTY_OBJECT reference when allOrgsState is null
|
|
158
|
+
var normalizedState = (0, _react.useMemo)(function() {
|
|
159
|
+
return allOrgsState || EMPTY_OBJECT;
|
|
160
|
+
}, [
|
|
161
|
+
allOrgsState
|
|
162
|
+
]);
|
|
163
|
+
// Keep ref in sync with current React state
|
|
164
|
+
(0, _react.useEffect)(function() {
|
|
165
|
+
currentStateRef.current = normalizedState;
|
|
166
|
+
}, [
|
|
167
|
+
normalizedState
|
|
168
|
+
]);
|
|
169
|
+
// Get current org's state (merge with defaults for reading)
|
|
170
|
+
var orgState = (0, _react.useMemo)(function() {
|
|
171
|
+
if (!orgId) {
|
|
172
|
+
return _object_spread({}, DEFAULT_ORG_STATE);
|
|
173
|
+
}
|
|
174
|
+
var state = normalizedState === null || normalizedState === void 0 ? void 0 : normalizedState[orgId];
|
|
175
|
+
return mergeWithDefaults(state);
|
|
176
|
+
}, [
|
|
177
|
+
normalizedState,
|
|
178
|
+
orgId
|
|
179
|
+
]);
|
|
180
|
+
// Function to manually refresh state from localStorage
|
|
181
|
+
// Called on page load (via useState initializer) and when pane opens
|
|
182
|
+
var refreshFromStorage = (0, _react.useCallback)(function() {
|
|
183
|
+
if (typeof window === 'undefined') return;
|
|
184
|
+
try {
|
|
185
|
+
var item = window.localStorage.getItem(PANE_STATE_STORAGE_KEY);
|
|
186
|
+
if (item !== null) {
|
|
187
|
+
var parsed = JSON.parse(item);
|
|
188
|
+
setAllOrgsState(parsed);
|
|
189
|
+
}
|
|
190
|
+
} catch (error) {
|
|
191
|
+
console.warn('Error refreshing pane state from localStorage:', error);
|
|
192
|
+
}
|
|
193
|
+
}, [
|
|
194
|
+
setAllOrgsState
|
|
195
|
+
]);
|
|
196
|
+
// Helper to ensure recentValuesRef exists for an orgId
|
|
197
|
+
var ensureRecentValuesRef = (0, _react.useCallback)(function(orgId) {
|
|
198
|
+
if (!recentValuesRef[orgId]) {
|
|
199
|
+
recentValuesRef[orgId] = {};
|
|
200
|
+
}
|
|
201
|
+
}, []);
|
|
202
|
+
// Helper to create first-time state
|
|
203
|
+
var createFirstTimeState = (0, _react.useCallback)(function(currentState, orgId, key, newValue) {
|
|
204
|
+
// Don't create state when setting 'open' to false on first time (pane was never opened)
|
|
205
|
+
if (key === 'open' && newValue === false) {
|
|
206
|
+
return currentState;
|
|
207
|
+
}
|
|
208
|
+
// Save the full default state on first open
|
|
209
|
+
return _object_spread_props(_object_spread({}, currentState), _define_property({}, orgId, _object_spread_props(_object_spread({}, DEFAULT_ORG_STATE), _define_property({}, key, newValue))));
|
|
210
|
+
}, []);
|
|
211
|
+
// Helper to apply recent values from snapshot to new state
|
|
212
|
+
var applyRecentValues = (0, _react.useCallback)(function(newOrgState, snapshot, key) {
|
|
213
|
+
Object.keys(snapshot).forEach(function(recentKey) {
|
|
214
|
+
if (recentKey !== key) {
|
|
215
|
+
newOrgState[recentKey] = snapshot[recentKey];
|
|
216
|
+
}
|
|
217
|
+
});
|
|
218
|
+
}, []);
|
|
219
|
+
// Helper to cleanup snapshot values after update cycle
|
|
220
|
+
var cleanupSnapshotValues = (0, _react.useCallback)(function(orgId, snapshot, snapshotKeys) {
|
|
221
|
+
if (typeof window === 'undefined' || snapshotKeys.length === 0) return;
|
|
222
|
+
requestAnimationFrame(function() {
|
|
223
|
+
var currentRecentValues = recentValuesRef[orgId];
|
|
224
|
+
if (!currentRecentValues) return;
|
|
225
|
+
// Clear only the keys that were in our snapshot and haven't changed
|
|
226
|
+
snapshotKeys.forEach(function(snapshotKey) {
|
|
227
|
+
if (currentRecentValues[snapshotKey] === snapshot[snapshotKey]) {
|
|
228
|
+
delete currentRecentValues[snapshotKey];
|
|
229
|
+
}
|
|
230
|
+
});
|
|
231
|
+
});
|
|
232
|
+
}, []);
|
|
233
|
+
// Generic helper function to update state for a given key
|
|
234
|
+
// Uses currentOrgIdRef internally to always get the latest orgId value
|
|
235
|
+
// Falls back to orgId prop if ref hasn't been updated yet
|
|
236
|
+
var updateStateForKey = (0, _react.useCallback)(function(key, value, setState) {
|
|
237
|
+
var currentOrgId = currentOrgIdRef.current || orgId;
|
|
238
|
+
if (!currentOrgId) {
|
|
239
|
+
console.warn("Cannot set ".concat(key, ": orgId is required"));
|
|
240
|
+
return;
|
|
241
|
+
}
|
|
242
|
+
ensureRecentValuesRef(currentOrgId);
|
|
243
|
+
// Capture a snapshot of recent values BEFORE entering setState callback
|
|
244
|
+
// This ensures we have the latest values even if React batches updates
|
|
245
|
+
var recentValuesSnapshot = _object_spread({}, recentValuesRef[currentOrgId]);
|
|
246
|
+
var snapshotKeys = Object.keys(recentValuesSnapshot);
|
|
247
|
+
setState(function(prev) {
|
|
248
|
+
var currentState = prev || {};
|
|
249
|
+
var currentOrgState = currentState[currentOrgId] || {};
|
|
250
|
+
var prevValue = currentOrgState[key];
|
|
251
|
+
var newValue = typeof value === 'function' ? value(prevValue) : value;
|
|
252
|
+
// Track the most recent value for this key (to handle race conditions)
|
|
253
|
+
recentValuesRef[currentOrgId][key] = newValue;
|
|
254
|
+
// Handle first-time state creation
|
|
255
|
+
var isFirstTime = !currentState[currentOrgId];
|
|
256
|
+
if (isFirstTime) {
|
|
257
|
+
return createFirstTimeState(currentState, currentOrgId, key, newValue);
|
|
258
|
+
}
|
|
259
|
+
// After first open, preserve existing state and update the specific key
|
|
260
|
+
var newOrgState = _object_spread_props(_object_spread({}, currentOrgState), _define_property({}, key, newValue));
|
|
261
|
+
// Apply recent values from snapshot (except the key being updated)
|
|
262
|
+
if (snapshotKeys.length > 0) {
|
|
263
|
+
applyRecentValues(newOrgState, recentValuesSnapshot, key);
|
|
264
|
+
}
|
|
265
|
+
return _object_spread_props(_object_spread({}, currentState), _define_property({}, currentOrgId, newOrgState));
|
|
266
|
+
});
|
|
267
|
+
// Cleanup snapshot values after update cycle completes
|
|
268
|
+
cleanupSnapshotValues(currentOrgId, recentValuesSnapshot, snapshotKeys);
|
|
269
|
+
}, [
|
|
270
|
+
orgId,
|
|
271
|
+
ensureRecentValuesRef,
|
|
272
|
+
createFirstTimeState,
|
|
273
|
+
applyRecentValues,
|
|
274
|
+
cleanupSnapshotValues
|
|
275
|
+
]);
|
|
276
|
+
// Helper setters for individual properties - memoized with useCallback
|
|
277
|
+
var setWidth = (0, _react.useCallback)(function(value) {
|
|
278
|
+
updateStateForKey('width', value, setAllOrgsState);
|
|
279
|
+
}, [
|
|
280
|
+
updateStateForKey,
|
|
281
|
+
setAllOrgsState
|
|
282
|
+
]);
|
|
283
|
+
var setCollapsed = (0, _react.useCallback)(function(value) {
|
|
284
|
+
updateStateForKey('collapsed', value, setAllOrgsState);
|
|
285
|
+
}, [
|
|
286
|
+
updateStateForKey,
|
|
287
|
+
setAllOrgsState
|
|
288
|
+
]);
|
|
289
|
+
var setOpen = (0, _react.useCallback)(function(value) {
|
|
290
|
+
updateStateForKey('open', value, setAllOrgsState);
|
|
291
|
+
}, [
|
|
292
|
+
updateStateForKey,
|
|
293
|
+
setAllOrgsState
|
|
294
|
+
]);
|
|
295
|
+
var setTabs = (0, _react.useCallback)(function(value) {
|
|
296
|
+
updateStateForKey('tabs', value, setAllOrgsState);
|
|
297
|
+
}, [
|
|
298
|
+
updateStateForKey,
|
|
299
|
+
setAllOrgsState
|
|
300
|
+
]);
|
|
301
|
+
var setActiveTabId = (0, _react.useCallback)(function(value) {
|
|
302
|
+
updateStateForKey('activeTabId', value, setAllOrgsState);
|
|
303
|
+
}, [
|
|
304
|
+
updateStateForKey,
|
|
305
|
+
setAllOrgsState
|
|
306
|
+
]);
|
|
307
|
+
// Generic setState function for updating entire org state
|
|
308
|
+
var setState = (0, _react.useCallback)(function(newState) {
|
|
309
|
+
if (!orgId) {
|
|
310
|
+
console.warn('Cannot set state: orgId is required');
|
|
311
|
+
return;
|
|
312
|
+
}
|
|
313
|
+
setAllOrgsState(function(prev) {
|
|
314
|
+
var currentState = prev || {};
|
|
315
|
+
var currentOrgState = currentState[orgId] || {};
|
|
316
|
+
var isFirstTime = !currentState[orgId];
|
|
317
|
+
var mergedState = mergeWithDefaults(currentOrgState);
|
|
318
|
+
var updatedState = typeof newState === 'function' ? newState(mergedState) : _object_spread({}, mergedState, newState);
|
|
319
|
+
// On first open, save all default values to initialize the state
|
|
320
|
+
if (isFirstTime) {
|
|
321
|
+
return _object_spread_props(_object_spread({}, currentState), _define_property({}, orgId, _object_spread({}, DEFAULT_ORG_STATE, updatedState)));
|
|
322
|
+
}
|
|
323
|
+
// After first open, just save the updated state
|
|
324
|
+
return _object_spread_props(_object_spread({}, currentState), _define_property({}, orgId, updatedState));
|
|
325
|
+
});
|
|
326
|
+
}, [
|
|
327
|
+
orgId,
|
|
328
|
+
setAllOrgsState
|
|
329
|
+
]);
|
|
330
|
+
return {
|
|
331
|
+
state: orgState,
|
|
332
|
+
setState: setState,
|
|
333
|
+
setWidth: setWidth,
|
|
334
|
+
setCollapsed: setCollapsed,
|
|
335
|
+
setOpen: setOpen,
|
|
336
|
+
setTabs: setTabs,
|
|
337
|
+
setActiveTabId: setActiveTabId,
|
|
338
|
+
refreshFromStorage: refreshFromStorage
|
|
339
|
+
};
|
|
340
|
+
};
|