1 | "use strict";
|
2 | var __extends = (this && this.__extends) || (function () {
|
3 | var extendStatics = function (d, b) {
|
4 | extendStatics = Object.setPrototypeOf ||
|
5 | ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
6 | function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
7 | return extendStatics(d, b);
|
8 | };
|
9 | return function (d, b) {
|
10 | extendStatics(d, b);
|
11 | function __() { this.constructor = d; }
|
12 | d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
13 | };
|
14 | })();
|
15 | var __assign = (this && this.__assign) || function () {
|
16 | __assign = Object.assign || function(t) {
|
17 | for (var s, i = 1, n = arguments.length; i < n; i++) {
|
18 | s = arguments[i];
|
19 | for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
20 | t[p] = s[p];
|
21 | }
|
22 | return t;
|
23 | };
|
24 | return __assign.apply(this, arguments);
|
25 | };
|
26 | var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
27 | function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
28 | return new (P || (P = Promise))(function (resolve, reject) {
|
29 | function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
30 | function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
31 | function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
32 | step((generator = generator.apply(thisArg, _arguments || [])).next());
|
33 | });
|
34 | };
|
35 | var __generator = (this && this.__generator) || function (thisArg, body) {
|
36 | var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
37 | return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
38 | function verb(n) { return function (v) { return step([n, v]); }; }
|
39 | function step(op) {
|
40 | if (f) throw new TypeError("Generator is already executing.");
|
41 | while (_) try {
|
42 | if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
43 | if (y = 0, t) op = [op[0] & 2, t.value];
|
44 | switch (op[0]) {
|
45 | case 0: case 1: t = op; break;
|
46 | case 4: _.label++; return { value: op[1], done: false };
|
47 | case 5: _.label++; y = op[1]; op = [0]; continue;
|
48 | case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
49 | default:
|
50 | if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
51 | if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
52 | if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
53 | if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
54 | if (t[2]) _.ops.pop();
|
55 | _.trys.pop(); continue;
|
56 | }
|
57 | op = body.call(thisArg, _);
|
58 | } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
59 | if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
60 | }
|
61 | };
|
62 | var __importStar = (this && this.__importStar) || function (mod) {
|
63 | if (mod && mod.__esModule) return mod;
|
64 | var result = {};
|
65 | if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
|
66 | result["default"] = mod;
|
67 | return result;
|
68 | };
|
69 | var __importDefault = (this && this.__importDefault) || function (mod) {
|
70 | return (mod && mod.__esModule) ? mod : { "default": mod };
|
71 | };
|
72 | Object.defineProperty(exports, "__esModule", { value: true });
|
73 |
|
74 | var react_1 = __importStar(require("react"));
|
75 | var emotion_theming_1 = require("emotion-theming");
|
76 | var addons_1 = __importDefault(require("@storybook/addons"));
|
77 | var core_events_1 = __importDefault(require("@storybook/core-events"));
|
78 | var channels_1 = __importDefault(require("@storybook/channels"));
|
79 | var channel_websocket_1 = __importDefault(require("@storybook/channel-websocket"));
|
80 | var client_api_1 = require("@storybook/client-api");
|
81 | var OnDeviceUI_1 = __importDefault(require("./components/OnDeviceUI"));
|
82 | var StoryView_1 = __importDefault(require("./components/StoryView"));
|
83 | var theme_1 = require("./components/Shared/theme");
|
84 |
|
85 | var rn_host_detect_1 = __importDefault(require("./rn-host-detect"));
|
86 | var STORAGE_KEY = 'lastOpenedStory';
|
87 | var Preview = (function () {
|
88 | function Preview() {
|
89 | var _this = this;
|
90 | this.api = function () {
|
91 | return _this._clientApi;
|
92 | };
|
93 | this.configure = function (loadStories, module) {
|
94 | loadStories();
|
95 | if (module && module.hot) {
|
96 | module.hot.accept(function () { return _this._sendSetStories(); });
|
97 |
|
98 | }
|
99 | };
|
100 | this.getStorybookUI = function (params) {
|
101 | if (params === void 0) { params = {}; }
|
102 | var webUrl = null;
|
103 | var channel = null;
|
104 | if (params.asyncStorage === undefined) {
|
105 |
|
106 | console.warn("\nStarting Storybook v5.3.0, we require to manually pass an asyncStorage prop. Pass null to disable or use one from @react-native-community or react-native itself.\n\nMore info: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#react-native-async-storage\n ".trim());
|
107 | }
|
108 | if (params.asyncStorage) {
|
109 | _this._asyncStorage = params.asyncStorage;
|
110 | }
|
111 | var onDeviceUI = params.onDeviceUI !== false;
|
112 | var initialSelection = params.initialSelection, shouldPersistSelection = params.shouldPersistSelection;
|
113 | try {
|
114 | channel = addons_1.default.getChannel();
|
115 | }
|
116 | catch (e) {
|
117 |
|
118 |
|
119 | }
|
120 | if (!channel || params.resetStorybook) {
|
121 | if (onDeviceUI && params.disableWebsockets) {
|
122 | channel = new channels_1.default({ async: true });
|
123 | _this._setInitialStory(initialSelection, shouldPersistSelection);
|
124 | }
|
125 | else {
|
126 | var host = rn_host_detect_1.default(params.host || 'localhost');
|
127 | var port = ":" + (params.port || 7007);
|
128 | var query = params.query || '';
|
129 | var secured = params.secured;
|
130 | var websocketType = secured ? 'wss' : 'ws';
|
131 | var httpType = secured ? 'https' : 'http';
|
132 | var url = websocketType + "://" + host + port + "/" + query;
|
133 | webUrl = httpType + "://" + host + port;
|
134 | channel = channel_websocket_1.default({
|
135 | url: url,
|
136 | async: onDeviceUI,
|
137 | onError: function () {
|
138 | _this._setInitialStory(initialSelection, shouldPersistSelection);
|
139 | },
|
140 | });
|
141 | }
|
142 | addons_1.default.setChannel(channel);
|
143 | _this._stories.setChannel(channel);
|
144 | channel.emit(core_events_1.default.CHANNEL_CREATED);
|
145 | }
|
146 | channel.on(core_events_1.default.GET_STORIES, function () { return _this._sendSetStories(); });
|
147 | channel.on(core_events_1.default.SET_CURRENT_STORY, function (d) { return _this._selectStoryEvent(d); });
|
148 | _this._sendSetStories();
|
149 |
|
150 | var preview = _this;
|
151 | addons_1.default.loadAddons(_this._clientApi);
|
152 | var appliedTheme = __assign(__assign({}, theme_1.theme), params.theme);
|
153 |
|
154 | return (function (_super) {
|
155 | __extends(StorybookRoot, _super);
|
156 | function StorybookRoot() {
|
157 | return _super !== null && _super.apply(this, arguments) || this;
|
158 | }
|
159 | StorybookRoot.prototype.render = function () {
|
160 | if (onDeviceUI) {
|
161 | return (react_1.default.createElement(emotion_theming_1.ThemeProvider, { theme: appliedTheme },
|
162 | react_1.default.createElement(OnDeviceUI_1.default, { stories: preview._stories, url: webUrl, isUIHidden: params.isUIHidden, tabOpen: params.tabOpen, shouldDisableKeyboardAvoidingView: params.shouldDisableKeyboardAvoidingView, keyboardAvoidingViewVerticalOffset: params.keyboardAvoidingViewVerticalOffset })));
|
163 | }
|
164 | return (react_1.default.createElement(emotion_theming_1.ThemeProvider, { theme: appliedTheme },
|
165 | react_1.default.createElement(StoryView_1.default, { stories: preview._stories, url: webUrl })));
|
166 | };
|
167 | return StorybookRoot;
|
168 | }(react_1.PureComponent));
|
169 | };
|
170 | this._setInitialStory = function (initialSelection, shouldPersistSelection) {
|
171 | if (shouldPersistSelection === void 0) { shouldPersistSelection = true; }
|
172 | return __awaiter(_this, void 0, void 0, function () {
|
173 | var story;
|
174 | return __generator(this, function (_a) {
|
175 | switch (_a.label) {
|
176 | case 0: return [4 , this._getInitialStory(initialSelection, shouldPersistSelection)()];
|
177 | case 1:
|
178 | story = _a.sent();
|
179 | if (story) {
|
180 | this._selectStory(story);
|
181 | }
|
182 | return [2 ];
|
183 | }
|
184 | });
|
185 | });
|
186 | };
|
187 | this._getInitialStory = function (initialSelection, shouldPersistSelection) {
|
188 | if (shouldPersistSelection === void 0) { shouldPersistSelection = true; }
|
189 | return function () { return __awaiter(_this, void 0, void 0, function () {
|
190 | var story, value, _a, _b, e_1, stories;
|
191 | return __generator(this, function (_c) {
|
192 | switch (_c.label) {
|
193 | case 0:
|
194 | story = null;
|
195 | if (!(initialSelection && this._checkStory(initialSelection))) return [3 , 1];
|
196 | story = initialSelection;
|
197 | return [3 , 6];
|
198 | case 1:
|
199 | if (!shouldPersistSelection) return [3 , 6];
|
200 | _c.label = 2;
|
201 | case 2:
|
202 | _c.trys.push([2, 5, , 6]);
|
203 | value = this._asyncStorageStoryId;
|
204 | if (!(!value && this._asyncStorage)) return [3 , 4];
|
205 | _b = (_a = JSON).parse;
|
206 | return [4 , this._asyncStorage.getItem(STORAGE_KEY)];
|
207 | case 3:
|
208 | value = _b.apply(_a, [_c.sent()]);
|
209 | this._asyncStorageStoryId = value;
|
210 | _c.label = 4;
|
211 | case 4:
|
212 | if (this._checkStory(value)) {
|
213 | story = value;
|
214 | }
|
215 | return [3 , 6];
|
216 | case 5:
|
217 | e_1 = _c.sent();
|
218 | return [3 , 6];
|
219 | case 6:
|
220 | if (story) {
|
221 | return [2 , this._getStory(story)];
|
222 | }
|
223 | stories = this._stories.raw();
|
224 | if (stories && stories.length) {
|
225 | return [2 , this._getStory(stories[0].id)];
|
226 | }
|
227 | return [2 , null];
|
228 | }
|
229 | });
|
230 | }); };
|
231 | };
|
232 | this._addons = {};
|
233 | this._decorators = [];
|
234 | this._stories = new client_api_1.StoryStore({ channel: null });
|
235 | this._clientApi = new client_api_1.ClientApi({ storyStore: this._stories });
|
236 | }
|
237 | Preview.prototype._sendSetStories = function () {
|
238 | var channel = addons_1.default.getChannel();
|
239 | var stories = this._stories.extract();
|
240 | channel.emit(core_events_1.default.SET_STORIES, { stories: stories });
|
241 | channel.emit(core_events_1.default.STORIES_CONFIGURED);
|
242 | };
|
243 | Preview.prototype._getStory = function (storyId) {
|
244 | return this._stories.fromId(storyId);
|
245 | };
|
246 | Preview.prototype._selectStoryEvent = function (_a) {
|
247 | var storyId = _a.storyId;
|
248 | if (storyId) {
|
249 | if (this._asyncStorage) {
|
250 | this._asyncStorage.setItem(STORAGE_KEY, JSON.stringify(storyId)).catch(function () { });
|
251 | }
|
252 | var story = this._getStory(storyId);
|
253 | this._selectStory(story);
|
254 | }
|
255 | };
|
256 | Preview.prototype._selectStory = function (story) {
|
257 | var channel = addons_1.default.getChannel();
|
258 | this._stories.setSelection({ storyId: story.id, viewMode: 'story' }, null);
|
259 | channel.emit(core_events_1.default.SELECT_STORY, story);
|
260 | };
|
261 | Preview.prototype._checkStory = function (storyId) {
|
262 | if (!storyId) {
|
263 | return null;
|
264 | }
|
265 | var story = this._getStory(storyId);
|
266 | if (story.storyFn === null) {
|
267 | return null;
|
268 | }
|
269 | return story;
|
270 | };
|
271 | return Preview;
|
272 | }());
|
273 | exports.default = Preview;
|