@aussieljk/forkbook 0.0.1-6 → 0.0.1-7

package/dist/manager/_manager-chunks/{runtime-DrTLBe7a.js → runtime-D-nYLsdk.js}

@@ -1,9 +1,9 @@
-import { n as __esmMin, o as __toESM } from "./runtime-EITvVbkG.js";
-import { At as shortcutMatchesShortcut, Ba as CHANNEL_WS_DISCONNECT, Er as GithubLogoIcon, Et as init_manager_api, G as ScrollArea, H as Loader, Ir as HeartIcon, Mt as types, Na as XCircleIcon, Pa as XIcon, Pn as CheckIcon, Qa as init_channels, R as ForkbookLogo, Ra as init_react, Rn as CircleIcon, Rt as useStorybookApi, So as useState, V as Link, Xa as init_core_events, Za as createBrowserChannel, _ as Route, _t as useTheme, a as init_types, at as TooltipProvider, bt as addons, dr as FileTextIcon, dt as color, eo as Component, fo as useCallback, ho as useEffect, ht as init_theming, i as REVIEW_STATUS_TYPE_ID, j as Button, jt as shortcutToHumanString, ka as WarningIcon, lo as init__storybook_global_react, m as Location, n as CHANGE_DETECTION_STATUS_TYPE_ID, no as _storybook_global_react_default, or as EyeIcon, r as NON_AGGREGATED_STATUS_TYPE_IDS, rt as Tooltip, sr as EyeSlashIcon, st as init_components, t as Addon_TypesEnum, to as Fragment, tt as TabsView, v as init_router, vt as Consumer, xt as eventToShortcut, yo as useMemo, z as Form, za as CHANNEL_CREATED, zt as useStorybookState } from "./runtime-MAf7Wpk5.js";
-import { A as useCopyButton, B as init_global, F as ToolbarManager, I as init_ToolbarManager, L as TOOLBAR_ID, R as init_constants, k as init_useCopyButton, z as global } from "./runtime-BgYvp1WN.js";
-import { a as curriedTransparentize$1, o as init_polished_esm, s as require_memoizerific } from "./runtime-CHI-LHF1.js";
-import { c as UseSymbol, d as menuTool, f as UpgradeBlock, i as init_Sidebar, l as init_IconSymbols, n as renderStorybookUI, p as init_UpgradeBlock, t as init_manager, u as init_menu } from "./runtime-CUymj6EY.js";
-import { c as init_clsx, s as clsx } from "./runtime-D4ZOOIV0.js";
+import { a as __toESM, n as __esmMin } from "./runtime-BdGkqNEt.js";
+import { $ as ScrollArea, Bn as WarningIcon, Bt as types, Cn as GithubLogoIcon, Ct as init_theming, Dr as useState, Et as Consumer, Gn as CHANNEL_WS_DISCONNECT, Hn as XIcon, K as ForkbookLogo, Kt as useStorybookApi, Ot as addons, Pt as init_manager_api, Rt as shortcutMatchesShortcut, T as init_router, Tn as HeartIcon, Tt as useTheme, Un as init_react, Vn as XCircleIcon, Wn as CHANNEL_CREATED, X as Loader, Y as Link, _n as EyeSlashIcon, _r as useCallback, a as init_types, ar as Component, br as useEffect, cn as CheckIcon, dt as Tooltip, gn as EyeIcon, ht as init_components, i as REVIEW_STATUS_TYPE_ID, kt as eventToShortcut, lt as TabsView, mr as init__storybook_global_react, n as CHANGE_DETECTION_STATUS_TYPE_ID, nr as createBrowserChannel, or as Fragment, pt as TooltipProvider, q as Form, qt as useStorybookState, r as NON_AGGREGATED_STATUS_TYPE_IDS, rr as init_channels, sr as _storybook_global_react_default, t as Addon_TypesEnum, tr as init_core_events, un as CircleIcon, vn as FileTextIcon, w as Route, wr as useMemo, x as Location, yt as color, z as Button, zt as shortcutToHumanString } from "./runtime-BM30BmeT.js";
+import { F as init_ToolbarManager, I as TOOLBAR_ID, L as init_constants, O as init_useCopyButton, P as ToolbarManager, R as global, k as useCopyButton, z as init_global } from "./runtime-DvrwKw7z.js";
+import { a as curriedTransparentize$1, o as init_polished_esm, s as require_memoizerific } from "./runtime-B4U0u9p4.js";
+import { c as UseSymbol, d as menuTool, f as UpgradeBlock, i as init_Sidebar, l as init_IconSymbols, n as renderStorybookUI, p as init_UpgradeBlock, t as init_manager, u as init_menu } from "./runtime-ecY5qnmo.js";
+import { c as init_clsx, s as clsx } from "./runtime-Cf0p9DUx.js";
 //#region src/manager/utils/tree.ts
 function getPath(item, ref) {
 	const parent = item.type !== "root" && item.parent ? ref.index[item.parent] : null;
@@ -16,7 +16,7 @@ function cycle(array, index, delta) {
 	if (next >= array.length) next -= array.length;
 	return next;
 }
-var import_memoizerific$1, document$3, globalWindow, createId, getLink, get, getParent, getParents, getAncestorIds, getDescendantIds, searchItem, scrollIntoView, getStateType, isAncestor, removeNoiseFromName, isStoryHoistable;
+var import_memoizerific$1, document$3, globalWindow, createId, getLink, get, getParent, getParents, getAncestorIds, getDescendantIds, searchItem, scrollIntoView, getStateType, isAncestor, removeNoiseFromName, isStoryHoistable, getHoistedComponents;
 function init_tree() {
 	return (init_tree = __esmMin((() => {
 		init_global();
@@ -76,6 +76,30 @@ function init_tree() {
 		};
 		removeNoiseFromName = (storyName) => storyName.replaceAll(/(\s|-|_)/gi, "");
 		isStoryHoistable = (storyName, componentName) => removeNoiseFromName(storyName) === removeNoiseFromName(componentName);
+		getHoistedComponents = (data) => {
+			const hoisted = {};
+			const hiddenIds = [];
+			Object.values(data).forEach((entry) => {
+				if (entry.type !== "component") return;
+				const children = (entry.children ?? []).map((id) => data[id]).filter(Boolean);
+				const stories = children.filter((child) => child.type === "story");
+				const docs = children.filter((child) => child.type === "docs");
+				if (children.length === 1 && docs.length === 1) {
+					hoisted[entry.id] = docs[0].id;
+					return;
+				}
+				const [story] = stories;
+				const autodocs = docs.filter((child) => child.tags?.includes("autodocs"));
+				if (stories.length === 1 && story.type === "story" && story.subtype === "story" && docs.length === autodocs.length && children.length === 1 + docs.length && docs.length <= 1 && isStoryHoistable(story.name, entry.name)) {
+					hoisted[entry.id] = story.id;
+					hiddenIds.push(...docs.map((child) => child.id));
+				}
+			});
+			return {
+				hoisted,
+				hiddenIds
+			};
+		};
 	})))();
 }
 //#endregion
@@ -352,10 +376,10 @@ function init_About_module() {
 			document.head.appendChild(style);
 		}
 		About_module_default = {
-			"header": "fb-v5QLGG-header",
+			"actions": "fb-v5QLGG-actions",
 			"footer": "fb-v5QLGG-footer",
 			"container": "fb-v5QLGG-container",
-			"actions": "fb-v5QLGG-actions",
+			"header": "fb-v5QLGG-header",
 			"link": "fb-v5QLGG-link"
 		};
 	})))();
