@mui/internal-docs-infra 0.1.1-canary.9 → 0.2.0-alpha.1

package/esm/useDemo/index.js

@@ -1,104 +1,6 @@
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import * as React from 'react';
-import { Fragment, jsx, jsxs } from 'react/jsx-runtime';
-import { toText } from 'hast-util-to-text';
-import { toJsxRuntime } from 'hast-util-to-jsx-runtime';
-import kebabCase from 'kebab-case';
-import { useCopier } from "../useCopier/index.js";
-function toComponent(source) {
-  return toJsxRuntime(source, {
-    Fragment: Fragment,
-    jsx: jsx,
-    jsxs: jsxs
-  });
-}
-export function useDemo(demo, opts) {
-  var _ref = opts || {},
-    copyOpts = _ref.copy,
-    _ref$defaultOpen = _ref.defaultOpen,
-    defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen;
-  var slug = React.useMemo(function () {
-    return demo.slug || (demo.name ? kebabCase(demo.name, false) : undefined);
-  }, [demo.slug, demo.name]);
-  var _React$useState = React.useState(defaultOpen),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    expanded = _React$useState2[0],
-    setExpanded = _React$useState2[1];
-  var expand = React.useCallback(function () {
-    return setExpanded(true);
-  }, []);
-  var ref = React.useRef(null);
-  var resetFocus = React.useCallback(function () {
-    var _ref$current;
-    (_ref$current = ref.current) == null || _ref$current.focus();
-  }, []);
-  var variantKeys = React.useMemo(function () {
-    return Object.keys(demo.variants);
-  }, [demo.variants]);
-  var _React$useState3 = React.useState(variantKeys[0]),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    selectedVariantKey = _React$useState4[0],
-    setSelectedVariantKey = _React$useState4[1];
-  var selectedVariant = demo.variants[selectedVariantKey];
-  var _React$useState5 = React.useState(selectedVariant.fileName),
-    _React$useState6 = _slicedToArray(_React$useState5, 2),
-    selectedFileName = _React$useState6[0],
-    setSelectedFileName = _React$useState6[1];
-  var selectedFile = React.useMemo(function () {
-    var _selectedVariant$extr;
-    return selectedFileName === selectedVariant.fileName ? selectedVariant.source : (_selectedVariant$extr = selectedVariant.extraSource) == null ? void 0 : _selectedVariant$extr[selectedFileName];
-  }, [selectedFileName, selectedVariant]);
-
-  // if copying, convert the selected file's hast to text
-  var sourceFileToText = React.useCallback(function () {
-    return selectedFile && toText(selectedFile, {
-      whitespace: 'pre'
-    });
-  },
-  // TODO: allow passing the filename to copy
-  [selectedFile]);
-  var _useCopier = useCopier(sourceFileToText, copyOpts),
-    copy = _useCopier.copy,
-    copyDisabled = _useCopier.disabled;
-
-  // transform hast source to React components
-  var files = React.useMemo(function () {
-    var extraSource = selectedVariant.extraSource;
-    return [{
-      name: selectedVariant.fileName,
-      component: toComponent(selectedVariant.source)
-    }].concat(_toConsumableArray(extraSource ? Object.keys(extraSource).map(function (name) {
-      return {
-        name: name,
-        component: toComponent(extraSource[name])
-      };
-    }) : []));
-  }, [selectedVariant]);
-  var selectedFileComponent = React.useMemo(function () {
-    var matchedFile = files.find(function (file) {
-      return file.name === selectedFileName;
-    });
-    return matchedFile ? matchedFile.component : null;
-  }, [files, selectedFileName]);
-  return {
-    component: selectedVariant.component,
-    name: demo.name,
-    slug: slug,
-    description: demo.description,
-    ref: ref,
-    variants: variantKeys,
-    selectedVariant: selectedVariantKey,
-    selectVariant: setSelectedVariantKey,
-    files: files,
-    selectedFile: selectedFileComponent,
-    selectedFileName: selectedFileName,
-    selectFileName: setSelectedFileName,
-    expanded: expanded,
-    expand: expand,
-    setExpanded: setExpanded,
-    resetFocus: resetFocus,
-    copy: copy,
-    copyDisabled: copyDisabled
-  };
-}
+export * from "./useDemo.js";
+export * from "./createStackBlitz.js";
+export * from "./createCodeSandbox.js";
+export * from "./flattenVariant.js";
+export * from "./exportVariant.js";
+export * from "./exportVariantAsCra.js";

