elbe-ui 0.4.5 → 0.4.8
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/bit/_bit_provider.d.ts +6 -0
- package/dist/bit/_bit_provider.js +110 -0
- package/dist/bit/_bit_utils.d.ts +102 -0
- package/dist/bit/_bit_utils.js +3 -0
- package/dist/bit/bit.d.ts +18 -35
- package/dist/bit/bit.js +24 -73
- package/dist/bit/old/old_bit.d.ts +37 -0
- package/dist/bit/old/old_bit.js +79 -0
- package/dist/bit/{ctrl_bit.d.ts → old/old_ctrl_bit.d.ts} +8 -8
- package/dist/bit/{ctrl_bit.js → old/old_ctrl_bit.js} +7 -7
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/ui/components/layout/app_base.js +6 -8
- package/dist/ui/util/l10n/l10n.js +1 -1
- package/dist/ui/util/util.d.ts +1 -0
- package/package.json +1 -1
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { Context } from "preact";
|
|
2
|
+
import { BitParams, BitUseInterface } from "..";
|
|
3
|
+
import { _BitCtrlMaker, _BitProvider } from "./_bit_utils";
|
|
4
|
+
export declare function _makeBitProvider<D, P, I>(context: Context<BitUseInterface<D, I>>, bitP: BitParams<D, P, I> & {
|
|
5
|
+
control: _BitCtrlMaker<D, P, I>;
|
|
6
|
+
}): _BitProvider<P>;
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
11
|
+
import { useEffect, useMemo, useState } from "preact/hooks";
|
|
12
|
+
import { Column, ErrorView, Spinner, } from "..";
|
|
13
|
+
import { _isFn } from "./_bit_utils";
|
|
14
|
+
function _LoadView({}) {
|
|
15
|
+
return (_jsx(Column, { cross: "center", children: _jsx(Spinner, {}) }));
|
|
16
|
+
}
|
|
17
|
+
export function _makeBitProvider(context, bitP) {
|
|
18
|
+
function _BitProvider(p) {
|
|
19
|
+
const [state, setState] = useState({
|
|
20
|
+
v: { type: "loading" },
|
|
21
|
+
history: [],
|
|
22
|
+
});
|
|
23
|
+
// ========== DEFINE BASIC CTRLS ==========
|
|
24
|
+
function _make() {
|
|
25
|
+
const _partCtrl = {
|
|
26
|
+
setData: (d) => {
|
|
27
|
+
// if it's the same data, don't update
|
|
28
|
+
if (state.v.type === "data" && state.v.value === d)
|
|
29
|
+
return;
|
|
30
|
+
setState({
|
|
31
|
+
history: bitP.useHistory ? [...state.history, d] : [],
|
|
32
|
+
v: { type: "data", value: d },
|
|
33
|
+
});
|
|
34
|
+
},
|
|
35
|
+
setLoading: () => setState(Object.assign(Object.assign({}, state), { v: { type: "loading" } })),
|
|
36
|
+
setError: (e) => setState(Object.assign(Object.assign({}, state), { v: { type: "error", value: e } })),
|
|
37
|
+
canGoBack: !!(bitP.useHistory && state.history.length > 1),
|
|
38
|
+
back: () => {
|
|
39
|
+
if (!bitP.useHistory)
|
|
40
|
+
return false;
|
|
41
|
+
if (state.history.length < 2)
|
|
42
|
+
return false;
|
|
43
|
+
const newHistory = state.history.slice(0, -1);
|
|
44
|
+
const newData = newHistory[newHistory.length - 1];
|
|
45
|
+
setState({
|
|
46
|
+
history: newHistory,
|
|
47
|
+
v: { type: "data", value: newData },
|
|
48
|
+
});
|
|
49
|
+
return true;
|
|
50
|
+
},
|
|
51
|
+
state: state.v.type,
|
|
52
|
+
isData: state.v.type === "data",
|
|
53
|
+
isLoading: state.v.type === "loading",
|
|
54
|
+
isError: state.v.type === "error",
|
|
55
|
+
data: state.v.type === "data" ? state.v.value : undefined,
|
|
56
|
+
error: state.v.type === "error" ? state.v.value : undefined,
|
|
57
|
+
};
|
|
58
|
+
// ========== DEFINE QoL FUNCTIONS ==========
|
|
59
|
+
function _worker(fn, silent) {
|
|
60
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
61
|
+
if (!silent)
|
|
62
|
+
_partCtrl.setLoading();
|
|
63
|
+
try {
|
|
64
|
+
const newData = yield fn();
|
|
65
|
+
_partCtrl.setData(newData);
|
|
66
|
+
}
|
|
67
|
+
catch (e) {
|
|
68
|
+
_partCtrl.setError(e);
|
|
69
|
+
}
|
|
70
|
+
});
|
|
71
|
+
}
|
|
72
|
+
const _reload = () => _worker(() => bitP.worker(p));
|
|
73
|
+
function act(fn, silent) {
|
|
74
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
75
|
+
const data = _partCtrl.data;
|
|
76
|
+
if (data === undefined)
|
|
77
|
+
return;
|
|
78
|
+
_worker(() => fn(data), silent);
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
function map(onData, onError, onLoading) {
|
|
82
|
+
var _a, _b, _c;
|
|
83
|
+
if (state.v.type === "data") {
|
|
84
|
+
return _isFn(onData)
|
|
85
|
+
? onData(state.v.value)
|
|
86
|
+
: (_a = onData) !== null && _a !== void 0 ? _a : null;
|
|
87
|
+
}
|
|
88
|
+
if (state.v.type === "error") {
|
|
89
|
+
return _isFn(onError)
|
|
90
|
+
? onError(state.v.value)
|
|
91
|
+
: (_b = onError) !== null && _b !== void 0 ? _b : null;
|
|
92
|
+
}
|
|
93
|
+
return _isFn(onLoading) ? onLoading() : (_c = onLoading) !== null && _c !== void 0 ? _c : null;
|
|
94
|
+
}
|
|
95
|
+
function mapUI(onData, onError, onLoading) {
|
|
96
|
+
return map((d) => onData(d), (e) => (onError !== null && onError !== void 0 ? onError : ((e) => _jsx(ErrorView, { error: e, retry: _reload })))(e), () => onLoading !== null && onLoading !== void 0 ? onLoading : (() => _jsx(_LoadView, {}))());
|
|
97
|
+
}
|
|
98
|
+
const baseCtrl = Object.assign(Object.assign({}, _partCtrl), { act,
|
|
99
|
+
map,
|
|
100
|
+
mapUI });
|
|
101
|
+
const userCtrl = bitP.control(Object.assign(Object.assign({}, baseCtrl), { parameters: p }));
|
|
102
|
+
return Object.assign(Object.assign(Object.assign({}, baseCtrl), userCtrl), { reload: _reload });
|
|
103
|
+
}
|
|
104
|
+
const ctrl = useMemo(() => _make(), [state]);
|
|
105
|
+
useEffect(() => ctrl.reload(), []);
|
|
106
|
+
// ========== DEFINE THE JSX ELEMENT ==========
|
|
107
|
+
return _jsx(context.Provider, { value: ctrl, children: p.children });
|
|
108
|
+
}
|
|
109
|
+
return _BitProvider;
|
|
110
|
+
}
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import { JSX } from "preact/jsx-runtime";
|
|
2
|
+
import { BitStates, BitUseInterface, ElbeChild, ElbeChildren, Maybe, PromiseOr } from "..";
|
|
3
|
+
export interface _BitData<D> {
|
|
4
|
+
state: any;
|
|
5
|
+
}
|
|
6
|
+
export type _BitState<D> = {
|
|
7
|
+
type: "loading";
|
|
8
|
+
} | {
|
|
9
|
+
type: "error";
|
|
10
|
+
value: any;
|
|
11
|
+
} | {
|
|
12
|
+
type: "data";
|
|
13
|
+
value: D;
|
|
14
|
+
};
|
|
15
|
+
export type BitTriMap<T, D> = {
|
|
16
|
+
onLoading?: () => D;
|
|
17
|
+
onError?: (e: any) => D;
|
|
18
|
+
onData?: (value: T) => D;
|
|
19
|
+
};
|
|
20
|
+
export interface _BitGetInterface<D> {
|
|
21
|
+
/**
|
|
22
|
+
* the current state of the bit. Is one of the following:
|
|
23
|
+
* - `data`: if valid data is present
|
|
24
|
+
* - `error`: if an error occurred
|
|
25
|
+
* - `loading`: if the bit is loading
|
|
26
|
+
*/
|
|
27
|
+
state: BitStates;
|
|
28
|
+
/**
|
|
29
|
+
* QoL function to check if the current state is `data`
|
|
30
|
+
*/
|
|
31
|
+
isData: boolean;
|
|
32
|
+
/**
|
|
33
|
+
* QoL function to check if the current state is `loading`
|
|
34
|
+
*/
|
|
35
|
+
isLoading: boolean;
|
|
36
|
+
/**
|
|
37
|
+
* QoL function to check if the current state is `error`
|
|
38
|
+
*/
|
|
39
|
+
isError: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* the current data of the bit. If the state is not `data`, it will be `undefined`.
|
|
42
|
+
*/
|
|
43
|
+
data: D | undefined;
|
|
44
|
+
/**
|
|
45
|
+
* the current error of the bit. If the state is not `error`, it will be `undefined`.
|
|
46
|
+
*/
|
|
47
|
+
error: any | undefined;
|
|
48
|
+
/**
|
|
49
|
+
* return a value based on the current state.
|
|
50
|
+
* You can pass a function or a value. If you don't pass a parameter, it will return `null`.
|
|
51
|
+
* @param onData the value (or function) to return when the state is "data"
|
|
52
|
+
* @param onError the value (or function) to return when the state is "error"
|
|
53
|
+
* @param onLoading the value (or function) to return when the state is "loading"
|
|
54
|
+
* @returns the (nullable) T based on the current state
|
|
55
|
+
*/
|
|
56
|
+
map: <T>(onData: ((d: D) => T) | T, onError?: ((e: any) => T) | T, onLoading?: (() => T) | T) => T | null;
|
|
57
|
+
/**
|
|
58
|
+
* a wrapper around `map` that returns a JSX element.
|
|
59
|
+
* If you don't pass a parameter, a default UI element will be rendered
|
|
60
|
+
* @param onData the value (or function) to return when the state is "data"
|
|
61
|
+
* @param onError the value (or function) to return when the state is "error"
|
|
62
|
+
* @param onLoading the value (or function) to return when the state is "loading"
|
|
63
|
+
* @returns a JSX element
|
|
64
|
+
*/
|
|
65
|
+
mapUI: (onData: (d: D) => ElbeChild, onError?: (e: any) => ElbeChild, onLoading?: () => ElbeChild) => ElbeChild;
|
|
66
|
+
/**
|
|
67
|
+
* return to the previous `data` state. If there is no previous state, it will return `false`.
|
|
68
|
+
* make sure you enable `useHistory` in the `createBit` function. You can check if a history exists with `canGoBack`.
|
|
69
|
+
* @returns
|
|
70
|
+
*/
|
|
71
|
+
back: () => boolean;
|
|
72
|
+
/**
|
|
73
|
+
* returns true if a previous `data` state exists.
|
|
74
|
+
*/
|
|
75
|
+
canGoBack: boolean;
|
|
76
|
+
}
|
|
77
|
+
export interface _BitCtrlInput<D, P> extends _BitGetInterface<D> {
|
|
78
|
+
setData: (d: D) => void;
|
|
79
|
+
setLoading: () => void;
|
|
80
|
+
setError: (e: any) => void;
|
|
81
|
+
/**
|
|
82
|
+
* makes it easier to change the data state. It gets called when data is present.
|
|
83
|
+
* It will publish the data that `fn` returns as a new state.
|
|
84
|
+
* If an error occurs, it will set the state to `error` with the error.
|
|
85
|
+
* @param fn the function to call. It will be called with the current data.
|
|
86
|
+
* @param silent if true, it will not change the state to `loading` before calling `fn`.
|
|
87
|
+
*/
|
|
88
|
+
act: (fn: (data: D) => PromiseOr<D>, silent?: boolean) => void;
|
|
89
|
+
/**
|
|
90
|
+
* the parameters passed to the provider.
|
|
91
|
+
*/
|
|
92
|
+
parameters: P;
|
|
93
|
+
}
|
|
94
|
+
export type _BitCtrlMaker<D, P, I> = (d: _BitCtrlInput<D, P>) => I;
|
|
95
|
+
export type _BitProvider<P> = (p: {
|
|
96
|
+
children?: Maybe<ElbeChildren>;
|
|
97
|
+
} & P) => JSX.Element;
|
|
98
|
+
export interface _BitInterface<D, P, I> {
|
|
99
|
+
Provider: _BitProvider<P>;
|
|
100
|
+
use: () => BitUseInterface<D, I>;
|
|
101
|
+
}
|
|
102
|
+
export declare function _isFn<T>(f: any): f is (d: T) => any;
|
package/dist/bit/bit.d.ts
CHANGED
|
@@ -1,37 +1,20 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
onData: <D>(f: (d: T) => any, { onLoading, onError, }?: {
|
|
8
|
-
onLoading?: () => any;
|
|
9
|
-
onError?: (e: string) => any;
|
|
10
|
-
}) => any;
|
|
11
|
-
}
|
|
12
|
-
interface BitData<C, T> {
|
|
13
|
-
ctrl: C;
|
|
14
|
-
state: Signal<BitState<T>>;
|
|
15
|
-
}
|
|
16
|
-
export interface BitState<T> {
|
|
17
|
-
loading?: boolean;
|
|
18
|
-
error?: any;
|
|
19
|
-
data?: T;
|
|
20
|
-
}
|
|
21
|
-
export type BitContext<T, C> = PreactContext<BitData<T, C> | null>;
|
|
22
|
-
export interface TriMap<T, D> {
|
|
1
|
+
import { PreactContext } from "preact";
|
|
2
|
+
import { Maybe, PromiseOr } from "..";
|
|
3
|
+
import { _BitCtrlMaker, _BitData, _BitGetInterface, _BitInterface } from "./_bit_utils";
|
|
4
|
+
export type BitStates = "loading" | "error" | "data";
|
|
5
|
+
export type BitContext<D> = PreactContext<_BitData<D> | null>;
|
|
6
|
+
export type BitTriMap<T, D> = {
|
|
23
7
|
onLoading?: () => D;
|
|
24
|
-
onError?: (e:
|
|
8
|
+
onError?: (e: any) => D;
|
|
25
9
|
onData?: (value: T) => D;
|
|
26
|
-
}
|
|
27
|
-
export
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
export declare function
|
|
37
|
-
export {};
|
|
10
|
+
};
|
|
11
|
+
export type BitUseInterface<D, I> = _BitGetInterface<D> & I & {
|
|
12
|
+
reload: () => void;
|
|
13
|
+
};
|
|
14
|
+
export type BitParams<D, P, I> = {
|
|
15
|
+
control?: _BitCtrlMaker<D, P, I>;
|
|
16
|
+
debugLabel?: Maybe<string>;
|
|
17
|
+
worker: (params: P) => PromiseOr<D>;
|
|
18
|
+
useHistory?: boolean;
|
|
19
|
+
};
|
|
20
|
+
export declare function createBit<D, P extends Object, I>({ control, ...p }: BitParams<D, P, I>): _BitInterface<D, P, I>;
|
package/dist/bit/bit.js
CHANGED
|
@@ -1,79 +1,30 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
3
12
|
import { createContext } from "preact";
|
|
4
13
|
import { useContext } from "preact/hooks";
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
c.displayName = name;
|
|
11
|
-
return c;
|
|
12
|
-
}
|
|
13
|
-
export function ProvideBit(context, parameters, worker, ctrl, children) {
|
|
14
|
-
const s = useSignal({ loading: true });
|
|
15
|
-
const _set = (n) => {
|
|
16
|
-
try {
|
|
17
|
-
if (JSON.stringify(n) === JSON.stringify(s.peek()))
|
|
18
|
-
return;
|
|
19
|
-
}
|
|
20
|
-
catch (e) { }
|
|
21
|
-
s.value = n;
|
|
22
|
-
};
|
|
23
|
-
const emit = (data) => _set({ data });
|
|
24
|
-
const emitLoading = () => _set({ loading: true });
|
|
25
|
-
const emitError = (error) => {
|
|
26
|
-
console.warn(`BIT: ${context.displayName} emitted ERROR`, error);
|
|
27
|
-
return _set({ error });
|
|
28
|
-
};
|
|
29
|
-
function map(m) {
|
|
30
|
-
var _a;
|
|
31
|
-
const st = s.value;
|
|
32
|
-
if (st.loading)
|
|
33
|
-
return m.onLoading();
|
|
34
|
-
if (st.error)
|
|
35
|
-
return m.onError(st.error);
|
|
36
|
-
return m.onData((_a = st.data) !== null && _a !== void 0 ? _a : null);
|
|
37
|
-
}
|
|
38
|
-
const c = ctrl(parameters, { emit, emitLoading, emitError, map, signal: s });
|
|
39
|
-
worker(parameters, { emit, emitLoading, emitError, map, signal: s }, c);
|
|
40
|
-
return (_jsx(context.Provider, { value: { ctrl: c, state: s }, children: children }));
|
|
41
|
-
}
|
|
42
|
-
export function useBit(context) {
|
|
43
|
-
try {
|
|
44
|
-
const { ctrl, state } = useContext(context);
|
|
45
|
-
const v = state.value;
|
|
46
|
-
function map(m) {
|
|
47
|
-
var _a;
|
|
48
|
-
if (v.loading)
|
|
49
|
-
return (m.onLoading ||
|
|
50
|
-
(() => (_jsx(Column, { cross: "center", children: _jsx(Spinner, {}) }))))();
|
|
51
|
-
if (v.error)
|
|
52
|
-
return (m.onError ||
|
|
53
|
-
((e) => { var _a; return _jsx(ErrorView, { error: e, retry: (_a = ctrl.reload) !== null && _a !== void 0 ? _a : null }); }))(v.error);
|
|
54
|
-
return m.onData((_a = v.data) !== null && _a !== void 0 ? _a : null);
|
|
55
|
-
}
|
|
56
|
-
return {
|
|
57
|
-
signal: state,
|
|
58
|
-
ctrl,
|
|
59
|
-
map,
|
|
60
|
-
/**
|
|
61
|
-
* this is a quality of life function that allows
|
|
62
|
-
* you to chain the map function with the onData function
|
|
63
|
-
* @param f the builder function
|
|
64
|
-
* @returns the built component
|
|
65
|
-
*/
|
|
66
|
-
onData: (f, { onLoading, onError, } = {}) => map({ onData: f, onLoading: onLoading, onError: onError }),
|
|
67
|
-
};
|
|
68
|
-
}
|
|
69
|
-
catch (e) {
|
|
70
|
-
const err = `BIT ERROR: NO ${context.displayName} PROVIDED`;
|
|
71
|
-
console.error(err, e);
|
|
14
|
+
import { _makeBitProvider } from "./_bit_provider";
|
|
15
|
+
export function createBit(_a) {
|
|
16
|
+
var { control = () => ({}) } = _a, p = __rest(_a, ["control"]);
|
|
17
|
+
const context = createContext(null);
|
|
18
|
+
{
|
|
72
19
|
return {
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
20
|
+
Provider: _makeBitProvider(context, Object.assign(Object.assign({}, p), { control })),
|
|
21
|
+
use: () => {
|
|
22
|
+
const ctx = useContext(context);
|
|
23
|
+
if (!ctx) {
|
|
24
|
+
throw new Error(`BIT ERROR: NO ${p.debugLabel} PROVIDED`);
|
|
25
|
+
}
|
|
26
|
+
return ctx;
|
|
27
|
+
},
|
|
77
28
|
};
|
|
78
29
|
}
|
|
79
30
|
}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { Signal } from "@preact/signals";
|
|
2
|
+
import { type PreactContext } from "preact";
|
|
3
|
+
export interface OldBitUseInterface<C, T> {
|
|
4
|
+
signal: Signal<OldBitState<T>>;
|
|
5
|
+
ctrl: C;
|
|
6
|
+
map: <D>(m: OldTriMap<T, D>) => D | preact.JSX.Element;
|
|
7
|
+
onData: <D>(f: (d: T) => any, { onLoading, onError, }?: {
|
|
8
|
+
onLoading?: () => any;
|
|
9
|
+
onError?: (e: string) => any;
|
|
10
|
+
}) => any;
|
|
11
|
+
}
|
|
12
|
+
interface OldBitData<C, T> {
|
|
13
|
+
ctrl: C;
|
|
14
|
+
state: Signal<OldBitState<T>>;
|
|
15
|
+
}
|
|
16
|
+
export interface OldBitState<T> {
|
|
17
|
+
loading?: boolean;
|
|
18
|
+
error?: any;
|
|
19
|
+
data?: T;
|
|
20
|
+
}
|
|
21
|
+
export type OldBitContext<T, C> = PreactContext<OldBitData<T, C> | null>;
|
|
22
|
+
export interface OldTriMap<T, D> {
|
|
23
|
+
onLoading?: () => D;
|
|
24
|
+
onError?: (e: string) => D;
|
|
25
|
+
onData?: (value: T) => D;
|
|
26
|
+
}
|
|
27
|
+
export interface OldTWParams<T> {
|
|
28
|
+
emit: (t: T) => void;
|
|
29
|
+
emitLoading: () => void;
|
|
30
|
+
emitError: (e: any) => void;
|
|
31
|
+
map: <D>(m: OldTriMap<T, D>) => D;
|
|
32
|
+
signal: Signal<OldBitState<T>>;
|
|
33
|
+
}
|
|
34
|
+
export declare function makeOldBit<C, T>(name: string): OldBitContext<C, T>;
|
|
35
|
+
export declare function ProvideOldBit<I, C, T>(context: OldBitContext<C, T>, parameters: I, worker: (p: I, d: OldTWParams<T>, ctrl: C) => void, ctrl: (p: I, d: OldTWParams<T>) => C, children: any): import("preact").JSX.Element;
|
|
36
|
+
export declare function useOldBit<C, T>(context: OldBitContext<C, T>): OldBitUseInterface<C, T>;
|
|
37
|
+
export {};
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
2
|
+
import { useSignal } from "@preact/signals";
|
|
3
|
+
import { createContext } from "preact";
|
|
4
|
+
import { useContext } from "preact/hooks";
|
|
5
|
+
import { ErrorView } from "../../ui/components/error_view";
|
|
6
|
+
import { Column } from "../../ui/components/layout/flex";
|
|
7
|
+
import { Spinner } from "../../ui/components/spinner";
|
|
8
|
+
export function makeOldBit(name) {
|
|
9
|
+
const c = createContext(null);
|
|
10
|
+
c.displayName = name;
|
|
11
|
+
return c;
|
|
12
|
+
}
|
|
13
|
+
export function ProvideOldBit(context, parameters, worker, ctrl, children) {
|
|
14
|
+
const s = useSignal({ loading: true });
|
|
15
|
+
const _set = (n) => {
|
|
16
|
+
try {
|
|
17
|
+
if (JSON.stringify(n) === JSON.stringify(s.peek()))
|
|
18
|
+
return;
|
|
19
|
+
}
|
|
20
|
+
catch (e) { }
|
|
21
|
+
s.value = n;
|
|
22
|
+
};
|
|
23
|
+
const emit = (data) => _set({ data });
|
|
24
|
+
const emitLoading = () => _set({ loading: true });
|
|
25
|
+
const emitError = (error) => {
|
|
26
|
+
console.warn(`BIT: ${context.displayName} emitted ERROR`, error);
|
|
27
|
+
return _set({ error });
|
|
28
|
+
};
|
|
29
|
+
function map(m) {
|
|
30
|
+
var _a;
|
|
31
|
+
const st = s.value;
|
|
32
|
+
if (st.loading)
|
|
33
|
+
return m.onLoading();
|
|
34
|
+
if (st.error)
|
|
35
|
+
return m.onError(st.error);
|
|
36
|
+
return m.onData((_a = st.data) !== null && _a !== void 0 ? _a : null);
|
|
37
|
+
}
|
|
38
|
+
const c = ctrl(parameters, { emit, emitLoading, emitError, map, signal: s });
|
|
39
|
+
worker(parameters, { emit, emitLoading, emitError, map, signal: s }, c);
|
|
40
|
+
return (_jsx(context.Provider, { value: { ctrl: c, state: s }, children: children }));
|
|
41
|
+
}
|
|
42
|
+
export function useOldBit(context) {
|
|
43
|
+
try {
|
|
44
|
+
const { ctrl, state } = useContext(context);
|
|
45
|
+
const v = state.value;
|
|
46
|
+
function map(m) {
|
|
47
|
+
var _a;
|
|
48
|
+
if (v.loading)
|
|
49
|
+
return (m.onLoading ||
|
|
50
|
+
(() => (_jsx(Column, { cross: "center", children: _jsx(Spinner, {}) }))))();
|
|
51
|
+
if (v.error)
|
|
52
|
+
return (m.onError ||
|
|
53
|
+
((e) => { var _a; return _jsx(ErrorView, { error: e, retry: (_a = ctrl.reload) !== null && _a !== void 0 ? _a : null }); }))(v.error);
|
|
54
|
+
return m.onData((_a = v.data) !== null && _a !== void 0 ? _a : null);
|
|
55
|
+
}
|
|
56
|
+
return {
|
|
57
|
+
signal: state,
|
|
58
|
+
ctrl,
|
|
59
|
+
map,
|
|
60
|
+
/**
|
|
61
|
+
* this is a quality of life function that allows
|
|
62
|
+
* you to chain the map function with the onData function
|
|
63
|
+
* @param f the builder function
|
|
64
|
+
* @returns the built component
|
|
65
|
+
*/
|
|
66
|
+
onData: (f, { onLoading, onError, } = {}) => map({ onData: f, onLoading: onLoading, onError: onError }),
|
|
67
|
+
};
|
|
68
|
+
}
|
|
69
|
+
catch (e) {
|
|
70
|
+
const err = `BIT ERROR: NO ${context.displayName} PROVIDED`;
|
|
71
|
+
console.error(err, e);
|
|
72
|
+
return {
|
|
73
|
+
map: (_) => _jsx("div", { children: err }),
|
|
74
|
+
ctrl: null,
|
|
75
|
+
signal: null,
|
|
76
|
+
onData: () => _jsx("div", { children: err }),
|
|
77
|
+
};
|
|
78
|
+
}
|
|
79
|
+
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import type { JSX } from "preact/jsx-runtime";
|
|
2
|
-
import
|
|
3
|
-
declare abstract class
|
|
2
|
+
import { OldBitUseInterface, OldTWParams } from "./old_bit";
|
|
3
|
+
declare abstract class OldBitControl<I, DT> {
|
|
4
4
|
p: I;
|
|
5
|
-
bit:
|
|
6
|
-
constructor(p: I, bit:
|
|
5
|
+
bit: OldTWParams<DT>;
|
|
6
|
+
constructor(p: I, bit: OldTWParams<DT>);
|
|
7
7
|
act(fn: (b: DT) => Promise<void>): void;
|
|
8
8
|
/**
|
|
9
9
|
* Clean up resources. This is called once
|
|
@@ -11,20 +11,20 @@ declare abstract class BitControl<I, DT> {
|
|
|
11
11
|
*/
|
|
12
12
|
dispose(): void;
|
|
13
13
|
}
|
|
14
|
-
export declare abstract class WorkerControl<I, DT> extends
|
|
14
|
+
export declare abstract class WorkerControl<I, DT> extends OldBitControl<I, DT> {
|
|
15
15
|
reload: (() => Promise<void>) | null;
|
|
16
16
|
abstract worker(): Promise<DT>;
|
|
17
17
|
}
|
|
18
|
-
export declare abstract class StreamControl<I, DT, Stream> extends
|
|
18
|
+
export declare abstract class StreamControl<I, DT, Stream> extends OldBitControl<I, DT> {
|
|
19
19
|
protected stream: Stream | null;
|
|
20
20
|
abstract listen(): Stream;
|
|
21
21
|
dispose(): void;
|
|
22
22
|
abstract disposeStream(stream: Stream): void;
|
|
23
23
|
}
|
|
24
|
-
export declare function CtrlBit<I, DT, C extends
|
|
24
|
+
export declare function CtrlBit<I, DT, C extends OldBitControl<I, DT>>(ctrl: (p: I, d: OldTWParams<DT>) => C, name?: string): {
|
|
25
25
|
Provide: (props: I & {
|
|
26
26
|
children: React.ReactNode;
|
|
27
27
|
}) => JSX.Element;
|
|
28
|
-
use: () =>
|
|
28
|
+
use: () => OldBitUseInterface<C, DT>;
|
|
29
29
|
};
|
|
30
30
|
export {};
|
|
@@ -19,8 +19,8 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
19
19
|
return t;
|
|
20
20
|
};
|
|
21
21
|
import { useEffect } from "preact/hooks";
|
|
22
|
-
import {
|
|
23
|
-
class
|
|
22
|
+
import { makeOldBit, ProvideOldBit, useOldBit, } from "./old_bit";
|
|
23
|
+
class OldBitControl {
|
|
24
24
|
constructor(p, bit) {
|
|
25
25
|
this.bit = bit;
|
|
26
26
|
this.p = p;
|
|
@@ -46,13 +46,13 @@ class BitControl {
|
|
|
46
46
|
*/
|
|
47
47
|
dispose() { }
|
|
48
48
|
}
|
|
49
|
-
export class WorkerControl extends
|
|
49
|
+
export class WorkerControl extends OldBitControl {
|
|
50
50
|
constructor() {
|
|
51
51
|
super(...arguments);
|
|
52
52
|
this.reload = null;
|
|
53
53
|
}
|
|
54
54
|
}
|
|
55
|
-
export class StreamControl extends
|
|
55
|
+
export class StreamControl extends OldBitControl {
|
|
56
56
|
constructor() {
|
|
57
57
|
super(...arguments);
|
|
58
58
|
this.stream = null;
|
|
@@ -63,16 +63,16 @@ export class StreamControl extends BitControl {
|
|
|
63
63
|
}
|
|
64
64
|
}
|
|
65
65
|
function make(name) {
|
|
66
|
-
return
|
|
66
|
+
return makeOldBit(name);
|
|
67
67
|
}
|
|
68
68
|
function use(b) {
|
|
69
|
-
return
|
|
69
|
+
return useOldBit(b);
|
|
70
70
|
}
|
|
71
71
|
export function CtrlBit(ctrl, name) {
|
|
72
72
|
const context = make((name || "Unknown") + "Bit");
|
|
73
73
|
function Provide(_a) {
|
|
74
74
|
var { children } = _a, p = __rest(_a, ["children"]);
|
|
75
|
-
return
|
|
75
|
+
return ProvideOldBit(context, p, (p, b, c) => __awaiter(this, void 0, void 0, function* () {
|
|
76
76
|
b.emitLoading();
|
|
77
77
|
try {
|
|
78
78
|
if (c instanceof WorkerControl) {
|
package/dist/index.d.ts
CHANGED
|
@@ -3,7 +3,8 @@ export * from "./api/api_worker";
|
|
|
3
3
|
export * from "./api/error";
|
|
4
4
|
export * from "./api/errors";
|
|
5
5
|
export * from "./bit/bit";
|
|
6
|
-
export * from "./bit/
|
|
6
|
+
export * from "./bit/old/old_bit";
|
|
7
|
+
export * from "./bit/old/old_ctrl_bit";
|
|
7
8
|
export * from "./ui/util/confirm_dialog";
|
|
8
9
|
export * from "./ui/util/ctx_toolbar";
|
|
9
10
|
export * from "./ui/util/l10n/l10n";
|
package/dist/index.js
CHANGED
|
@@ -6,7 +6,8 @@ export * from "./api/api_worker";
|
|
|
6
6
|
export * from "./api/error";
|
|
7
7
|
export * from "./api/errors";
|
|
8
8
|
export * from "./bit/bit";
|
|
9
|
-
export * from "./bit/
|
|
9
|
+
export * from "./bit/old/old_bit";
|
|
10
|
+
export * from "./bit/old/old_ctrl_bit";
|
|
10
11
|
export * from "./ui/util/confirm_dialog";
|
|
11
12
|
export * from "./ui/util/ctx_toolbar";
|
|
12
13
|
export * from "./ui/util/l10n/l10n";
|
|
@@ -14,15 +14,13 @@ export function AppBase(p) {
|
|
|
14
14
|
const [state, setState] = useState({
|
|
15
15
|
menuSelected: (_c = (_a = p.initial) !== null && _a !== void 0 ? _a : (_b = p.menu[0]) === null || _b === void 0 ? void 0 : _b.id) !== null && _c !== void 0 ? _c : null,
|
|
16
16
|
menuOpen: false,
|
|
17
|
-
icons: {
|
|
18
|
-
logo: p.logo,
|
|
19
|
-
logoDark: p.logoDark,
|
|
20
|
-
endLogo: p.endLogo,
|
|
21
|
-
endLogoDark: p.endLogoDark,
|
|
22
|
-
},
|
|
23
|
-
globalActions: (_d = p.globalActions) !== null && _d !== void 0 ? _d : [],
|
|
24
17
|
});
|
|
25
|
-
return (_jsx(AppBaseContext.Provider, { value: Object.assign(Object.assign({}, state), {
|
|
18
|
+
return (_jsx(AppBaseContext.Provider, { value: Object.assign(Object.assign({}, state), { icons: {
|
|
19
|
+
logo: p.logo,
|
|
20
|
+
logoDark: p.logoDark,
|
|
21
|
+
endLogo: p.endLogo,
|
|
22
|
+
endLogoDark: p.endLogoDark,
|
|
23
|
+
}, globalActions: (_d = p.globalActions) !== null && _d !== void 0 ? _d : [], setMenuOpen: (b) => setState(Object.assign(Object.assign({}, state), { menuOpen: b })), setMenuSelected: (s) => setState(Object.assign(Object.assign({}, state), { menuSelected: s })) }), children: _jsxs(Box, { scheme: "primary", style: {
|
|
26
24
|
display: "flex",
|
|
27
25
|
width: "100%",
|
|
28
26
|
minHeight: "100vh",
|
|
@@ -8,7 +8,7 @@ import { _bestMatch, _L10nContext, _useL10n, } from "./_l10n_util";
|
|
|
8
8
|
* @returns an object with the L10n component and the useL10n hook.
|
|
9
9
|
*/
|
|
10
10
|
export function makeL10n(fallback, supported) {
|
|
11
|
-
if (Object.keys(
|
|
11
|
+
if (Object.keys(fallback).length === 0) {
|
|
12
12
|
throw new Error("L10nBase: No fallback locales provided");
|
|
13
13
|
}
|
|
14
14
|
const fallbackLocale = Object.keys(fallback)[0];
|
package/dist/ui/util/util.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { int } from "../..";
|
|
2
2
|
export type Maybe<T> = T | null | undefined;
|
|
3
|
+
export type PromiseOr<T> = Promise<T> | T;
|
|
3
4
|
export declare function clamp(value: number, min: number, max: number): number;
|
|
4
5
|
export declare function classString(classes: (string | false | null | undefined)[]): string;
|
|
5
6
|
/**
|