@@ -480,16 +504,16 @@ function init_shortcuts_module() {
 		}
 		shortcuts_module_default = {
 			"successIcon": "fb-5Bi54W-successIcon",
-			"row": "fb-5Bi54W-row",
-			"headerItem": "fb-5Bi54W-headerItem",
-			"textInput": "fb-5Bi54W-textInput",
 			"container": "fb-5Bi54W-container",
-			"jiggle": "fb-5Bi54W-jiggle",
-			"gridHeaderRow": "fb-5Bi54W-gridHeaderRow",
 			"description": "fb-5Bi54W-description",
 			"header": "fb-5Bi54W-header",
+			"jiggle": "fb-5Bi54W-jiggle",
+			"fade": "fb-5Bi54W-fade",
+			"row": "fb-5Bi54W-row",
+			"textInput": "fb-5Bi54W-textInput",
+			"headerItem": "fb-5Bi54W-headerItem",
 			"gridWrapper": "fb-5Bi54W-gridWrapper",
-			"fade": "fb-5Bi54W-fade"
+			"gridHeaderRow": "fb-5Bi54W-gridHeaderRow"
 		};
 	})))();
 }
@@ -694,10 +718,10 @@ function init_whats_new_module() {
 		whats_new_module_default = {
 			"footer": "fb-wRVF8a-footer",
 			"iframe": "fb-wRVF8a-iframe",
-			"centered": "fb-wRVF8a-centered",
 			"loaderWrapper": "fb-wRVF8a-loaderWrapper",
-			"message": "fb-wRVF8a-message",
-			"alertIcon": "fb-wRVF8a-alertIcon"
+			"alertIcon": "fb-wRVF8a-alertIcon",
+			"centered": "fb-wRVF8a-centered",
+			"message": "fb-wRVF8a-message"
 		};
 	})))();
 }