package/esm/useDemo/useDemo.d.ts

@@ -0,0 +1,81 @@
+import * as React from 'react';
+import type { UseCodeOpts } from "../useCode/index.js";
+import type { ContentProps } from "../CodeHighlighter/types.js";
+import { type ExportConfig } from "./exportVariant.js";
+/**
+ * Demo templates use the exportVariant/exportVariantAsCra with flattenVariant pattern:
+ *
+ * For StackBlitz:
+ * const { exported: exportedVariant, entrypoint } = exportVariant(variantCode);
+ * const flattenedFiles = flattenVariant(exportedVariant);
+ * createStackBlitzDemo({ title, description, flattenedFiles, useTypescript, initialFile: entrypoint })
+ *
+ * For CodeSandbox:
+ * const { exported: craExport, entrypoint } = exportVariantAsCra(variantCode, { title, description, useTypescript });
+ * const flattenedFiles = flattenVariant(craExport);
+ * createCodeSandboxDemo({ title, description, flattenedFiles, useTypescript, initialFile: entrypoint })
+ * createCodeSandboxDemo({ title, description, flattenedFiles, useTypescript })
+ */
+type UseDemoOpts = UseCodeOpts & {
+  codeSandboxUrlPrefix?: string;
+  stackBlitzPrefix?: string;
+  /** Common export configuration applied to both StackBlitz and CodeSandbox */
+  export?: ExportConfig;
+  /** StackBlitz-specific export configuration (merged with common export config) */
+  exportStackBlitz?: ExportConfig;
+  /** CodeSandbox-specific export configuration (merged with common export config) */
+  exportCodeSandbox?: ExportConfig;
+};
+/**
+ * Helper to create HTML form element with hidden inputs
+ */
+export declare function addHiddenInput(form: HTMLFormElement, name: string, value: string): void;
+/**
+ * Generic function to create and submit a form for opening online demo platforms
+ * This function creates HTML elements and should be used in browser contexts
+ */
+export declare function openWithForm({
+  url,
+  formData,
+  method,
+  target
+}: {
+  url: string;
+  formData: Record<string, string>;
+  method?: string;
+  target?: string;
+}): void;
+export declare function useDemo<T extends {} = {}>(contentProps: ContentProps<T>, opts?: UseDemoOpts): {
+  component: string | number | bigint | true | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null;
+  ref: React.RefObject<HTMLDivElement | null>;
+  resetFocus: () => void;
+  openStackBlitz: () => void;
+  openCodeSandbox: () => void;
+  name: string | undefined;
+  slug: string | undefined;
+  variants: string[];
+  selectedVariant: string;
+  selectVariant: React.Dispatch<React.SetStateAction<string>>;
+  files: Array<{
+    name: string;
+    slug?: string;
+    component: React.ReactNode;
+  }>;
+  selectedFile: React.ReactNode;
+  selectedFileLines: number;
+  selectedFileName: string | undefined;
+  selectFileName: (fileName: string) => void;
+  expanded: boolean;
+  expand: () => void;
+  setExpanded: React.Dispatch<React.SetStateAction<boolean>>;
+  copy: (event: React.MouseEvent<HTMLButtonElement>) => Promise<void>;
+  availableTransforms: string[];
+  selectedTransform: string | null | undefined;
+  selectTransform: (transformName: string | null) => void;
+  setSource?: (source: string) => void;
+  userProps: T & {
+    name?: string;
+    slug?: string;
+  };
+};
+export {};

package/esm/useDemo/useDemo.js

