@iris-ui-kit/react 0.1.0

package/dist/theme.cjs

@@ -0,0 +1,100 @@
+'use client'
+'use strict';
+
+var React2 = require('react');
+var theme = require('@iris-ui-kit/theme');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
+
+// src/theme/ThemeProvider.tsx
+function useStore(store) {
+  return React2.useSyncExternalStore(
+    store.subscribe,
+    store.getState,
+    store.getState
+    // SSR fallback — same as client snapshot in our case.
+  );
+}
+var IrisThemeContext = React2.createContext(null);
+function ThemeProvider({
+  store,
+  target = null,
+  dir = "ltr",
+  cspNonce,
+  children
+}) {
+  const current = useStore(store.store);
+  const appliedRef = React2.useRef(null);
+  React2.useEffect(() => {
+    theme.injectGlobalStyles(cspNonce);
+    const el = target ?? document.documentElement;
+    appliedRef.current?.revert();
+    appliedRef.current = theme.applyTheme(current, el);
+    const dirApplied = theme.applyDirection(dir, el);
+    return () => {
+      appliedRef.current?.revert();
+      appliedRef.current = null;
+      dirApplied.revert();
+    };
+  }, [current, target, dir]);
+  return /* @__PURE__ */ jsxRuntime.jsx(IrisThemeContext.Provider, { value: { store, current, dir }, children });
+}
+function useThemeContext() {
+  const ctx = React2.useContext(IrisThemeContext);
+  if (!ctx) {
+    throw new Error("[iris-ui] useTheme(): no <ThemeProvider> ancestor found");
+  }
+  return ctx;
+}
+function useThemeOptional() {
+  return React2.useContext(IrisThemeContext)?.current;
+}
+function useDirection() {
+  return React2.useContext(IrisThemeContext)?.dir ?? "ltr";
+}
+
+// src/theme/useTheme.ts
+function useTheme() {
+  const ctx = useThemeContext();
+  return {
+    theme: ctx.current,
+    setTheme: ctx.store.setTheme,
+    availableThemes: ctx.store.availableThemes
+  };
+}
+function useColorScheme() {
+  const [scheme, setScheme] = React2__namespace.useState(theme.getColorScheme);
+  React2__namespace.useEffect(() => {
+    setScheme(theme.getColorScheme());
+    return theme.watchColorScheme(setScheme);
+  }, []);
+  return scheme;
+}
+
+exports.ThemeProvider = ThemeProvider;
+exports.useColorScheme = useColorScheme;
+exports.useDirection = useDirection;
+exports.useTheme = useTheme;
+exports.useThemeContext = useThemeContext;
+exports.useThemeOptional = useThemeOptional;
+//# sourceMappingURL=theme.cjs.map
+//# sourceMappingURL=theme.cjs.map

