@ablogcms/pending 3.2.28-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +20 -0
- package/dist/acms.d.ts +6 -0
- package/dist/acms.mjs +1 -0
- package/dist/acms.mjs.map +1 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.mjs +68 -0
- package/dist/index.mjs.map +1 -0
- package/dist/pending-container.d.ts +2 -0
- package/dist/pending.d.ts +6 -0
- package/dist/store/hook.d.ts +5 -0
- package/dist/store/index.d.ts +2 -0
- package/dist/store/store.d.ts +11 -0
- package/dist/types/index.d.ts +8 -0
- package/package.json +52 -0
package/README.md
ADDED
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
# @ablogcms/pending
|
|
2
|
+
|
|
3
|
+
処理待ち(スプラッシュ表示)の状態管理 store と公開 API を提供するパッケージ。
|
|
4
|
+
|
|
5
|
+
## 使い方
|
|
6
|
+
|
|
7
|
+
```ts
|
|
8
|
+
import { pending } from '@ablogcms/pending';
|
|
9
|
+
|
|
10
|
+
const removeSplash = pending.splash(ACMS.i18n('splash.default'));
|
|
11
|
+
try {
|
|
12
|
+
await doSomething();
|
|
13
|
+
} finally {
|
|
14
|
+
removeSplash();
|
|
15
|
+
}
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
- `pending.splash(message)`: スプラッシュ表示を追加し、解除用の関数を返す。
|
|
19
|
+
- `PendingContainer`: 実際にスプラッシュを DOM へレンダリングするコンポーネント。ページに 1 度だけ
|
|
20
|
+
マウントすれば、以降の `pending.*` 呼び出しに反応して表示される。
|
package/dist/acms.d.ts
ADDED
package/dist/acms.mjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=acms.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
package/dist/index.d.ts
ADDED
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
// src/store/store.ts
|
|
2
|
+
var pending = null;
|
|
3
|
+
var listeners = /* @__PURE__ */ new Set();
|
|
4
|
+
function emitChange() {
|
|
5
|
+
for (const listener of listeners) {
|
|
6
|
+
listener();
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
function pushPending({ type, message }) {
|
|
10
|
+
pending = { type, message };
|
|
11
|
+
emitChange();
|
|
12
|
+
}
|
|
13
|
+
function removePending() {
|
|
14
|
+
pending = null;
|
|
15
|
+
emitChange();
|
|
16
|
+
}
|
|
17
|
+
function createPendingStore() {
|
|
18
|
+
return {
|
|
19
|
+
pushPending,
|
|
20
|
+
removePending,
|
|
21
|
+
subscribe(listener) {
|
|
22
|
+
listeners.add(listener);
|
|
23
|
+
return () => {
|
|
24
|
+
listeners.delete(listener);
|
|
25
|
+
};
|
|
26
|
+
},
|
|
27
|
+
getSnapshot() {
|
|
28
|
+
return pending;
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
// src/pending.ts
|
|
34
|
+
function splash(message) {
|
|
35
|
+
pushPending({ type: "splash", message });
|
|
36
|
+
return removePending;
|
|
37
|
+
}
|
|
38
|
+
var pending_default = {
|
|
39
|
+
splash
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
// src/pending-container.tsx
|
|
43
|
+
import Splash from "@ablogcms/components/splash";
|
|
44
|
+
|
|
45
|
+
// src/store/hook.ts
|
|
46
|
+
import { useRef, useSyncExternalStore } from "react";
|
|
47
|
+
function usePendingStore() {
|
|
48
|
+
const { subscribe, getSnapshot, pushPending: pushPending2, removePending: removePending2 } = useRef(createPendingStore()).current;
|
|
49
|
+
const snapshot = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
|
|
50
|
+
return { snapshot, pushPending: pushPending2, removePending: removePending2 };
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
// src/pending-container.tsx
|
|
54
|
+
import { jsx } from "react/jsx-runtime";
|
|
55
|
+
var PendingTypeToComponent = {
|
|
56
|
+
splash: Splash
|
|
57
|
+
};
|
|
58
|
+
function PendingContainer() {
|
|
59
|
+
const { snapshot } = usePendingStore();
|
|
60
|
+
const Component = snapshot ? PendingTypeToComponent[snapshot.type] : null;
|
|
61
|
+
return /* @__PURE__ */ jsx("div", { id: "acms-pending-container", children: snapshot && Component && /* @__PURE__ */ jsx(Component, { message: snapshot.message }) });
|
|
62
|
+
}
|
|
63
|
+
var pending_container_default = PendingContainer;
|
|
64
|
+
export {
|
|
65
|
+
pending_container_default as PendingContainer,
|
|
66
|
+
pending_default as pending
|
|
67
|
+
};
|
|
68
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/store/store.ts","../src/pending.ts","../src/pending-container.tsx","../src/store/hook.ts"],"sourcesContent":["import { PendingStore } from '../types';\n\nlet pending: PendingStore | null = null;\ntype Pending = () => void;\nconst listeners = new Set<Pending>();\n\nfunction emitChange() {\n for (const listener of listeners) {\n listener();\n }\n}\n\nexport function pushPending({ type, message }: PendingStore) {\n pending = { type, message };\n emitChange();\n}\n\nexport function removePending() {\n pending = null;\n emitChange();\n}\n\nexport function createPendingStore() {\n return {\n pushPending,\n removePending,\n subscribe(listener: Pending) {\n listeners.add(listener);\n\n return () => {\n listeners.delete(listener);\n };\n },\n getSnapshot() {\n return pending;\n },\n };\n}\n","import { pushPending, removePending } from './store/store';\n\nfunction splash(message: string) {\n pushPending({ type: 'splash', message });\n return removePending;\n}\n\nexport default {\n splash,\n};\n","import Splash from '@ablogcms/components/splash';\nimport { usePendingStore } from './store';\n\nconst PendingTypeToComponent = {\n splash: Splash,\n};\n\nfunction PendingContainer() {\n const { snapshot } = usePendingStore();\n\n const Component = snapshot ? PendingTypeToComponent[snapshot.type] : null;\n\n return <div id=\"acms-pending-container\">{snapshot && Component && <Component message={snapshot.message} />}</div>;\n}\n\nexport default PendingContainer;\n","import { useRef, useSyncExternalStore } from 'react';\n\nimport { createPendingStore } from './store';\n\nexport default function usePendingStore() {\n // 初期化 & 永続化\n const { subscribe, getSnapshot, pushPending, removePending } = useRef(createPendingStore()).current;\n const snapshot = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n\n return { snapshot, pushPending, removePending };\n}\n"],"mappings":";AAEA,IAAI,UAA+B;AAEnC,IAAM,YAAY,oBAAI,IAAa;AAEnC,SAAS,aAAa;AACpB,aAAW,YAAY,WAAW;AAChC,aAAS;AAAA,EACX;AACF;AAEO,SAAS,YAAY,EAAE,MAAM,QAAQ,GAAiB;AAC3D,YAAU,EAAE,MAAM,QAAQ;AAC1B,aAAW;AACb;AAEO,SAAS,gBAAgB;AAC9B,YAAU;AACV,aAAW;AACb;AAEO,SAAS,qBAAqB;AACnC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,UAAU,UAAmB;AAC3B,gBAAU,IAAI,QAAQ;AAEtB,aAAO,MAAM;AACX,kBAAU,OAAO,QAAQ;AAAA,MAC3B;AAAA,IACF;AAAA,IACA,cAAc;AACZ,aAAO;AAAA,IACT;AAAA,EACF;AACF;;;ACnCA,SAAS,OAAO,SAAiB;AAC/B,cAAY,EAAE,MAAM,UAAU,QAAQ,CAAC;AACvC,SAAO;AACT;AAEA,IAAO,kBAAQ;AAAA,EACb;AACF;;;ACTA,OAAO,YAAY;;;ACAnB,SAAS,QAAQ,4BAA4B;AAI9B,SAAR,kBAAmC;AAExC,QAAM,EAAE,WAAW,aAAa,aAAAA,cAAa,eAAAC,eAAc,IAAI,OAAO,mBAAmB,CAAC,EAAE;AAC5F,QAAM,WAAW,qBAAqB,WAAW,aAAa,WAAW;AAEzE,SAAO,EAAE,UAAU,aAAAD,cAAa,eAAAC,eAAc;AAChD;;;ADEoE;AATpE,IAAM,yBAAyB;AAAA,EAC7B,QAAQ;AACV;AAEA,SAAS,mBAAmB;AAC1B,QAAM,EAAE,SAAS,IAAI,gBAAgB;AAErC,QAAM,YAAY,WAAW,uBAAuB,SAAS,IAAI,IAAI;AAErE,SAAO,oBAAC,SAAI,IAAG,0BAA0B,sBAAY,aAAa,oBAAC,aAAU,SAAS,SAAS,SAAS,GAAG;AAC7G;AAEA,IAAO,4BAAQ;","names":["pushPending","removePending"]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { PendingStore } from '../types/index.js';
|
|
2
|
+
type Pending = () => void;
|
|
3
|
+
export declare function pushPending({ type, message }: PendingStore): void;
|
|
4
|
+
export declare function removePending(): void;
|
|
5
|
+
export declare function createPendingStore(): {
|
|
6
|
+
pushPending: typeof pushPending;
|
|
7
|
+
removePending: typeof removePending;
|
|
8
|
+
subscribe(listener: Pending): () => void;
|
|
9
|
+
getSnapshot(): PendingStore | null;
|
|
10
|
+
};
|
|
11
|
+
export {};
|
package/package.json
ADDED
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@ablogcms/pending",
|
|
3
|
+
"version": "3.2.28-beta.0",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"description": "処理待ち(スプラッシュ表示)の状態管理",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"homepage": "https://www.a-blogcms.jp",
|
|
8
|
+
"repository": {
|
|
9
|
+
"type": "git",
|
|
10
|
+
"url": "git+ssh://git@bitbucket.org:appleple/ablogcms.git",
|
|
11
|
+
"directory": "packages/frontend/pending"
|
|
12
|
+
},
|
|
13
|
+
"sideEffects": false,
|
|
14
|
+
"dependencies": {
|
|
15
|
+
"@ablogcms/components": "3.2.28-beta.0",
|
|
16
|
+
"@ablogcms/types": "3.2.28-beta.0"
|
|
17
|
+
},
|
|
18
|
+
"devDependencies": {
|
|
19
|
+
"@testing-library/react": "^16.3.2",
|
|
20
|
+
"vitest": "^4.1.9"
|
|
21
|
+
},
|
|
22
|
+
"peerDependencies": {
|
|
23
|
+
"react": "^19",
|
|
24
|
+
"@types/react": "^19.2.17"
|
|
25
|
+
},
|
|
26
|
+
"peerDependenciesMeta": {
|
|
27
|
+
"@types/react": {
|
|
28
|
+
"optional": true
|
|
29
|
+
}
|
|
30
|
+
},
|
|
31
|
+
"exports": {
|
|
32
|
+
".": {
|
|
33
|
+
"types": "./dist/index.d.ts",
|
|
34
|
+
"import": "./dist/index.mjs",
|
|
35
|
+
"default": "./dist/index.mjs"
|
|
36
|
+
},
|
|
37
|
+
"./acms": {
|
|
38
|
+
"types": "./dist/acms.d.ts",
|
|
39
|
+
"import": "./dist/acms.mjs",
|
|
40
|
+
"default": "./dist/acms.mjs"
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
"publishConfig": {
|
|
44
|
+
"access": "public"
|
|
45
|
+
},
|
|
46
|
+
"files": [
|
|
47
|
+
"dist"
|
|
48
|
+
],
|
|
49
|
+
"scripts": {
|
|
50
|
+
"build": "node ../../../tools/build-package.mjs"
|
|
51
|
+
}
|
|
52
|
+
}
|