@@ -0,0 +1,193 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import kebabCase from 'kebab-case';
+import { useCode } from "../useCode/index.js";
+import { CodeHighlighterContext } from "../CodeHighlighter/CodeHighlighterContext.js";
+import { createStackBlitz } from "./createStackBlitz.js";
+import { createCodeSandbox } from "./createCodeSandbox.js";
+import { exportVariant } from "./exportVariant.js";
+import { exportVariantAsCra } from "./exportVariantAsCra.js";
+import { flattenVariant } from "./flattenVariant.js";
+
+/**
+ * Demo templates use the exportVariant/exportVariantAsCra with flattenVariant pattern:
+ *
+ * For StackBlitz:
+ * const { exported: exportedVariant, entrypoint } = exportVariant(variantCode);
+ * const flattenedFiles = flattenVariant(exportedVariant);
+ * createStackBlitzDemo({ title, description, flattenedFiles, useTypescript, initialFile: entrypoint })
+ *
+ * For CodeSandbox:
+ * const { exported: craExport, entrypoint } = exportVariantAsCra(variantCode, { title, description, useTypescript });
+ * const flattenedFiles = flattenVariant(craExport);
+ * createCodeSandboxDemo({ title, description, flattenedFiles, useTypescript, initialFile: entrypoint })
+ * createCodeSandboxDemo({ title, description, flattenedFiles, useTypescript })
+ */
+
+/**
+ * Helper to create HTML form element with hidden inputs
+ */
+export function addHiddenInput(form, name, value) {
+  var input = document.createElement('input');
+  input.type = 'hidden';
+  input.name = name;
+  input.value = value;
+  form.appendChild(input);
+}
+
+/**
+ * Generic function to create and submit a form for opening online demo platforms
+ * This function creates HTML elements and should be used in browser contexts
+ */
+export function openWithForm(_ref) {
+  var url = _ref.url,
+    formData = _ref.formData,
+    _ref$method = _ref.method,
+    method = _ref$method === void 0 ? 'POST' : _ref$method,
+    _ref$target = _ref.target,
+    target = _ref$target === void 0 ? '_blank' : _ref$target;
+  var form = document.createElement('form');
+  form.method = method;
+  form.target = target;
+  form.action = url;
+  Object.entries(formData).forEach(function (_ref2) {
+    var _ref3 = _slicedToArray(_ref2, 2),
+      name = _ref3[0],
+      value = _ref3[1];
+    addHiddenInput(form, name, value);
+  });
+  document.body.appendChild(form);
+  form.submit();
+  document.body.removeChild(form);
+}
+
+// TODO: take initialVariant and initialTransforms as parameters
+export function useDemo(contentProps, opts) {
+  var code = useCode(contentProps, opts);
+
+  // Extract export configuration options
+  var _ref4 = opts || {},
+    _ref4$export = _ref4["export"],
+    commonExportConfig = _ref4$export === void 0 ? {} : _ref4$export,
+    _ref4$exportStackBlit = _ref4.exportStackBlitz,
+    stackBlitzExportConfig = _ref4$exportStackBlit === void 0 ? {} : _ref4$exportStackBlit,
+    _ref4$exportCodeSandb = _ref4.exportCodeSandbox,
+    codeSandboxExportConfig = _ref4$exportCodeSandb === void 0 ? {} : _ref4$exportCodeSandb;
+
+  // Get context to access components if available (using React.useContext to avoid import conflicts)
+  var context = React.useContext(CodeHighlighterContext);
+  var slug = React.useMemo(function () {
+    return contentProps.slug || (contentProps.name ? kebabCase(contentProps.name, false) : undefined);
+  }, [contentProps.slug, contentProps.name]);
+
+  // Get the effective components object - context overrides contentProps
+  var effectiveComponents = React.useMemo(function () {
+    return (context == null ? void 0 : context.components) || contentProps.components || {};
+  }, [context == null ? void 0 : context.components, contentProps.components]);
+
+  // Get the component for the current variant
+  var component = React.useMemo(function () {
+    return effectiveComponents[code.selectedVariant] || null;
+  }, [effectiveComponents, code.selectedVariant]);
+
+  // Demo-specific ref and focus management
+  var ref = React.useRef(null);
+  var resetFocus = React.useCallback(function () {
+    var _ref$current;
+    (_ref$current = ref.current) == null || _ref$current.focus();
+  }, []);
+
+  // Get the effective code - context overrides contentProps if available
+  var effectiveCode = React.useMemo(function () {
+    return (context == null ? void 0 : context.code) || contentProps.code || {};
+  }, [context == null ? void 0 : context.code, contentProps.code]);
+
+  // Create StackBlitz demo callback
+  var openStackBlitz = React.useCallback(function () {
+    // Get the current variant code
+    var variantCode = effectiveCode[code.selectedVariant];
+    if (!variantCode || typeof variantCode === 'string') {
+      console.warn('No valid variant code available for StackBlitz demo');
+      return;
+    }
+    var title = contentProps.name || 'Demo';
+    var description = "".concat(title, " demo");
+
+    // Determine if we should use TypeScript based on whether 'js' transform is NOT applied
+    // If 'js' transform is applied, it means we're showing the JS version of TS code
+    var useTypescript = code.selectedTransform !== 'js';
+
+    // Merge common export config with StackBlitz-specific config
+    var mergedConfig = _extends(_extends(_extends({}, commonExportConfig), stackBlitzExportConfig), {}, {
+      variantName: code.selectedVariant,
+      title: title,
+      description: description,
+      useTypescript: useTypescript
+    });
+
+    // Use custom export function if provided, otherwise use default exportVariant
+    var exportFunction = mergedConfig.exportFunction || exportVariant;
+    var _exportFunction = exportFunction(variantCode, mergedConfig),
+      exported = _exportFunction.exported,
+      rootFile = _exportFunction.rootFile;
+
+    // Flatten the variant to get a flat file structure
+    var flattenedFiles = flattenVariant(exported);
+    var stackBlitzDemo = createStackBlitz({
+      title: title,
+      description: description,
+      flattenedFiles: flattenedFiles,
+      rootFile: rootFile
+    });
+    openWithForm(stackBlitzDemo);
+  }, [effectiveCode, code.selectedVariant, code.selectedTransform, contentProps.name, commonExportConfig, stackBlitzExportConfig]);
+
+  // Create CodeSandbox demo callback
+  var openCodeSandbox = React.useCallback(function () {
+    // Get the current variant code
+    var variantCode = effectiveCode[code.selectedVariant];
+    if (!variantCode || typeof variantCode === 'string') {
+      console.warn('No valid variant code available for CodeSandbox demo');
+      return;
+    }
+    var title = contentProps.name || 'Demo';
+    var description = "".concat(title, " demo");
+
+    // Determine if we should use TypeScript based on whether 'js' transform is NOT applied
+    // If 'js' transform is applied, it means we're showing the JS version of TS code
+    var useTypescript = code.selectedTransform !== 'js';
+
+    // Merge common export config with CodeSandbox-specific config
+    var mergedConfig = _extends(_extends(_extends({}, commonExportConfig), codeSandboxExportConfig), {}, {
+      variantName: code.selectedVariant,
+      title: title,
+      description: description,
+      useTypescript: useTypescript
+    });
+
+    // Use custom export function if provided, otherwise use default exportVariantAsCra
+    var exportFunction = mergedConfig.exportFunction || exportVariantAsCra;
+    var _exportFunction2 = exportFunction(variantCode, mergedConfig),
+      craExport = _exportFunction2.exported,
+      rootFile = _exportFunction2.rootFile;
+
+    // Flatten the variant to get a flat file structure
+    var flattenedFiles = flattenVariant(craExport);
+    var codeSandboxDemo = createCodeSandbox({
+      flattenedFiles: flattenedFiles,
+      rootFile: rootFile
+    });
+    openWithForm(codeSandboxDemo);
+  }, [effectiveCode, code.selectedVariant, code.selectedTransform, contentProps.name, commonExportConfig, codeSandboxExportConfig]);
+  return _extends(_extends({}, code), {}, {
+    // Demo-specific additions
+    component: component,
+    ref: ref,
+    resetFocus: resetFocus,
+    openStackBlitz: openStackBlitz,
+    openCodeSandbox: openCodeSandbox,
+    name: contentProps.name,
+    slug: slug
+  });
+}