package/dist/theme.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/useStore.ts","../src/theme/ThemeProvider.tsx","../src/theme/useTheme.ts","../src/theme/useColorScheme.ts"],"names":["useSyncExternalStore","createContext","useRef","useEffect","injectGlobalStyles","applyTheme","applyDirection","jsx","useContext","React2","getColorScheme","watchColorScheme"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUO,SAAS,SAAY,KAAA,EAA4B;AACtD,EAAA,OAAOA,2BAAA;AAAA,IACL,KAAA,CAAM,SAAA;AAAA,IACN,KAAA,CAAM,QAAA;AAAA,IACN,KAAA,CAAM;AAAA;AAAA,GACR;AACF;ACEA,IAAM,gBAAA,GAAmBC,qBAA4C,IAAI,CAAA;AAqBlE,SAAS,aAAA,CAAc;AAAA,EAC5B,KAAA;AAAA,EACA,MAAA,GAAS,IAAA;AAAA,EACT,GAAA,GAAM,KAAA;AAAA,EACN,QAAA;AAAA,EACA;AACF,CAAA,EAAuB;AACrB,EAAA,MAAM,OAAA,GAAU,QAAA,CAAS,KAAA,CAAM,KAAK,CAAA;AACpC,EAAA,MAAM,UAAA,GAAaC,cAAgC,IAAI,CAAA;AAEvD,EAAAC,iBAAU,MAAM;AACd,IAAAC,wBAAA,CAAmB,QAAQ,CAAA;AAC3B,IAAA,MAAM,EAAA,GAAK,UAAU,QAAA,CAAS,eAAA;AAC9B,IAAA,UAAA,CAAW,SAAS,MAAA,EAAO;AAC3B,IAAA,UAAA,CAAW,OAAA,GAAUC,gBAAA,CAAW,OAAA,EAAS,EAAE,CAAA;AAC3C,IAAA,MAAM,UAAA,GAAaC,oBAAA,CAAe,GAAA,EAAK,EAAE,CAAA;AACzC,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,SAAS,MAAA,EAAO;AAC3B,MAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AACrB,MAAA,UAAA,CAAW,MAAA,EAAO;AAAA,IACpB,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,OAAA,EAAS,MAAA,EAAQ,GAAG,CAAC,CAAA;AAEzB,EAAA,uBACEC,cAAA,CAAC,gBAAA,CAAiB,QAAA,EAAjB,EAA0B,KAAA,EAAO,EAAE,KAAA,EAAO,OAAA,EAAS,GAAA,EAAI,EACrD,QAAA,EACH,CAAA;AAEJ;AAEO,SAAS,eAAA,GAAyC;AACvD,EAAA,MAAM,GAAA,GAAMC,kBAAW,gBAAgB,CAAA;AACvC,EAAA,IAAI,CAAC,GAAA,EAAK;AACR,IAAA,MAAM,IAAI,MAAM,yDAAyD,CAAA;AAAA,EAC3E;AACA,EAAA,OAAO,GAAA;AACT;AAOO,SAAS,gBAAA,GAA0C;AACxD,EAAA,OAAOA,iBAAA,CAAW,gBAAgB,CAAA,EAAG,OAAA;AACvC;AAOO,SAAS,YAAA,GAA0B;AACxC,EAAA,OAAOA,iBAAA,CAAW,gBAAgB,CAAA,EAAG,GAAA,IAAO,KAAA;AAC9C;;;AC7EO,SAAS,QAAA,GAA2B;AACzC,EAAA,MAAM,MAAM,eAAA,EAAgB;AAC5B,EAAA,OAAO;AAAA,IACL,OAAO,GAAA,CAAI,OAAA;AAAA,IACX,QAAA,EAAU,IAAI,KAAA,CAAM,QAAA;AAAA,IACpB,eAAA,EAAiB,IAAI,KAAA,CAAM;AAAA,GAC7B;AACF;ACTO,SAAS,cAAA,GAA8B;AAC5C,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAUC,2BAAsBC,oBAAc,CAAA;AACtE,EAAMD,4BAAU,MAAM;AAEpB,IAAA,SAAA,CAAUC,sBAAgB,CAAA;AAC1B,IAAA,OAAOC,uBAAiB,SAAS,CAAA;AAAA,EACnC,CAAA,EAAG,EAAE,CAAA;AACL,EAAA,OAAO,MAAA;AACT","file":"theme.cjs","sourcesContent":["import * as React from 'react'\nimport { useSyncExternalStore } from 'react'\nimport type { ReadonlyStore, Store } from '@iris-ui-kit/core'\n\n/**\n * Bridge a framework-agnostic `@iris-ui-kit/core` store into React reactivity.\n * Uses React 18's `useSyncExternalStore` — the contract is identical to the\n * one Vue uses via `ref + onMounted` and Solid uses via `createSignal`. The\n * **same** store can power Button, Popover, Dialog, etc. on any framework.\n */\nexport function useStore<T>(store: ReadonlyStore<T>): T {\n  return useSyncExternalStore(\n    store.subscribe,\n    store.getState,\n    store.getState, // SSR fallback — same as client snapshot in our case.\n  )\n}\n\n/**\n * Subscribe to a DERIVED slice of a core store — the component re-renders only\n * when `selector(state)` changes per `isEqual` (default `Object.is`), not on\n * every store emission. Built on {@link Store.subscribeWith}. Inline closures\n * for `selector`/`isEqual` are fine (captured via refs; the subscription is not\n * re-created between renders).\n */\nexport function useStoreSelector<T, U>(\n  store: Store<T>,\n  selector: (state: T) => U,\n  isEqual?: (a: U, b: U) => boolean,\n): U {\n  const [slice, setSlice] = React.useState(() => selector(store.getState()))\n  const selRef = React.useRef(selector)\n  selRef.current = selector\n  const eqRef = React.useRef(isEqual)\n  eqRef.current = isEqual\n  React.useEffect(() => {\n    const read = (s: T): U => selRef.current(s)\n    const eq = (a: U, b: U): boolean => (eqRef.current ?? Object.is)(a, b)\n    // Re-sync in case the store moved between render and this effect.\n    setSlice((prev) => {\n      const next = read(store.getState())\n      return eq(prev, next) ? prev : next\n    })\n    return store.subscribeWith(read, setSlice, eq)\n  }, [store])\n  return slice\n}\n","import { createContext, useContext, useEffect, useRef, type ReactNode } from 'react'\nimport {\n  applyDirection,\n  applyTheme,\n  injectGlobalStyles,\n  type ApplyThemeResult,\n  type Direction,\n  type ThemeStore,\n} from '@iris-ui-kit/theme'\nimport type { IrisTheme } from '@iris-ui-kit/tokens'\nimport { useStore } from '../useStore'\n\ninterface IrisThemeContextValue {\n  store: ThemeStore\n  current: IrisTheme\n  dir: Direction\n}\n\nconst IrisThemeContext = createContext<IrisThemeContextValue | null>(null)\n\nexport interface ThemeProviderProps {\n  store: ThemeStore\n  target?: HTMLElement | null\n  /** Writing direction; sets `dir` on the target for RTL. Default `'ltr'`. */\n  dir?: Direction\n  /** CSP nonce for the injected global stylesheet. Pass the `nonce` from your\n   *  server-rendered CSP header when you use `style-src: 'nonce-...'`. */\n  cspNonce?: string\n  children?: ReactNode\n}\n\n/**\n * Renderless provider that mirrors `<IrisThemeProvider>` from `@iris-ui-kit/vue`:\n * subscribes to the theme store, applies CSS variables to `target` (or\n * `document.documentElement`), reverts on unmount.\n *\n * **Zero business logic** — `applyTheme` / `createThemeStore` come straight\n * from `@iris-ui-kit/theme`. This component is just a 30-line React adapter.\n */\nexport function ThemeProvider({\n  store,\n  target = null,\n  dir = 'ltr',\n  cspNonce,\n  children,\n}: ThemeProviderProps) {\n  const current = useStore(store.store)\n  const appliedRef = useRef<ApplyThemeResult | null>(null)\n\n  useEffect(() => {\n    injectGlobalStyles(cspNonce)\n    const el = target ?? document.documentElement\n    appliedRef.current?.revert()\n    appliedRef.current = applyTheme(current, el)\n    const dirApplied = applyDirection(dir, el)\n    return () => {\n      appliedRef.current?.revert()\n      appliedRef.current = null\n      dirApplied.revert()\n    }\n  }, [current, target, dir])\n\n  return (\n    <IrisThemeContext.Provider value={{ store, current, dir }}>\n      {children}\n    </IrisThemeContext.Provider>\n  )\n}\n\nexport function useThemeContext(): IrisThemeContextValue {\n  const ctx = useContext(IrisThemeContext)\n  if (!ctx) {\n    throw new Error('[iris-ui] useTheme(): no <ThemeProvider> ancestor found')\n  }\n  return ctx\n}\n\n/**\n * Read the current theme without throwing when there is no `<ThemeProvider>`\n * ancestor. Returns `undefined` outside a provider. Used by theme-aware\n * primitives (e.g. `IrisIcon`) that must still render standalone.\n */\nexport function useThemeOptional(): IrisTheme | undefined {\n  return useContext(IrisThemeContext)?.current\n}\n\n/**\n * Current writing direction (`'ltr'` / `'rtl'`) from the nearest\n * `<ThemeProvider>`, or `'ltr'` when there is none. For components that need to\n * branch on direction beyond what CSS logical properties already handle.\n */\nexport function useDirection(): Direction {\n  return useContext(IrisThemeContext)?.dir ?? 'ltr'\n}\n","import type { IrisTheme } from '@iris-ui-kit/tokens'\nimport { useThemeContext } from './ThemeProvider'\n\nexport interface UseThemeReturn {\n  theme: IrisTheme\n  setTheme: (target: string | IrisTheme) => void\n  availableThemes: Record<string, IrisTheme>\n}\n\n/**\n * Read and write the current theme from anywhere inside a `<ThemeProvider>`.\n *\n * @example\n *   const { theme, setTheme } = useTheme()\n *   setTheme('dark')\n */\nexport function useTheme(): UseThemeReturn {\n  const ctx = useThemeContext()\n  return {\n    theme: ctx.current,\n    setTheme: ctx.store.setTheme,\n    availableThemes: ctx.store.availableThemes,\n  }\n}\n","import * as React from 'react'\nimport { getColorScheme, watchColorScheme, type ColorScheme } from '@iris-ui-kit/theme'\n\n/**\n * Reactive system color scheme (`'light'` / `'dark'`) from\n * `prefers-color-scheme`. Re-renders the host when the OS preference flips.\n * SSR-safe (reports `'light'` until mounted). Wire it to a theme store to\n * auto-follow the system:\n *\n * ```tsx\n * const scheme = useColorScheme()\n * React.useEffect(() => store.setTheme(scheme === 'dark' ? 'dark' : 'light'), [scheme])\n * ```\n */\nexport function useColorScheme(): ColorScheme {\n  const [scheme, setScheme] = React.useState<ColorScheme>(getColorScheme)\n  React.useEffect(() => {\n    // Re-sync in case the preference changed between render and effect.\n    setScheme(getColorScheme())\n    return watchColorScheme(setScheme)\n  }, [])\n  return scheme\n}\n"]}