@@ -975,4 +999,4 @@ function init_runtime() {
 	})))();
 }
 //#endregion
-export { getStateType as C, scrollIntoView as D, isStoryHoistable as E, searchItem as O, getLink as S, isAncestor as T, statusPriority as _, init_provider as a, getAncestorIds as b, matchesModifiers as c, getGroupStatus as d, getMostCriticalStatusValue as f, shouldShowChangeStatus as g, init_status as h, Provider as i, getChangeDetectionStatus as l, getStatus as m, init_settings as n, init_keybinding as o, getSidebarVisibleStatus as p, settingsPageAddon as r, matchesKeyCode as s, init_runtime as t, getGroupDualStatus as u, createId as v, init_tree as w, getDescendantIds as x, cycle as y };
+export { getLink as C, scrollIntoView as D, isAncestor as E, searchItem as O, getHoistedComponents as S, init_tree as T, statusPriority as _, init_provider as a, getAncestorIds as b, matchesModifiers as c, getGroupStatus as d, getMostCriticalStatusValue as f, shouldShowChangeStatus as g, init_status as h, Provider as i, getChangeDetectionStatus as l, getStatus as m, init_settings as n, init_keybinding as o, getSidebarVisibleStatus as p, settingsPageAddon as r, matchesKeyCode as s, init_runtime as t, getGroupDualStatus as u, createId as v, getStateType as w, getDescendantIds as x, cycle as y };

package/dist/manager/_manager-chunks/runtime-D09XMY6V.js