package/esm/useErrors/ErrorsContext.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export interface CodeErrorsContext {
+  errors?: Error[];
+}
+export declare const CodeErrorsContext: React.Context<CodeErrorsContext | undefined>;
+export declare function useErrorsContext(): CodeErrorsContext | undefined;

package/esm/useErrors/ErrorsContext.js

@@ -0,0 +1,8 @@
+'use client';
+
+import * as React from 'react';
+export var CodeErrorsContext = /*#__PURE__*/React.createContext(undefined);
+if (process.env.NODE_ENV !== "production") CodeErrorsContext.displayName = "CodeErrorsContext";
+export function useErrorsContext() {
+  return React.useContext(CodeErrorsContext);
+}

package/esm/useErrors/index.d.ts

@@ -0,0 +1 @@
+export * from "./useErrors.js";

package/esm/useErrors/index.js

@@ -0,0 +1 @@
+export * from "./useErrors.js";

package/esm/useErrors/useErrors.d.ts

@@ -0,0 +1,5 @@
+type Errors = {
+  errors?: Error[];
+};
+export declare function useErrors(): Errors;
+export {};

package/esm/useErrors/useErrors.js

@@ -0,0 +1,7 @@
+import { useErrorsContext } from "./ErrorsContext.js";
+export function useErrors() {
+  var context = useErrorsContext();
+  return {
+    errors: context == null ? void 0 : context.errors
+  };
+}