package/dist/theme.d.cts

@@ -0,0 +1,71 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+import { ThemeStore, Direction, ColorScheme } from '@iris-ui-kit/theme';
+import { IrisTheme } from '@iris-ui-kit/tokens';
+
+interface IrisThemeContextValue {
+    store: ThemeStore;
+    current: IrisTheme;
+    dir: Direction;
+}
+interface ThemeProviderProps {
+    store: ThemeStore;
+    target?: HTMLElement | null;
+    /** Writing direction; sets `dir` on the target for RTL. Default `'ltr'`. */
+    dir?: Direction;
+    /** CSP nonce for the injected global stylesheet. Pass the `nonce` from your
+     *  server-rendered CSP header when you use `style-src: 'nonce-...'`. */
+    cspNonce?: string;
+    children?: ReactNode;
+}
+/**
+ * Renderless provider that mirrors `<IrisThemeProvider>` from `@iris-ui-kit/vue`:
+ * subscribes to the theme store, applies CSS variables to `target` (or
+ * `document.documentElement`), reverts on unmount.
+ *
+ * **Zero business logic** — `applyTheme` / `createThemeStore` come straight
+ * from `@iris-ui-kit/theme`. This component is just a 30-line React adapter.
+ */
+declare function ThemeProvider({ store, target, dir, cspNonce, children, }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
+declare function useThemeContext(): IrisThemeContextValue;
+/**
+ * Read the current theme without throwing when there is no `<ThemeProvider>`
+ * ancestor. Returns `undefined` outside a provider. Used by theme-aware
+ * primitives (e.g. `IrisIcon`) that must still render standalone.
+ */
+declare function useThemeOptional(): IrisTheme | undefined;
+/**
+ * Current writing direction (`'ltr'` / `'rtl'`) from the nearest
+ * `<ThemeProvider>`, or `'ltr'` when there is none. For components that need to
+ * branch on direction beyond what CSS logical properties already handle.
+ */
+declare function useDirection(): Direction;
+
+interface UseThemeReturn {
+    theme: IrisTheme;
+    setTheme: (target: string | IrisTheme) => void;
+    availableThemes: Record<string, IrisTheme>;
+}
+/**
+ * Read and write the current theme from anywhere inside a `<ThemeProvider>`.
+ *
+ * @example
+ *   const { theme, setTheme } = useTheme()
+ *   setTheme('dark')
+ */
+declare function useTheme(): UseThemeReturn;
+
+/**
+ * Reactive system color scheme (`'light'` / `'dark'`) from
+ * `prefers-color-scheme`. Re-renders the host when the OS preference flips.
+ * SSR-safe (reports `'light'` until mounted). Wire it to a theme store to
+ * auto-follow the system:
+ *
+ * ```tsx
+ * const scheme = useColorScheme()
+ * React.useEffect(() => store.setTheme(scheme === 'dark' ? 'dark' : 'light'), [scheme])
+ * ```
+ */
+declare function useColorScheme(): ColorScheme;
+
+export { ThemeProvider, type ThemeProviderProps, type UseThemeReturn, useColorScheme, useDirection, useTheme, useThemeContext, useThemeOptional };

package/dist/theme.d.ts

@@ -0,0 +1,71 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+import { ThemeStore, Direction, ColorScheme } from '@iris-ui-kit/theme';
+import { IrisTheme } from '@iris-ui-kit/tokens';
+
+interface IrisThemeContextValue {
+    store: ThemeStore;
+    current: IrisTheme;
+    dir: Direction;
+}
+interface ThemeProviderProps {
+    store: ThemeStore;
+    target?: HTMLElement | null;
+    /** Writing direction; sets `dir` on the target for RTL. Default `'ltr'`. */
+    dir?: Direction;
+    /** CSP nonce for the injected global stylesheet. Pass the `nonce` from your
+     *  server-rendered CSP header when you use `style-src: 'nonce-...'`. */
+    cspNonce?: string;
+    children?: ReactNode;
+}
+/**
+ * Renderless provider that mirrors `<IrisThemeProvider>` from `@iris-ui-kit/vue`:
+ * subscribes to the theme store, applies CSS variables to `target` (or
+ * `document.documentElement`), reverts on unmount.
+ *
+ * **Zero business logic** — `applyTheme` / `createThemeStore` come straight
+ * from `@iris-ui-kit/theme`. This component is just a 30-line React adapter.
+ */
+declare function ThemeProvider({ store, target, dir, cspNonce, children, }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
+declare function useThemeContext(): IrisThemeContextValue;
+/**
+ * Read the current theme without throwing when there is no `<ThemeProvider>`
+ * ancestor. Returns `undefined` outside a provider. Used by theme-aware
+ * primitives (e.g. `IrisIcon`) that must still render standalone.
+ */
+declare function useThemeOptional(): IrisTheme | undefined;
+/**
+ * Current writing direction (`'ltr'` / `'rtl'`) from the nearest
+ * `<ThemeProvider>`, or `'ltr'` when there is none. For components that need to
+ * branch on direction beyond what CSS logical properties already handle.
+ */
+declare function useDirection(): Direction;
+
+interface UseThemeReturn {
+    theme: IrisTheme;
+    setTheme: (target: string | IrisTheme) => void;
+    availableThemes: Record<string, IrisTheme>;
+}
+/**
+ * Read and write the current theme from anywhere inside a `<ThemeProvider>`.
+ *
+ * @example
+ *   const { theme, setTheme } = useTheme()
+ *   setTheme('dark')
+ */
+declare function useTheme(): UseThemeReturn;
+
+/**
+ * Reactive system color scheme (`'light'` / `'dark'`) from
+ * `prefers-color-scheme`. Re-renders the host when the OS preference flips.
+ * SSR-safe (reports `'light'` until mounted). Wire it to a theme store to
+ * auto-follow the system:
+ *
+ * ```tsx
+ * const scheme = useColorScheme()
+ * React.useEffect(() => store.setTheme(scheme === 'dark' ? 'dark' : 'light'), [scheme])
+ * ```
+ */
+declare function useColorScheme(): ColorScheme;
+
+export { ThemeProvider, type ThemeProviderProps, type UseThemeReturn, useColorScheme, useDirection, useTheme, useThemeContext, useThemeOptional };

package/dist/theme.js

@@ -0,0 +1,5 @@
+'use client'
+export { ThemeProvider, useColorScheme, useDirection, useTheme, useThemeContext, useThemeOptional } from './chunk-XCK4RIXB.js';
+import './chunk-RZNYIFV2.js';
+//# sourceMappingURL=theme.js.map
+//# sourceMappingURL=theme.js.map

package/dist/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":";","file":"theme.js"}

package/dist/undo.cjs

@@ -0,0 +1,73 @@
+'use client'
+'use strict';
+
+var React = require('react');
+var undo = require('@iris-ui-kit/core/undo');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+// src/undo/useUndoStack.ts
+function useUndoStack(options) {
+  const stackRef = React__namespace.useRef(null);
+  if (stackRef.current === null) {
+    stackRef.current = undo.createUndoStack(options);
+  }
+  const stack = stackRef.current;
+  const [, setTick] = React__namespace.useState(0);
+  const bump = React__namespace.useCallback(() => setTick((n) => n + 1), []);
+  const push = React__namespace.useCallback(
+    (snapshot) => {
+      const result = stack.push(snapshot);
+      bump();
+      return result;
+    },
+    [stack, bump]
+  );
+  const undo$1 = React__namespace.useCallback(() => {
+    const result = stack.undo();
+    if (result !== void 0) bump();
+    return result;
+  }, [stack, bump]);
+  const redo = React__namespace.useCallback(() => {
+    const result = stack.redo();
+    if (result !== void 0) bump();
+    return result;
+  }, [stack, bump]);
+  const clear = React__namespace.useCallback(() => {
+    stack.clear();
+    bump();
+  }, [stack, bump]);
+  const state = {
+    canUndo: stack.canUndo(),
+    canRedo: stack.canRedo(),
+    depth: stack.depth,
+    index: stack.index
+  };
+  return { push, undo: undo$1, redo, clear, stack, state };
+}
+
+Object.defineProperty(exports, "createUndoStack", {
+  enumerable: true,
+  get: function () { return undo.createUndoStack; }
+});
+exports.useUndoStack = useUndoStack;
+//# sourceMappingURL=undo.cjs.map
+//# sourceMappingURL=undo.cjs.map

package/dist/undo.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/undo/useUndoStack.ts"],"names":["React","createUndoStack","undo"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCO,SAAS,aAAgB,OAAA,EAa9B;AAEA,EAAA,MAAM,QAAA,GAAiBA,wBAA4B,IAAI,CAAA;AACvD,EAAA,IAAI,QAAA,CAAS,YAAY,IAAA,EAAM;AAC7B,IAAA,QAAA,CAAS,OAAA,GAAUC,qBAAmB,OAAO,CAAA;AAAA,EAC/C;AACA,EAAA,MAAM,QAAQ,QAAA,CAAS,OAAA;AAKvB,EAAA,MAAM,GAAG,OAAO,CAAA,GAAUD,0BAAS,CAAC,CAAA;AACpC,EAAA,MAAM,IAAA,GAAaA,gBAAA,CAAA,WAAA,CAAY,MAAM,OAAA,CAAQ,CAAC,MAAM,CAAA,GAAI,CAAC,CAAA,EAAG,EAAE,CAAA;AAG9D,EAAA,MAAM,IAAA,GAAaA,gBAAA,CAAA,WAAA;AAAA,IACjB,CAAC,QAAA,KAAmB;AAClB,MAAA,MAAM,MAAA,GAAS,KAAA,CAAM,IAAA,CAAK,QAAQ,CAAA;AAClC,MAAA,IAAA,EAAK;AACL,MAAA,OAAO,MAAA;AAAA,IACT,CAAA;AAAA,IACA,CAAC,OAAO,IAAI;AAAA,GACd;AAEA,EAAA,MAAME,MAAA,GAAaF,6BAAY,MAAqB;AAClD,IAAA,MAAM,MAAA,GAAS,MAAM,IAAA,EAAK;AAC1B,IAAA,IAAI,MAAA,KAAW,QAAW,IAAA,EAAK;AAC/B,IAAA,OAAO,MAAA;AAAA,EACT,CAAA,EAAG,CAAC,KAAA,EAAO,IAAI,CAAC,CAAA;AAEhB,EAAA,MAAM,IAAA,GAAaA,6BAAY,MAAqB;AAClD,IAAA,MAAM,MAAA,GAAS,MAAM,IAAA,EAAK;AAC1B,IAAA,IAAI,MAAA,KAAW,QAAW,IAAA,EAAK;AAC/B,IAAA,OAAO,MAAA;AAAA,EACT,CAAA,EAAG,CAAC,KAAA,EAAO,IAAI,CAAC,CAAA;AAEhB,EAAA,MAAM,KAAA,GAAcA,6BAAY,MAAM;AACpC,IAAA,KAAA,CAAM,KAAA,EAAM;AACZ,IAAA,IAAA,EAAK;AAAA,EACP,CAAA,EAAG,CAAC,KAAA,EAAO,IAAI,CAAC,CAAA;AAIhB,EAAA,MAAM,KAAA,GAAgC;AAAA,IACpC,OAAA,EAAS,MAAM,OAAA,EAAQ;AAAA,IACvB,OAAA,EAAS,MAAM,OAAA,EAAQ;AAAA,IACvB,OAAO,KAAA,CAAM,KAAA;AAAA,IACb,OAAO,KAAA,CAAM;AAAA,GACf;AAEA,EAAA,OAAO,EAAE,IAAA,QAAME,MAAA,EAAM,IAAA,EAAM,KAAA,EAAO,OAAO,KAAA,EAAM;AACjD","file":"undo.cjs","sourcesContent":["import * as React from 'react'\nimport { createUndoStack, type UndoStack, type UndoStackOptions } from '@iris-ui-kit/core/undo'\n\n/**\n * Reactive snapshot metadata for the UndoStack: convenience booleans that\n * update on every push/undo/redo/clear for use in UI bindings (enable/disable\n * undo/redo buttons).\n */\nexport interface UndoStackReactiveState {\n  canUndo: boolean\n  canRedo: boolean\n  depth: number\n  index: number\n}\n\n/**\n * React bridge over the framework-agnostic {@link createUndoStack}.\n * Creates the stack once (via a factory memo) and returns a stable controller\n * plus a reactive `state` that tracks `canUndo`/`canRedo`/`depth`/`index` for\n * easy UI binding. Re-renders only when those metadata change.\n *\n * The returned `push`/`undo`/`redo`/`clear` are stable refs that automatically\n * update the reactive state — no manual `setState` needed.\n *\n * @example\n *   const { push, undo, redo, state } = useUndoStack({ initial: formValues })\n *   // After mutation:\n *   push(currentValues)\n *   // In UI:\n *   <button disabled={!state.canUndo} onClick={undo}>Undo</button>\n *   <button disabled={!state.canRedo} onClick={redo}>Redo</button>\n */\nexport function useUndoStack<T>(options?: UndoStackOptions<T>): {\n  /** Push a new snapshot onto the stack. Returns the stored value. */\n  push: (snapshot: T) => T\n  /** Undo: returns the previous snapshot, or undefined if nothing to undo. */\n  undo: () => T | undefined\n  /** Redo: returns the next snapshot, or undefined if nothing to redo. */\n  redo: () => T | undefined\n  /** Clear all history. */\n  clear: () => void\n  /** The raw undo stack (stable reference, same across renders). */\n  stack: UndoStack<T>\n  /** Reactive metadata: canUndo, canRedo, depth, index. */\n  state: UndoStackReactiveState\n} {\n  // Create the stack once via factory — stable across renders.\n  const stackRef = React.useRef<UndoStack<T> | null>(null)\n  if (stackRef.current === null) {\n    stackRef.current = createUndoStack<T>(options)\n  }\n  const stack = stackRef.current\n\n  // Key to trigger re-render when undo/redo/push state changes.\n  // Incremented on every mutation so canUndo/canRedo/depth/index are\n  // always fresh in the returned `state`.\n  const [, setTick] = React.useState(0)\n  const bump = React.useCallback(() => setTick((n) => n + 1), [])\n\n  // Stable wrappers that bump the tick after each operation.\n  const push = React.useCallback(\n    (snapshot: T): T => {\n      const result = stack.push(snapshot)\n      bump()\n      return result\n    },\n    [stack, bump],\n  )\n\n  const undo = React.useCallback((): T | undefined => {\n    const result = stack.undo()\n    if (result !== undefined) bump()\n    return result\n  }, [stack, bump])\n\n  const redo = React.useCallback((): T | undefined => {\n    const result = stack.redo()\n    if (result !== undefined) bump()\n    return result\n  }, [stack, bump])\n\n  const clear = React.useCallback(() => {\n    stack.clear()\n    bump()\n  }, [stack, bump])\n\n  // Compute reactive state. `canUndo`/`canRedo` are methods on the interface,\n  // so we call them each render to get current values.\n  const state: UndoStackReactiveState = {\n    canUndo: stack.canUndo(),\n    canRedo: stack.canRedo(),\n    depth: stack.depth,\n    index: stack.index,\n  }\n\n  return { push, undo, redo, clear, stack, state }\n}\n"]}

package/dist/undo.d.cts

@@ -0,0 +1,47 @@
+import { UndoStackOptions, UndoStack } from '@iris-ui-kit/core/undo';
+export { UndoStack, UndoStackOptions, createUndoStack } from '@iris-ui-kit/core/undo';
+
+/**
+ * Reactive snapshot metadata for the UndoStack: convenience booleans that
+ * update on every push/undo/redo/clear for use in UI bindings (enable/disable
+ * undo/redo buttons).
+ */
+interface UndoStackReactiveState {
+    canUndo: boolean;
+    canRedo: boolean;
+    depth: number;
+    index: number;
+}
+/**
+ * React bridge over the framework-agnostic {@link createUndoStack}.
+ * Creates the stack once (via a factory memo) and returns a stable controller
+ * plus a reactive `state` that tracks `canUndo`/`canRedo`/`depth`/`index` for
+ * easy UI binding. Re-renders only when those metadata change.
+ *
+ * The returned `push`/`undo`/`redo`/`clear` are stable refs that automatically
+ * update the reactive state — no manual `setState` needed.
+ *
+ * @example
+ *   const { push, undo, redo, state } = useUndoStack({ initial: formValues })
+ *   // After mutation:
+ *   push(currentValues)
+ *   // In UI:
+ *   <button disabled={!state.canUndo} onClick={undo}>Undo</button>
+ *   <button disabled={!state.canRedo} onClick={redo}>Redo</button>
+ */
+declare function useUndoStack<T>(options?: UndoStackOptions<T>): {
+    /** Push a new snapshot onto the stack. Returns the stored value. */
+    push: (snapshot: T) => T;
+    /** Undo: returns the previous snapshot, or undefined if nothing to undo. */
+    undo: () => T | undefined;
+    /** Redo: returns the next snapshot, or undefined if nothing to redo. */
+    redo: () => T | undefined;
+    /** Clear all history. */
+    clear: () => void;
+    /** The raw undo stack (stable reference, same across renders). */
+    stack: UndoStack<T>;
+    /** Reactive metadata: canUndo, canRedo, depth, index. */
+    state: UndoStackReactiveState;
+};
+
+export { type UndoStackReactiveState, useUndoStack };

package/dist/undo.d.ts

@@ -0,0 +1,47 @@
+import { UndoStackOptions, UndoStack } from '@iris-ui-kit/core/undo';
+export { UndoStack, UndoStackOptions, createUndoStack } from '@iris-ui-kit/core/undo';
+
+/**
+ * Reactive snapshot metadata for the UndoStack: convenience booleans that
+ * update on every push/undo/redo/clear for use in UI bindings (enable/disable
+ * undo/redo buttons).
+ */
+interface UndoStackReactiveState {
+    canUndo: boolean;
+    canRedo: boolean;
+    depth: number;
+    index: number;
+}
+/**
+ * React bridge over the framework-agnostic {@link createUndoStack}.
+ * Creates the stack once (via a factory memo) and returns a stable controller
+ * plus a reactive `state` that tracks `canUndo`/`canRedo`/`depth`/`index` for
+ * easy UI binding. Re-renders only when those metadata change.
+ *
+ * The returned `push`/`undo`/`redo`/`clear` are stable refs that automatically
+ * update the reactive state — no manual `setState` needed.
+ *
+ * @example
+ *   const { push, undo, redo, state } = useUndoStack({ initial: formValues })
+ *   // After mutation:
+ *   push(currentValues)
+ *   // In UI:
+ *   <button disabled={!state.canUndo} onClick={undo}>Undo</button>
+ *   <button disabled={!state.canRedo} onClick={redo}>Redo</button>
+ */
+declare function useUndoStack<T>(options?: UndoStackOptions<T>): {
+    /** Push a new snapshot onto the stack. Returns the stored value. */
+    push: (snapshot: T) => T;
+    /** Undo: returns the previous snapshot, or undefined if nothing to undo. */
+    undo: () => T | undefined;
+    /** Redo: returns the next snapshot, or undefined if nothing to redo. */
+    redo: () => T | undefined;
+    /** Clear all history. */
+    clear: () => void;
+    /** The raw undo stack (stable reference, same across renders). */
+    stack: UndoStack<T>;
+    /** Reactive metadata: canUndo, canRedo, depth, index. */
+    state: UndoStackReactiveState;
+};
+
+export { type UndoStackReactiveState, useUndoStack };

package/dist/undo.js

@@ -0,0 +1,4 @@
+'use client'
+export { createUndoStack, useUndoStack } from './chunk-YAHXR2CJ.js';
+//# sourceMappingURL=undo.js.map
+//# sourceMappingURL=undo.js.map

package/dist/undo.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":";","file":"undo.js"}

package/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "@iris-ui-kit/react",
+  "version": "0.1.0",
+  "description": "React 18/19 adapter for Iris UI — full component set",
+  "license": "MIT",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./*": {
+      "types": "./dist/*.d.ts",
+      "import": "./dist/*.js",
+      "require": "./dist/*.cjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
+  "dependencies": {
+    "@floating-ui/dom": "^1.7.6",
+    "@iris-ui-kit/core": "0.1.0",
+    "@iris-ui-kit/icons": "0.1.0",
+    "@iris-ui-kit/skins": "0.0.1",
+    "@iris-ui-kit/theme": "0.1.0",
+    "@iris-ui-kit/tokens": "0.1.0"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@testing-library/react": "^16.1.0",
+    "@types/react": "^18.3.0",
+    "@types/react-dom": "^18.3.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/nousresearch/iris-ui.git"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "test": "vitest run",
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint src",
+    "clean": "rm -rf dist .turbo"
+  }
+}