@@ -0,0 +1,294 @@
+import { n as __esmMin } from "./runtime-BdGkqNEt.js";
+import { Er as useRef, Kt as useStorybookApi, Pt as init_manager_api, Ut as useGlobals, Wt as useParameter, _r as useCallback, br as useEffect, mr as init__storybook_global_react, wr as useMemo } from "./runtime-BM30BmeT.js";
+//#region src/viewport/constants.ts
+var ADDON_ID, PARAM_KEY, RESPONSIVE_VIEWPORT_VALUE;
+function init_constants() {
+	return (init_constants = __esmMin((() => {
+		ADDON_ID = "@aussieljk/forkbook/viewport";
+		PARAM_KEY = "viewport";
+		RESPONSIVE_VIEWPORT_VALUE = "100pct-100pct";
+	})))();
+}
+//#endregion
+//#region src/viewport/defaults.ts
+var MINIMAL_VIEWPORTS;
+function init_defaults() {
+	return (init_defaults = __esmMin((() => {
+		MINIMAL_VIEWPORTS = {
+			mobile1: {
+				name: "Small mobile",
+				styles: {
+					height: "568px",
+					width: "320px"
+				},
+				type: "mobile"
+			},
+			mobile2: {
+				name: "Large mobile",
+				styles: {
+					height: "896px",
+					width: "414px"
+				},
+				type: "mobile"
+			},
+			tablet: {
+				name: "Tablet",
+				styles: {
+					height: "1112px",
+					width: "834px"
+				},
+				type: "tablet"
+			},
+			desktop: {
+				name: "Desktop",
+				styles: {
+					height: "1024px",
+					width: "1280px"
+				},
+				type: "desktop"
+			}
+		};
+	})))();
+}
+//#endregion
+//#region src/viewport/resolveViewport.ts
+var URL_VALUE_PATTERN, normalizeGlobal$1, resolveViewport;
+function init_resolveViewport() {
+	return (init_resolveViewport = __esmMin((() => {
+		init_constants();
+		URL_VALUE_PATTERN = /^([0-9]{1,4})([a-z]{0,4})-([0-9]{1,4})([a-z]{0,4})$/;
+		normalizeGlobal$1 = (value, defaultIsRotated) => typeof value === "string" ? {
+			value,
+			isRotated: defaultIsRotated
+		} : {
+			value: value?.value,
+			isRotated: value?.isRotated ?? defaultIsRotated
+		};
+		resolveViewport = ({ globals, storyGlobals, userGlobals, options, lastSelectedOption, disable = false, viewMode }) => {
+			if (viewMode !== "story") return {
+				name: "Responsive",
+				type: "desktop",
+				width: "100%",
+				height: "100%",
+				value: RESPONSIVE_VIEWPORT_VALUE,
+				option: void 0,
+				isCustom: false,
+				isDefault: true,
+				isLocked: true,
+				isRotated: false
+			};
+			const global = normalizeGlobal$1(globals?.[PARAM_KEY]);
+			const userGlobal = normalizeGlobal$1(userGlobals?.[PARAM_KEY]);
+			const storyGlobal = normalizeGlobal$1(storyGlobals?.[PARAM_KEY]);
+			const storyHasViewport = PARAM_KEY in storyGlobals;
+			const primaryGlobal = storyHasViewport ? storyGlobal : userGlobal;
+			const secondaryGlobal = storyHasViewport ? userGlobal : storyGlobal;
+			const value = primaryGlobal?.value ?? secondaryGlobal?.value ?? global?.value;
+			const isRotated = primaryGlobal?.isRotated ?? secondaryGlobal?.isRotated ?? global?.isRotated ?? false;
+			const keys = Object.keys(options);
+			const isLocked = disable || "viewport" in storyGlobals || !keys.length;
+			const [match, vx, ux, vy, uy] = value?.match(URL_VALUE_PATTERN) || [];
+			if (match) {
+				const x = ux && ux !== "px" ? vx : Math.max(Number(vx), 40);
+				const y = uy && uy !== "px" ? vy : Math.max(Number(vy), 40);
+				const width = `${x}${ux === "pct" ? "%" : ux || "px"}`;
+				const height = `${y}${uy === "pct" ? "%" : uy || "px"}`;
+				const selection = lastSelectedOption ? options[lastSelectedOption] : void 0;
+				return {
+					name: selection?.name ?? "Custom",
+					type: selection?.type ?? "other",
+					width: isRotated ? height : width,
+					height: isRotated ? width : height,
+					value: match,
+					option: void 0,
+					isCustom: true,
+					isDefault: false,
+					isLocked,
+					isRotated
+				};
+			}
+			if (value && keys.length) {
+				const { name, styles, type = "other" } = options[value] ?? options[keys[0]];
+				return {
+					name,
+					type,
+					width: isRotated ? styles.height : styles.width,
+					height: isRotated ? styles.width : styles.height,
+					value,
+					option: value,
+					isCustom: false,
+					isDefault: false,
+					isLocked,
+					isRotated
+				};
+			}
+			return {
+				name: "Responsive",
+				type: "desktop",
+				width: "100%",
+				height: "100%",
+				value: RESPONSIVE_VIEWPORT_VALUE,
+				option: void 0,
+				isCustom: false,
+				isDefault: true,
+				isLocked,
+				isRotated: false
+			};
+		};
+	})))();
+}
+//#endregion
+//#region src/viewport/useViewport.ts
+var cycle, normalizeGlobal, useViewport;
+function init_useViewport() {
+	return (init_useViewport = __esmMin((() => {
+		init__storybook_global_react();
+		init_manager_api();
+		init_constants();
+		init_defaults();
+		init_resolveViewport();
+		cycle = (viewports, current, direction = 1) => {
+			const keys = Object.keys(viewports);
+			const nextIndex = (current ? keys.indexOf(current) : -1) + direction;
+			return nextIndex < 0 ? keys[keys.length - 1] : nextIndex >= keys.length ? keys[0] : keys[nextIndex];
+		};
+		normalizeGlobal = (value, defaultIsRotated) => typeof value === "string" ? {
+			value,
+			isRotated: defaultIsRotated
+		} : {
+			value: value?.value,
+			isRotated: value?.isRotated ?? defaultIsRotated
+		};
+		useViewport = () => {
+			const api = useStorybookApi();
+			const { viewMode } = api.getUrlState();
+			const lastSelectedOption = useRef();
+			const parameter = useParameter(PARAM_KEY);
+			const [globals, updateGlobals, storyGlobals, userGlobals] = useGlobals();
+			const { options = MINIMAL_VIEWPORTS, disable = false } = parameter || {};
+			const { name, type, width, height, value, option, isCustom, isDefault, isLocked, isRotated } = resolveViewport({
+				globals,
+				storyGlobals,
+				userGlobals,
+				options,
+				lastSelectedOption: lastSelectedOption.current,
+				disable,
+				viewMode
+			});
+			const update = useCallback((input) => updateGlobals({ [PARAM_KEY]: normalizeGlobal(input, false) }), [updateGlobals]);
+			const resize = useCallback((width, height) => {
+				const w = width.replace(/px$/, "").replace(/%$/, "pct");
+				const h = height.replace(/px$/, "").replace(/%$/, "pct");
+				const value = isRotated ? `${h}-${w}` : `${w}-${h}`;
+				update({
+					value,
+					isRotated
+				});
+			}, [update, isRotated]);
+			useEffect(() => {
+				if (!parameter) return;
+				if (option) {
+					if (Object.hasOwn(options, option)) lastSelectedOption.current = option;
+					else {
+						lastSelectedOption.current = void 0;
+						if (!("viewport" in storyGlobals)) update({
+							value: void 0,
+							isRotated: false
+						});
+					}
+				}
+			}, [
+				parameter,
+				storyGlobals,
+				options,
+				option,
+				update
+			]);
+			useEffect(() => {
+				api.setAddonShortcut(ADDON_ID, {
+					label: "Next viewport",
+					defaultShortcut: ["alt", "V"],
+					actionName: "next",
+					action: () => update({
+						value: cycle(options, lastSelectedOption.current),
+						isRotated
+					})
+				});
+				api.setAddonShortcut(ADDON_ID, {
+					label: "Previous viewport",
+					defaultShortcut: [
+						"alt",
+						"shift",
+						"V"
+					],
+					actionName: "previous",
+					action: () => update({
+						value: cycle(options, lastSelectedOption.current, -1),
+						isRotated
+					})
+				});
+				api.setAddonShortcut(ADDON_ID, {
+					label: "Reset viewport",
+					defaultShortcut: [
+						"alt",
+						"control",
+						"V"
+					],
+					actionName: "reset",
+					action: () => update({
+						value: void 0,
+						isRotated: false
+					})
+				});
+			}, [
+				api,
+				update,
+				options,
+				isRotated
+			]);
+			return useMemo(() => ({
+				name,
+				type,
+				width,
+				height,
+				value,
+				option,
+				isCustom,
+				isDefault,
+				isLocked,
+				isRotated,
+				options,
+				lastSelectedOption: lastSelectedOption.current,
+				resize,
+				reset: () => update({
+					value: void 0,
+					isRotated: false
+				}),
+				rotate: () => update({
+					value,
+					isRotated: !isRotated
+				}),
+				select: (value) => update({
+					value,
+					isRotated
+				})
+			}), [
+				name,
+				type,
+				width,
+				height,
+				value,
+				option,
+				isCustom,
+				isDefault,
+				isRotated,
+				isLocked,
+				options,
+				resize,
+				update
+			]);
+		};
+	})))();
+}
+//#endregion
+export { init_constants as a, RESPONSIVE_VIEWPORT_VALUE as i, useViewport as n, init_resolveViewport as r, init_useViewport as t };