package/esm/useLocalStorageState/index.d.ts

@@ -0,0 +1,2 @@
+import useLocalStorageState from "./useLocalStorageState.js";
+export default useLocalStorageState;

package/esm/useLocalStorageState/index.js

@@ -0,0 +1,2 @@
+import useLocalStorageState from "./useLocalStorageState.js";
+export default useLocalStorageState;

package/esm/useLocalStorageState/useLocalStorageState.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+type Initializer = () => string | null;
+type UseStorageStateHookResult = [string | null, React.Dispatch<React.SetStateAction<string | null>>];
+/**
+ * Sync state to local storage so that it persists through a page refresh. Usage is
+ * similar to useState except we pass in a storage key so that we can default
+ * to that value on page load instead of the specified initial value.
+ *
+ * Since the storage API isn't available in server-rendering environments, we
+ * return null during SSR and hydration.
+ */
+declare function useLocalStorageStateBrowser(key: string | null, initializer?: string | null | Initializer): UseStorageStateHookResult;
+declare const _default: typeof useLocalStorageStateBrowser;
+export default _default;

package/esm/useLocalStorageState/useLocalStorageState.js

@@ -0,0 +1,128 @@
+'use client';
+
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+
+/**
+ * Copied from https://github.com/mui/material-ui/blob/9dfc2b12f3fc5c41071da5e10b0088fb04045a26/packages/mui-utils/src/useLocalStorageState/useLocalStorageState.ts
+ */
+
+// storage events only work across tabs, we'll use an event emitter to announce within the current tab
+var currentTabChangeListeners = new Map();
+function onCurrentTabStorageChange(key, handler) {
+  var listeners = currentTabChangeListeners.get(key);
+  if (!listeners) {
+    listeners = new Set();
+    currentTabChangeListeners.set(key, listeners);
+  }
+  listeners.add(handler);
+}
+function offCurrentTabStorageChange(key, handler) {
+  var listeners = currentTabChangeListeners.get(key);
+  if (!listeners) {
+    return;
+  }
+  listeners["delete"](handler);
+  if (listeners.size === 0) {
+    currentTabChangeListeners["delete"](key);
+  }
+}
+function emitCurrentTabStorageChange(key) {
+  var listeners = currentTabChangeListeners.get(key);
+  if (listeners) {
+    listeners.forEach(function (listener) {
+      return listener();
+    });
+  }
+}
+function subscribe(area, key, callback) {
+  if (!key) {
+    return function () {};
+  }
+  var storageHandler = function storageHandler(event) {
+    if (event.storageArea === area && event.key === key) {
+      callback();
+    }
+  };
+  window.addEventListener('storage', storageHandler);
+  onCurrentTabStorageChange(key, callback);
+  return function () {
+    window.removeEventListener('storage', storageHandler);
+    offCurrentTabStorageChange(key, callback);
+  };
+}
+function getSnapshot(area, key) {
+  if (!key) {
+    return null;
+  }
+  try {
+    return area.getItem(key);
+  } catch (_unused) {
+    // ignore
+    // See https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API#feature-detecting_localstorage
+    return null;
+  }
+}
+function setValue(area, key, value) {
+  if (!key) {
+    return;
+  }
+  try {
+    if (value === null) {
+      area.removeItem(key);
+    } else {
+      area.setItem(key, String(value));
+    }
+  } catch (_unused2) {
+    // ignore
+    // See https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API#feature-detecting_localstorage
+    return;
+  }
+  emitCurrentTabStorageChange(key);
+}
+var serverValue = [null, function () {}];
+function useLocalStorageStateServer() {
+  return serverValue;
+}
+
+/**
+ * Sync state to local storage so that it persists through a page refresh. Usage is
+ * similar to useState except we pass in a storage key so that we can default
+ * to that value on page load instead of the specified initial value.
+ *
+ * Since the storage API isn't available in server-rendering environments, we
+ * return null during SSR and hydration.
+ */
+function useLocalStorageStateBrowser(key) {
+  var initializer = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  var _React$useState = React.useState(initializer),
+    _React$useState2 = _slicedToArray(_React$useState, 1),
+    initialValue = _React$useState2[0];
+  var area = window.localStorage;
+  var subscribeKey = React.useCallback(function (callback) {
+    return subscribe(area, key, callback);
+  }, [area, key]);
+  var getKeySnapshot = React.useCallback(function () {
+    var _getSnapshot;
+    return (_getSnapshot = getSnapshot(area, key)) != null ? _getSnapshot : initialValue;
+  }, [area, initialValue, key]);
+
+  // Start with null for the hydration, and then switch to the actual value.
+  var getKeyServerSnapshot = function getKeyServerSnapshot() {
+    return null;
+  };
+  var storedValue = React.useSyncExternalStore(subscribeKey, getKeySnapshot, getKeyServerSnapshot);
+  var setStoredValue = React.useCallback(function (value) {
+    var valueToStore = value instanceof Function ? value(storedValue) : value;
+    setValue(area, key, valueToStore);
+  }, [area, key, storedValue]);
+  var _React$useState3 = React.useState(initialValue),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    nonStoredValue = _React$useState4[0],
+    setNonStoredValue = _React$useState4[1];
+  if (!key) {
+    return [nonStoredValue, setNonStoredValue];
+  }
+  return [storedValue, setStoredValue];
+}
+export default typeof window === 'undefined' ? useLocalStorageStateServer : useLocalStorageStateBrowser;

