@storybook/react-native-ui-common 9.0.0-beta.15

package/dist/index.js

@@ -0,0 +1,812 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var src_exports = {};
+__export(src_exports, {
+  Button: () => Button,
+  ButtonIcon: () => ButtonIcon,
+  ButtonText: () => ButtonText,
+  IconButton: () => IconButton,
+  LayoutProvider: () => LayoutProvider,
+  StorageProvider: () => StorageProvider,
+  createId: () => createId,
+  cycle: () => cycle,
+  get: () => get,
+  getAncestorIds: () => getAncestorIds,
+  getDescendantIds: () => getDescendantIds,
+  getParent: () => getParent,
+  getParents: () => getParents,
+  getPath: () => getPath,
+  getStateType: () => getStateType,
+  intersect: () => intersect,
+  isAncestor: () => isAncestor,
+  isExpandType: () => isExpandType,
+  isStoryHoistable: () => isStoryHoistable,
+  merge: () => merge,
+  noArrayMerge: () => noArrayMerge,
+  prevent: () => prevent,
+  removeNoiseFromName: () => removeNoiseFromName,
+  searchItem: () => searchItem,
+  transformStoryIndexToStoriesHash: () => transformStoryIndexToStoriesHash,
+  transformStoryIndexV2toV3: () => transformStoryIndexV2toV3,
+  transformStoryIndexV3toV4: () => transformStoryIndexV3toV4,
+  transformStoryIndexV4toV5: () => transformStoryIndexV4toV5,
+  useExpanded: () => useExpanded,
+  useLastViewed: () => useLastViewed,
+  useLayout: () => useLayout,
+  useStorage: () => useStorage,
+  useStoreBooleanState: () => useStoreBooleanState,
+  useStyle: () => useStyle
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/Button.tsx
+var import_react_native_theming = require("@storybook/react-native-theming");
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var Button = (0, import_react.forwardRef)(
+  ({
+    Icon,
+    animation = "none",
+    size = "small",
+    variant = "outline",
+    padding = "medium",
+    disabled = false,
+    active = false,
+    onPress,
+    children,
+    text,
+    ...props
+  }, ref) => {
+    const [isAnimating, setIsAnimating] = (0, import_react.useState)(false);
+    const handleClick = (event) => {
+      if (onPress)
+        onPress(event);
+      if (animation === "none")
+        return;
+      setIsAnimating(true);
+    };
+    (0, import_react.useEffect)(() => {
+      const timer = setTimeout(() => {
+        if (isAnimating)
+          setIsAnimating(false);
+      }, 1e3);
+      return () => clearTimeout(timer);
+    }, [isAnimating]);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      StyledButton,
+      {
+        ref,
+        variant,
+        size,
+        padding,
+        disabled,
+        active,
+        animating: isAnimating,
+        animation,
+        onPress: handleClick,
+        ...props,
+        children: [
+          Icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonIcon, { Icon, variant, active }),
+          text && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonText, { variant, active, children: text }),
+          children
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+var StyledButton = import_react_native_theming.styled.TouchableOpacity(({ theme, variant, size, disabled, active, padding }) => ({
+  border: 0,
+  // cursor: disabled ? 'not-allowed' : 'pointer',
+  display: "flex",
+  flexDirection: "row",
+  gap: 6,
+  alignItems: "center",
+  justifyContent: "center",
+  overflow: "hidden",
+  paddingHorizontal: (() => {
+    if (padding === "small" && size === "small")
+      return 7;
+    if (padding === "small" && size === "medium")
+      return 9;
+    if (size === "small")
+      return 10;
+    if (size === "medium")
+      return 12;
+    return 0;
+  })(),
+  paddingVertical: 0,
+  height: size === "small" ? 28 : 32,
+  position: "relative",
+  transitionProperty: "background, box-shadow",
+  transitionDuration: "150ms",
+  transitionTimingFunction: "ease-out",
+  whiteSpace: "nowrap",
+  userSelect: "none",
+  opacity: disabled ? 0.5 : 1,
+  margin: 0,
+  backgroundColor: (() => {
+    if (variant === "solid")
+      return theme.color.secondary;
+    if (variant === "outline")
+      return theme.button.background;
+    if (variant === "ghost" && active)
+      return theme.background.hoverable;
+    return "transparent";
+  })(),
+  boxShadow: variant === "outline" ? `${theme.button.border} 0 0 0 1px inset` : "none",
+  borderRadius: theme.input.borderRadius,
+  // Making sure that the button never shrinks below its minimum size
+  flexShrink: 0
+}));
+var ButtonText = import_react_native_theming.styled.Text(({ theme, variant, active }) => ({
+  color: (() => {
+    if (variant === "solid")
+      return theme.color.lightest;
+    if (variant === "outline")
+      return theme.input.color;
+    if (variant === "ghost" && active)
+      return theme.color.secondary;
+    if (variant === "ghost")
+      return theme.color.mediumdark;
+    return theme.input.color;
+  })(),
+  flexDirection: "row",
+  gap: 6,
+  textAlign: "center",
+  fontSize: theme.typography.size.s1,
+  fontWeight: theme.typography.weight.bold
+}));
+var ButtonIcon = ({
+  Icon,
+  active,
+  variant
+}) => {
+  const theme = (0, import_react_native_theming.useTheme)();
+  const color = (0, import_react.useMemo)(() => {
+    if (variant === "solid")
+      return theme.color.lightest;
+    if (variant === "outline")
+      return theme.input.color;
+    if (variant === "ghost" && active)
+      return theme.color.secondary;
+    if (variant === "ghost")
+      return theme.color.mediumdark;
+    return theme.input.color;
+  }, [
+    active,
+    theme.color.lightest,
+    theme.color.mediumdark,
+    theme.color.secondary,
+    theme.input.color,
+    variant
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { color });
+};
+
+// src/IconButton.tsx
+var import_react2 = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var IconButton = (0, import_react2.forwardRef)(
+  ({ padding = "small", variant = "ghost", ...props }, ref) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Button, { padding, variant, ref, ...props });
+  }
+);
+IconButton.displayName = "IconButton";
+
+// src/LayoutProvider.tsx
+var import_react3 = require("react");
+var import_react_native = require("react-native");
+
+// src/constants.ts
+var BREAKPOINT = 1e3;
+var MEDIA_DESKTOP_BREAKPOINT = `@media (min-width: ${BREAKPOINT}px)`;
+var DEFAULT_REF_ID = "storybook_internal";
+
+// src/LayoutProvider.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var LayoutContext = (0, import_react3.createContext)({
+  isDesktop: false,
+  isMobile: true
+});
+var LayoutProvider = ({ children }) => {
+  const { width } = (0, import_react_native.useWindowDimensions)();
+  const isDesktop = width >= BREAKPOINT;
+  const isMobile = !isDesktop;
+  const contextValue = (0, import_react3.useMemo)(
+    () => ({
+      isDesktop,
+      isMobile
+    }),
+    [isDesktop, isMobile]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(LayoutContext.Provider, { value: contextValue, children });
+};
+var useLayout = () => (0, import_react3.useContext)(LayoutContext);
+
+// src/types.ts
+function isExpandType(x2) {
+  return !!(x2 && x2.showAll);
+}
+
+// src/StorageProvider.tsx
+var import_react4 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var StorageContext = (0, import_react4.createContext)({
+  getItem: async () => null,
+  setItem: async () => {
+  }
+});
+var StorageProvider = ({
+  storage,
+  children
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(StorageContext.Provider, { value: storage, children });
+};
+var useStorage = () => (0, import_react4.useContext)(StorageContext);
+
+// ../../node_modules/@storybook/csf/dist/index.mjs
+var C = Object.create;
+var u = Object.defineProperty;
+var B = Object.getOwnPropertyDescriptor;
+var F = Object.getOwnPropertyNames;
+var h = Object.getPrototypeOf;
+var w = Object.prototype.hasOwnProperty;
+var E = (r, e) => () => (e || r((e = { exports: {} }).exports, e), e.exports);
+var v = (r, e, n, t) => {
+  if (e && typeof e == "object" || typeof e == "function")
+    for (let a of F(e))
+      !w.call(r, a) && a !== n && u(r, a, { get: () => e[a], enumerable: !(t = B(e, a)) || t.enumerable });
+  return r;
+};
+var I = (r, e, n) => (n = r != null ? C(h(r)) : {}, v(e || !r || !r.__esModule ? u(n, "default", { value: r, enumerable: true }) : n, r));
+var x = E((T) => {
+  Object.defineProperty(T, "__esModule", { value: true }), T.isEqual = function() {
+    var r = Object.prototype.toString, e = Object.getPrototypeOf, n = Object.getOwnPropertySymbols ? function(t) {
+      return Object.keys(t).concat(Object.getOwnPropertySymbols(t));
+    } : Object.keys;
+    return function(t, a) {
+      return function i(o, s, p) {
+        var g, y, d, c = r.call(o), b = r.call(s);
+        if (o === s)
+          return true;
+        if (o == null || s == null)
+          return false;
+        if (p.indexOf(o) > -1 && p.indexOf(s) > -1)
+          return true;
+        if (p.push(o, s), c != b || (g = n(o), y = n(s), g.length != y.length || g.some(function(A) {
+          return !i(o[A], s[A], p);
+        })))
+          return false;
+        switch (c.slice(8, -1)) {
+          case "Symbol":
+            return o.valueOf() == s.valueOf();
+          case "Date":
+          case "Number":
+            return +o == +s || +o != +o && +s != +s;
+          case "RegExp":
+          case "Function":
+          case "String":
+          case "Boolean":
+            return "" + o == "" + s;
+          case "Set":
+          case "Map":
+            g = o.entries(), y = s.entries();
+            do
+              if (!i((d = g.next()).value, y.next().value, p))
+                return false;
+            while (!d.done);
+            return true;
+          case "ArrayBuffer":
+            o = new Uint8Array(o), s = new Uint8Array(s);
+          case "DataView":
+            o = new Uint8Array(o.buffer), s = new Uint8Array(s.buffer);
+          case "Float32Array":
+          case "Float64Array":
+          case "Int8Array":
+          case "Int16Array":
+          case "Int32Array":
+          case "Uint8Array":
+          case "Uint16Array":
+          case "Uint32Array":
+          case "Uint8ClampedArray":
+          case "Arguments":
+          case "Array":
+            if (o.length != s.length)
+              return false;
+            for (d = 0; d < o.length; d++)
+              if ((d in o || d in s) && (d in o != d in s || !i(o[d], s[d], p)))
+                return false;
+            return true;
+          case "Object":
+            return i(e(o), e(s), p);
+          default:
+            return false;
+        }
+      }(t, a, []);
+    };
+  }();
+});
+var l = I(x());
+var O = (r) => r.toLowerCase().replace(/[ ’–—―′¿'`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, "-").replace(/-+/g, "-").replace(/^-+/, "").replace(/-+$/, "");
+
+// src/util/StoryHash.ts
+var import_ts_dedent = require("ts-dedent");
+var import_client_logger = require("storybook/internal/client-logger");
+var import_es_toolkit = require("es-toolkit");
+var intersect = (a, b) => {
+  if (!Array.isArray(a) || !Array.isArray(b) || !a.length || !b.length) {
+    return [];
+  }
+  return a.reduce((acc, aValue) => {
+    if (b.includes(aValue)) {
+      acc.push(aValue);
+    }
+    return acc;
+  }, []);
+};
+var merge = (a, ...b) => {
+  let target = {};
+  target = (0, import_es_toolkit.mergeWith)(
+    {},
+    a,
+    (objValue, srcValue) => {
+      if (Array.isArray(srcValue) && Array.isArray(objValue)) {
+        srcValue.forEach((s) => {
+          const existing = objValue.find((o) => o === s || (0, import_es_toolkit.isEqual)(o, s));
+          if (!existing) {
+            objValue.push(s);
+          }
+        });
+        return objValue;
+      }
+      if (Array.isArray(objValue)) {
+        import_client_logger.logger.log(["the types mismatch, picking", objValue]);
+        return objValue;
+      }
+    }
+  );
+  for (const obj of b) {
+    target = (0, import_es_toolkit.mergeWith)(target, obj, (objValue, srcValue) => {
+      if (Array.isArray(srcValue) && Array.isArray(objValue)) {
+        srcValue.forEach((s) => {
+          const existing = objValue.find((o) => o === s || (0, import_es_toolkit.isEqual)(o, s));
+          if (!existing) {
+            objValue.push(s);
+          }
+        });
+        return objValue;
+      }
+      if (Array.isArray(objValue)) {
+        import_client_logger.logger.log(["the types mismatch, picking", objValue]);
+        return objValue;
+      }
+    });
+  }
+  return target;
+};
+var noArrayMerge = (a, ...b) => {
+  let target = {};
+  target = (0, import_es_toolkit.mergeWith)(
+    {},
+    a,
+    (objValue, srcValue) => {
+      if (Array.isArray(srcValue)) {
+        return srcValue;
+      }
+    }
+  );
+  for (const obj of b) {
+    target = (0, import_es_toolkit.mergeWith)(target, obj, (objValue, srcValue) => {
+      if (Array.isArray(srcValue)) {
+        return srcValue;
+      }
+    });
+  }
+  return target;
+};
+var TITLE_PATH_SEPARATOR = /\s*\/\s*/;
+var transformStoryIndexToStoriesHash = (input, { provider, docsOptions, filters, allStatuses }) => {
+  if (!input.v) {
+    throw new Error("Composition: Missing stories.json version");
+  }
+  let index = input;
+  index = index.v === 2 ? transformStoryIndexV2toV3(index) : index;
+  index = index.v === 3 ? transformStoryIndexV3toV4(index) : index;
+  index = index.v === 4 ? transformStoryIndexV4toV5(index) : index;
+  index = index;
+  const entryValues = Object.values(index.entries).filter((entry) => {
+    let result = true;
+    const storyStatuses = allStatuses[entry.id] ?? {};
+    if (Object.values(storyStatuses).some(({ value }) => value === "status-value:error")) {
+      return result;
+    }
+    Object.values(filters).forEach((filter) => {
+      if (result === false) {
+        return;
+      }
+      result = filter({ ...entry, statuses: storyStatuses });
+    });
+    return result;
+  });
+  const { sidebar = {} } = provider.getConfig();
+  const { showRoots, collapsedRoots = [], renderLabel } = sidebar;
+  const setShowRoots = typeof showRoots !== "undefined";
+  const storiesHashOutOfOrder = entryValues.reduce((acc, item) => {
+    if (docsOptions.docsMode && item.type !== "docs") {
+      return acc;
+    }
+    const { title } = item;
+    const groups = title.trim().split(TITLE_PATH_SEPARATOR);
+    const root = (!setShowRoots || showRoots) && groups.length > 1 ? [groups.shift()] : [];
+    const names = [...root, ...groups];
+    const paths = names.reduce((list, name, idx) => {
+      const parent = idx > 0 && list[idx - 1];
+      const id = O(parent ? `${parent}-${name}` : name);
+      if (name.trim() === "") {
+        throw new Error(import_ts_dedent.dedent`Invalid title ${title} ending in slash.`);
+      }
+      if (parent === id) {
+        throw new Error(
+          import_ts_dedent.dedent`
+          Invalid part '${name}', leading to id === parentId ('${id}'), inside title '${title}'
+
+          Did you create a path that uses the separator char accidentally, such as 'Vue <docs/>' where '/' is a separator char? See https://github.com/storybookjs/storybook/issues/6128
+          `
+        );
+      }
+      list.push(id);
+      return list;
+    }, []);
+    paths.forEach((id, idx) => {
+      const childId = paths[idx + 1] || item.id;
+      if (root.length && idx === 0) {
+        acc[id] = merge(acc[id] || {}, {
+          type: "root",
+          id,
+          name: names[idx],
+          tags: [],
+          depth: idx,
+          renderLabel,
+          startCollapsed: collapsedRoots.includes(id),
+          // Note that this will later get appended to the previous list of children (see below)
+          children: [childId]
+        });
+      } else if ((!acc[id] || acc[id].type === "component") && idx === paths.length - 1) {
+        acc[id] = merge(acc[id] || {}, {
+          type: "component",
+          id,
+          name: names[idx],
+          tags: [],
+          parent: paths[idx - 1],
+          depth: idx,
+          renderLabel,
+          ...childId && {
+            children: [childId]
+          }
+        });
+      } else {
+        acc[id] = merge(acc[id] || {}, {
+          type: "group",
+          id,
+          name: names[idx],
+          tags: [],
+          parent: paths[idx - 1],
+          depth: idx,
+          renderLabel,
+          ...childId && {
+            children: [childId]
+          }
+        });
+      }
+    });
+    acc[item.id] = {
+      type: "story",
+      tags: [],
+      ...item,
+      depth: paths.length,
+      parent: paths[paths.length - 1],
+      renderLabel,
+      prepared: !!item.parameters
+    };
+    return acc;
+  }, {});
+  function addItem(acc, item) {
+    if (acc[item.id]) {
+      return acc;
+    }
+    acc[item.id] = item;
+    if (item.type === "root" || item.type === "group" || item.type === "component") {
+      item.children.forEach((childId) => addItem(acc, storiesHashOutOfOrder[childId]));
+      item.tags = item.children.reduce((currentTags, childId) => {
+        const child = acc[childId];
+        return currentTags === null ? child.tags : intersect(currentTags, child.tags);
+      }, null);
+    }
+    return acc;
+  }
+  const orphanHash = Object.values(storiesHashOutOfOrder).filter((i) => i.type !== "root" && !i.parent).reduce(addItem, {});
+  return Object.values(storiesHashOutOfOrder).filter((i) => i.type === "root").reduce(addItem, orphanHash);
+};
+var transformStoryIndexV2toV3 = (index) => {
+  return {
+    v: 3,
+    stories: Object.values(index.stories).reduce(
+      (acc, entry) => {
+        acc[entry.id] = {
+          ...entry,
+          title: entry.kind,
+          name: entry.name || entry.story,
+          importPath: entry.parameters.fileName || ""
+        };
+        return acc;
+      },
+      {}
+    )
+  };
+};
+var transformStoryIndexV3toV4 = (index) => {
+  const countByTitle = (0, import_es_toolkit.countBy)(Object.values(index.stories), (item) => item.title);
+  return {
+    v: 4,
+    entries: Object.values(index.stories).reduce(
+      (acc, entry) => {
+        let type = "story";
+        if (entry.parameters?.docsOnly || entry.name === "Page" && countByTitle[entry.title] === 1) {
+          type = "docs";
+        }
+        acc[entry.id] = {
+          type,
+          ...type === "docs" && { tags: ["stories-mdx"], storiesImports: [] },
+          ...entry
+        };
+        delete acc[entry.id].story;
+        delete acc[entry.id].kind;
+        return acc;
+      },
+      {}
+    )
+  };
+};
+var transformStoryIndexV4toV5 = (index) => {
+  return {
+    v: 5,
+    entries: Object.values(index.entries).reduce(
+      (acc, entry) => {
+        acc[entry.id] = {
+          ...entry,
+          tags: entry.tags ? ["dev", "test", ...entry.tags] : ["dev"]
+        };
+        return acc;
+      },
+      {}
+    )
+  };
+};
+
+// src/util/tree.ts
+var import_memoizerific = __toESM(require("memoizerific"));
+var createId = (itemId, refId) => !refId || refId === DEFAULT_REF_ID ? itemId : `${refId}_${itemId}`;
+var prevent = (e) => {
+  e.preventDefault();
+  return false;
+};
+var get = (0, import_memoizerific.default)(1e3)((id, dataset) => dataset[id]);
+var getParent = (0, import_memoizerific.default)(1e3)((id, dataset) => {
+  const item = get(id, dataset);
+  return item && item.type !== "root" ? get(item.parent, dataset) : void 0;
+});
+var getParents = (0, import_memoizerific.default)(1e3)((id, dataset) => {
+  const parent = getParent(id, dataset);
+  return parent ? [parent, ...getParents(parent.id, dataset)] : [];
+});
+var getAncestorIds = (0, import_memoizerific.default)(1e3)(
+  (data, id) => getParents(id, data).map((item) => item.id)
+);
+var getDescendantIds = (0, import_memoizerific.default)(1e3)((data, id, skipLeafs) => {
+  const entry = data[id];
+  const children = entry.type === "story" || entry.type === "docs" ? [] : entry.children;
+  return children.reduce((acc, childId) => {
+    const child = data[childId];
+    if (!child || skipLeafs && (child.type === "story" || child.type === "docs"))
+      return acc;
+    acc.push(childId, ...getDescendantIds(data, childId, skipLeafs));
+    return acc;
+  }, []);
+});
+function getPath(item, ref) {
+  const parent = item.type !== "root" && item.parent ? ref.index[item.parent] : null;
+  if (parent)
+    return [...getPath(parent, ref), parent.name];
+  return ref.id === DEFAULT_REF_ID ? [] : [ref.title || ref.id];
+}
+var searchItem = (item, ref) => {
+  return { ...item, refId: ref.id, path: getPath(item, ref) };
+};
+function cycle(array, index, delta) {
+  let next = index + delta % array.length;
+  if (next < 0)
+    next = array.length + next;
+  if (next >= array.length)
+    next -= array.length;
+  return next;
+}
+var getStateType = (isLoading, isAuthRequired, isError, isEmpty) => {
+  switch (true) {
+    case isAuthRequired:
+      return "auth";
+    case isError:
+      return "error";
+    case isLoading:
+      return "loading";
+    case isEmpty:
+      return "empty";
+    default:
+      return "ready";
+  }
+};
+var isAncestor = (element, maybeAncestor) => {
+  if (!element || !maybeAncestor)
+    return false;
+  if (element === maybeAncestor)
+    return true;
+  return isAncestor(element.parentElement, maybeAncestor);
+};
+var removeNoiseFromName = (storyName) => storyName.replaceAll(/(\s|-|_)/gi, "");
+var isStoryHoistable = (storyName, componentName) => removeNoiseFromName(storyName) === removeNoiseFromName(componentName);
+
+// src/util/useStyle.ts
+var import_react5 = require("react");
+var useStyle = (styleFactory, deps) => (
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  (0, import_react5.useMemo)(styleFactory, deps)
+);
+
+// src/hooks/useExpanded.ts
+var import_react6 = require("react");
+var initializeExpanded = ({
+  initialExpanded,
+  rootIds
+}) => {
+  const highlightedAncestors = [];
+  return [...rootIds, ...highlightedAncestors].reduce(
+    (acc, id) => Object.assign(acc, { [id]: id in initialExpanded ? initialExpanded[id] : true }),
+    {}
+  );
+};
+var useExpanded = ({
+  refId,
+  data,
+  initialExpanded,
+  rootIds,
+  selectedStoryId
+}) => {
+  const [expanded, setExpanded] = (0, import_react6.useReducer)(
+    (state, { ids, value }) => ids.reduce((acc, id) => Object.assign(acc, { [id]: value }), { ...state }),
+    { refId, data, rootIds, initialExpanded },
+    initializeExpanded
+  );
+  const updateExpanded = (0, import_react6.useCallback)(({ ids, value }) => {
+    setExpanded({ ids, value });
+  }, []);
+  (0, import_react6.useEffect)(() => {
+    setExpanded({ ids: getAncestorIds(data, selectedStoryId), value: true });
+  }, [data, selectedStoryId]);
+  return [expanded, updateExpanded];
+};
+
+// src/hooks/useLastViewed.ts
+var import_react7 = require("react");
+var useLastViewed = (selection) => {
+  const lastViewedRef = (0, import_react7.useRef)([]);
+  const updateLastViewed = (0, import_react7.useCallback)(
+    (story) => {
+      const items = lastViewedRef.current;
+      const index = items.findIndex(
+        ({ storyId, refId }) => storyId === story.storyId && refId === story.refId
+      );
+      if (index === 0)
+        return;
+      if (index === -1) {
+        lastViewedRef.current = [story, ...items];
+      } else {
+        lastViewedRef.current = [story, ...items.slice(0, index), ...items.slice(index + 1)];
+      }
+    },
+    [lastViewedRef]
+  );
+  (0, import_react7.useEffect)(() => {
+    if (selection)
+      updateLastViewed(selection);
+  }, [selection]);
+  return {
+    getLastViewed: (0, import_react7.useCallback)(() => lastViewedRef.current, [lastViewedRef]),
+    clearLastViewed: (0, import_react7.useCallback)(() => {
+      lastViewedRef.current = lastViewedRef.current.slice(0, 1);
+    }, [lastViewedRef])
+  };
+};
+
+// src/hooks/useStoreState.ts
+var import_react8 = require("react");
+var useStoreBooleanState = (key, defaultValue) => {
+  const storage = useStorage();
+  const [val, setVal] = (0, import_react8.useState)(defaultValue);
+  (0, import_react8.useEffect)(() => {
+    storage.getItem(key).then((newVal) => {
+      if (newVal === null || newVal === void 0) {
+        setVal(defaultValue);
+      } else {
+        setVal(newVal === "true");
+      }
+    });
+  }, [key, storage, defaultValue]);
+  (0, import_react8.useEffect)(() => {
+    storage.setItem(key, val.toString());
+  }, [key, storage, val]);
+  return [val, setVal];
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Button,
+  ButtonIcon,
+  ButtonText,
+  IconButton,
+  LayoutProvider,
+  StorageProvider,
+  createId,
+  cycle,
+  get,
+  getAncestorIds,
+  getDescendantIds,
+  getParent,
+  getParents,
+  getPath,
+  getStateType,
+  intersect,
+  isAncestor,
+  isExpandType,
+  isStoryHoistable,
+  merge,
+  noArrayMerge,
+  prevent,
+  removeNoiseFromName,
+  searchItem,
+  transformStoryIndexToStoriesHash,
+  transformStoryIndexV2toV3,
+  transformStoryIndexV3toV4,
+  transformStoryIndexV4toV5,
+  useExpanded,
+  useLastViewed,
+  useLayout,
+  useStorage,
+  useStoreBooleanState,
+  useStyle
+});