package/esm/usePreference/PreferencesProvider.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export interface PreferencesContext {
+  prefix?: string;
+}
+export declare const PreferencesContext: React.Context<PreferencesContext | undefined>;
+export declare function usePreferences(): PreferencesContext | undefined;

package/esm/usePreference/PreferencesProvider.js

@@ -0,0 +1,8 @@
+'use client';
+
+import * as React from 'react';
+export var PreferencesContext = /*#__PURE__*/React.createContext(undefined);
+if (process.env.NODE_ENV !== "production") PreferencesContext.displayName = "PreferencesContext";
+export function usePreferences() {
+  return React.useContext(PreferencesContext);
+}

package/esm/usePreference/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./usePreference.js";
+export * from "./PreferencesProvider.js";

package/esm/usePreference/index.js

@@ -0,0 +1,2 @@
+export * from "./usePreference.js";
+export * from "./PreferencesProvider.js";

package/esm/usePreference/usePreference.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare function usePreference(type: 'variant' | 'transform', name: string | string[], initializer?: string | null | (() => string | null)): [string | null, React.Dispatch<React.SetStateAction<string | null>>];

package/esm/usePreference/usePreference.js

@@ -0,0 +1,25 @@
+'use client';
+
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import * as React from 'react';
+import useLocalStorageState from "../useLocalStorageState/index.js";
+import { usePreferences } from "./PreferencesProvider.js";
+var variantPrefPrefix = '_docs_variant_pref';
+var transformPref = '_docs_transform_pref';
+export function usePreference(type, name) {
+  var initializer = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+  var key = React.useMemo(function () {
+    if (!Array.isArray(name)) {
+      return name;
+    }
+    if (name.length <= 1) {
+      return null; // Don't use localStorage for single variants - no choice to remember
+    }
+    return _toConsumableArray(name).sort().join(':');
+  }, [name]);
+  var preferences = usePreferences();
+  var defaultPrefix = type === 'variant' ? variantPrefPrefix : transformPref;
+  var prefix = preferences != null && preferences.prefix ? "".concat(preferences == null ? void 0 : preferences.prefix, "_").concat(type) : defaultPrefix;
+  var storageKey = key ? "".concat(prefix, ":").concat(key) : null;
+  return useLocalStorageState(storageKey, initializer);
+}

package/esm/useUrlHashState/index.d.ts

@@ -0,0 +1 @@
+export * from "./useUrlHashState.js";

package/esm/useUrlHashState/index.js

@@ -0,0 +1 @@
+export * from "./useUrlHashState.js";

package/esm/useUrlHashState/useUrlHashState.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Hook for managing URL hash state with SSR support
+ * @returns A tuple of [hash, setHash] where hash is the current URL hash (without '#') and setHash updates it
+ */
+export declare function useUrlHashState(): [string | null, (value: string | null, replace?: boolean) => void];