@yselimcan/ui 0.0.5 → 0.0.6

package/dist/index189.js

@@ -1,7 +1,7 @@
 import { useId as f } from "./index184.js";
-import { useRefWithInit as g } from "./index101.js";
+import { useRefWithInit as g } from "./index94.js";
 import { useIsoLayoutEffect as E } from "./index126.js";
-import { isElement as d } from "./index164.js";
+import { isElement as d } from "./index123.js";
 import { useFloatingParentNodeId as S } from "./index181.js";
 import { FloatingRootStore as x } from "./index242.js";
 function v(p) {

package/dist/index19.js

@@ -1,16 +1,16 @@
 "use client";
 import * as c from "react";
-import { useDialogRootContext as h } from "./index103.js";
+import { useDialogRootContext as h } from "./index96.js";
 import { useRenderElement as M } from "./index87.js";
-import { popupStateMapping as y } from "./index105.js";
-import { transitionStatusMapping as N } from "./index106.js";
-import { DialogPopupCssVars as v } from "./index110.js";
-import { DialogPopupDataAttributes as w } from "./index111.js";
-import { useDialogPortalContext as A } from "./index112.js";
-import { useOpenChangeComplete as K } from "./index113.js";
-import { COMPOSITE_KEYS as T } from "./index114.js";
+import { popupStateMapping as y } from "./index98.js";
+import { transitionStatusMapping as N } from "./index99.js";
+import { DialogPopupCssVars as v } from "./index103.js";
+import { DialogPopupDataAttributes as w } from "./index104.js";
+import { useDialogPortalContext as A } from "./index105.js";
+import { useOpenChangeComplete as K } from "./index106.js";
+import { COMPOSITE_KEYS as T } from "./index107.js";
 import { jsx as V } from "react/jsx-runtime";
-import { FloatingFocusManager as _ } from "./index115.js";
+import { FloatingFocusManager as _ } from "./index108.js";
 const j = {
   ...y,
   ...N,

package/dist/index190.js

@@ -1,8 +1,8 @@
 import * as r from "react";
 import { useId as P } from "./index184.js";
 import { useFloatingParentNodeId as S } from "./index181.js";
-import { EMPTY_OBJECT as F } from "./index100.js";
-import { getFloatingFocusElement as y } from "./index151.js";
+import { EMPTY_OBJECT as F } from "./index122.js";
+import { getFloatingFocusElement as y } from "./index155.js";
 const T = /* @__PURE__ */ new Map([["select", "listbox"], ["combobox", "listbox"], ["label", !1]]);
 function k(c, I = {}) {
   const a = "rootStore" in c ? c.rootStore : c, l = a.useState("open"), u = a.useState("floatingId"), x = a.useState("domReferenceElement"), d = a.useState("floatingElement"), {

package/dist/index191.js

@@ -1,4 +1,4 @@
-import { createEventEmitter as n } from "./index234.js";
+import { createEventEmitter as n } from "./index221.js";
 class d {
   nodesRef = {
     current: []

package/dist/index192.js

@@ -1,7 +1,7 @@
 "use client";
 import { useRenderElement as c } from "./index87.js";
-import { useCompositeItem as u } from "./index235.js";
-import { EMPTY_OBJECT as d, EMPTY_ARRAY as t } from "./index100.js";
+import { useCompositeItem as u } from "./index222.js";
+import { EMPTY_OBJECT as d, EMPTY_ARRAY as t } from "./index122.js";
 function M(e) {
   const {
     render: l,

package/dist/index193.js

@@ -1,4 +1,4 @@
-import { isHTMLElement as r, isLastTraversableNode as e, getParentNode as i } from "./index164.js";
+import { isHTMLElement as r, isLastTraversableNode as e, getParentNode as i } from "./index123.js";
 function n(t) {
   if (r(t) && t.hasAttribute("data-rootownerid"))
     return t.getAttribute("data-rootownerid") ?? void 0;

package/dist/index194.js

@@ -1,6 +1,6 @@
 import * as c from "react";
-import { ownerDocument as i } from "./index147.js";
-import { EMPTY_OBJECT as s } from "./index100.js";
+import { ownerDocument as i } from "./index151.js";
+import { EMPTY_OBJECT as s } from "./index122.js";
 function a(u) {
   const {
     enabled: t = !0,

package/dist/index195.js

@@ -1,8 +1,8 @@
 "use client";
 import * as r from "react";
 import { useIsoLayoutEffect as a } from "./index126.js";
-import { isSafari as u } from "./index158.js";
-import { visuallyHidden as i } from "./index123.js";
+import { isSafari as u } from "./index162.js";
+import { visuallyHidden as i } from "./index129.js";
 import { jsx as f } from "react/jsx-runtime";
 const n = /* @__PURE__ */ r.forwardRef(function(e, t) {
   const [o, s] = r.useState();

package/dist/index196.js

@@ -1,15 +1,15 @@
 import * as H from "react";
 import * as te from "react-dom";
-import { isElement as re } from "./index164.js";
-import { useValueAsRef as N } from "./index128.js";
-import { useStableCallback as Y } from "./index127.js";
-import { createChangeEventDetails as C } from "./index107.js";
+import { isElement as re } from "./index123.js";
+import { useValueAsRef as N } from "./index132.js";
+import { useStableCallback as Y } from "./index124.js";
+import { createChangeEventDetails as C } from "./index100.js";
 import { getDelay as V } from "./index244.js";
 import { useFloatingTree as ne } from "./index181.js";
 import { useHoverInteractionSharedState as oe, safePolygonIdentifier as ce } from "./index243.js";
-import { triggerHover as L } from "./index108.js";
-import { getDocument as z, contains as O } from "./index151.js";
-import { isMouseLikePointerType as B } from "./index221.js";
+import { triggerHover as L } from "./index101.js";
+import { getDocument as z, contains as O } from "./index155.js";
+import { isMouseLikePointerType as B } from "./index225.js";
 function W(l) {
   return typeof l == "function" ? l() : l;
 }

package/dist/index197.js

@@ -1,6 +1,6 @@
-import { isElement as U } from "./index164.js";
-import { Timeout as Z } from "./index148.js";
-import { getTarget as $, contains as W } from "./index151.js";
+import { isElement as U } from "./index123.js";
+import { Timeout as Z } from "./index152.js";
+import { getTarget as $, contains as W } from "./index155.js";
 import { getNodeChildren as y } from "./index241.js";
 function G(u, t) {
   const [_, R] = u;

package/dist/index198.js

@@ -1,11 +1,11 @@
 import * as i from "react";
-import { getWindow as h, isElement as b, isHTMLElement as M } from "./index164.js";
-import { isMac as F, isSafari as D } from "./index158.js";
-import { useTimeout as k } from "./index148.js";
-import { createChangeEventDetails as R } from "./index107.js";
+import { getWindow as h, isElement as b, isHTMLElement as M } from "./index123.js";
+import { isMac as F, isSafari as D } from "./index162.js";
+import { useTimeout as k } from "./index152.js";
+import { createChangeEventDetails as R } from "./index100.js";
 import { createAttribute as O } from "./index237.js";
-import { activeElement as T, contains as w, getTarget as S, isTypeableElement as A, matchesFocusVisible as C, getDocument as x } from "./index151.js";
-import { triggerFocus as y, triggerPress as B, escapeKey as K } from "./index108.js";
+import { activeElement as T, contains as w, getTarget as S, isTypeableElement as A, matchesFocusVisible as C, getDocument as x } from "./index155.js";
+import { triggerFocus as y, triggerPress as B, escapeKey as K } from "./index101.js";
 const g = F && D;
 function z(a, L = {}) {
   const r = "rootStore" in a ? a.rootStore : a, {

package/dist/index199.js

@@ -1,5 +1,5 @@
 import { tabbable as r } from "./index236.js";
-import { contains as d, getDocument as b, activeElement as f } from "./index151.js";
+import { contains as d, getDocument as b, activeElement as f } from "./index155.js";
 const s = () => ({
   getShadowRoot: !0,
   displayCheck: (

package/dist/index20.js

@@ -1,8 +1,8 @@
 "use client";
 import * as n from "react";
-import { useDialogRootContext as p } from "./index103.js";
+import { useDialogRootContext as p } from "./index96.js";
 import { useRenderElement as a } from "./index87.js";
-import { useBaseUiId as c } from "./index109.js";
+import { useBaseUiId as c } from "./index102.js";
 const d = /* @__PURE__ */ n.forwardRef(function(e, i) {
   const {
     render: m,

package/dist/index200.js

@@ -1,8 +1,50 @@
-import * as t from "react";
-const e = parseInt(t.version, 10);
-function o(r) {
-  return e >= r;
+import { getEmptyRootContext as i } from "./index247.js";
+import { EMPTY_OBJECT as n } from "./index122.js";
+import { createSelector as t } from "./index203.js";
+function l() {
+  return {
+    open: !1,
+    mounted: !1,
+    transitionStatus: "idle",
+    floatingRootContext: i(),
+    preventUnmountingOnClose: !1,
+    payload: void 0,
+    activeTriggerId: null,
+    activeTriggerElement: null,
+    popupElement: null,
+    positionerElement: null,
+    activeTriggerProps: n,
+    inactiveTriggerProps: n,
+    popupProps: n
+  };
 }
+const a = {
+  open: t((e) => e.open),
+  mounted: t((e) => e.mounted),
+  transitionStatus: t((e) => e.transitionStatus),
+  floatingRootContext: t((e) => e.floatingRootContext),
+  preventUnmountingOnClose: t((e) => e.preventUnmountingOnClose),
+  payload: t((e) => e.payload),
+  activeTriggerId: t((e) => e.activeTriggerId),
+  activeTriggerElement: t((e) => e.mounted ? e.activeTriggerElement : null),
+  /**
+   * Whether the trigger with the given ID was used to open the popup.
+   */
+  isTriggerActive: t((e, o) => o !== void 0 && e.activeTriggerId === o),
+  /**
+   * Whether the popup is open and was activated by a trigger with the given ID.
+   */
+  isOpenedByTrigger: t((e, o) => o !== void 0 && e.activeTriggerId === o && e.open),
+  /**
+   * Whether the popup is mounted and was activated by a trigger with the given ID.
+   */
+  isMountedByTrigger: t((e, o) => o !== void 0 && e.activeTriggerId === o && e.mounted),
+  triggerProps: t((e, o) => o ? e.activeTriggerProps : e.inactiveTriggerProps),
+  popupProps: t((e) => e.popupProps),
+  popupElement: t((e) => e.popupElement),
+  positionerElement: t((e) => e.positionerElement)
+};
 export {
-  o as isReactVersionAtLeast
+  l as createInitialPopupStoreState,
+  a as popupStoreSelectors
 };

package/dist/index201.js

@@ -1,50 +1,202 @@
-import { getEmptyRootContext as i } from "./index247.js";
-import { EMPTY_OBJECT as n } from "./index100.js";
-import { createSelector as t } from "./index204.js";
-function l() {
-  return {
-    open: !1,
-    mounted: !1,
-    transitionStatus: "idle",
-    floatingRootContext: i(),
-    preventUnmountingOnClose: !1,
-    payload: void 0,
-    activeTriggerId: null,
-    activeTriggerElement: null,
-    popupElement: null,
-    positionerElement: null,
-    activeTriggerProps: n,
-    inactiveTriggerProps: n,
-    popupProps: n
+import * as r from "react";
+import { Store as l } from "./index150.js";
+import { useStore as a } from "./index149.js";
+import { useStableCallback as h } from "./index124.js";
+import { useIsoLayoutEffect as i } from "./index126.js";
+import { NOOP as d } from "./index122.js";
+class O extends l {
+  /**
+   * Creates a new ReactStore instance.
+   *
+   * @param state Initial state of the store.
+   * @param context Non-reactive context values.
+   * @param selectors Optional selectors for use with `useState`.
+   */
+  constructor(e, t = {}, s) {
+    super(e), this.context = t, this.selectors = s;
+  }
+  /**
+   * Non-reactive values such as refs, callbacks, etc.
+   */
+  /**
+   * Keeps track of which properties are controlled.
+   */
+  controlledValues = /* @__PURE__ */ new Map();
+  /**
+   * Synchronizes a single external value into the store.
+   *
+   * Note that the while the value in `state` is updated immediately, the value returned
+   * by `useState` is updated before the next render (similarly to React's `useState`).
+   */
+  useSyncedValue(e, t) {
+    r.useDebugValue(e), i(() => {
+      this.state[e] !== t && this.set(e, t);
+    }, [e, t]);
+  }
+  /**
+   * Synchronizes a single external value into the store and
+   * cleans it up (sets to `undefined`) on unmount.
+   *
+   * Note that the while the value in `state` is updated immediately, the value returned
+   * by `useState` is updated before the next render (similarly to React's `useState`).
+   */
+  useSyncedValueWithCleanup(e, t) {
+    i(() => (this.state[e] !== t && this.set(e, t), () => {
+      this.set(e, void 0);
+    }), [e, t]);
+  }
+  /**
+   * Synchronizes multiple external values into the store.
+   *
+   * Note that the while the values in `state` are updated immediately, the values returned
+   * by `useState` are updated before the next render (similarly to React's `useState`).
+   */
+  useSyncedValues(e) {
+    if (process.env.NODE_ENV !== "production") {
+      r.useDebugValue(e, (n) => Object.keys(n));
+      const s = r.useRef(Object.keys(e)).current, o = Object.keys(e);
+      (s.length !== o.length || s.some((n, u) => n !== o[u])) && console.error("ReactStore.useSyncedValues expects the same prop keys on every render. Keys should be stable.");
+    }
+    const t = Object.values(e);
+    i(() => {
+      this.update(e);
+    }, t);
+  }
+  /**
+   * Registers a controllable prop pair (`controlled`, `defaultValue`) for a specific key.
+   * - If `controlled` is non-undefined, the key is marked as controlled and the store's
+   *   state at `key` is updated to match `controlled`. Local writes to that key are ignored.
+   * - If `controlled` is undefined, the key is marked as uncontrolled. The store's state
+   *   is initialized to `defaultValue` on first render and can be updated with local writes.
+   */
+  useControlledProp(e, t, s) {
+    r.useDebugValue(e);
+    const o = t !== void 0;
+    if (process.env.NODE_ENV !== "production") {
+      const n = this.controlledValues.get(e);
+      n !== void 0 && n !== o && console.error(`A component is changing the ${o ? "" : "un"}controlled state of ${e.toString()} to be ${o ? "un" : ""}controlled. Elements should not switch from uncontrolled to controlled (or vice versa).`);
+    }
+    this.controlledValues.has(e) || (this.controlledValues.set(e, o), !o && !Object.is(this.state[e], s) && super.setState({
+      ...this.state,
+      [e]: s
+    })), i(() => {
+      o && !Object.is(this.state[e], t) && super.setState({
+        ...this.state,
+        [e]: t
+      });
+    }, [e, t, s, o]);
+  }
+  /**
+   * Sets a specific key in the store's state to a new value and notifies listeners if the value has changed.
+   * If the key is controlled (registered via {@link useControlledProp} with a non-undefined value),
+   * the update is ignored and no listeners are notified.
+   *
+   * @param key The state key to update.
+   * @param value The new value to set for the specified key.
+   */
+  set(e, t) {
+    this.controlledValues.get(e) !== !0 && super.set(e, t);
+  }
+  /**
+   * Merges the provided changes into the current state and notifies listeners if there are changes.
+   * Controlled keys are filtered out and not updated.
+   *
+   * @param values An object containing the changes to apply to the current state.
+   */
+  update(e) {
+    const t = {
+      ...e
+    };
+    for (const s in t)
+      if (Object.hasOwn(t, s) && this.controlledValues.get(s) === !0) {
+        delete t[s];
+        continue;
+      }
+    super.update(t);
+  }
+  /**
+   * Updates the entire store's state and notifies all registered listeners.
+   * Controlled keys are left unchanged; only uncontrolled keys from `newState` are applied.
+   *
+   * @param newState The new state to set for the store.
+   */
+  setState(e) {
+    const t = {
+      ...e
+    };
+    for (const s in t)
+      if (Object.hasOwn(t, s) && this.controlledValues.get(s) === !0) {
+        delete t[s];
+        continue;
+      }
+    super.setState({
+      ...this.state,
+      ...t
+    });
+  }
+  /** Gets the current value from the store using a selector with the provided key.
+   *
+   * @param key Key of the selector to use.
+   */
+  select = (e, t, s, o) => {
+    const n = this.selectors[e];
+    return n(this.state, t, s, o);
   };
-}
-const a = {
-  open: t((e) => e.open),
-  mounted: t((e) => e.mounted),
-  transitionStatus: t((e) => e.transitionStatus),
-  floatingRootContext: t((e) => e.floatingRootContext),
-  preventUnmountingOnClose: t((e) => e.preventUnmountingOnClose),
-  payload: t((e) => e.payload),
-  activeTriggerId: t((e) => e.activeTriggerId),
-  activeTriggerElement: t((e) => e.mounted ? e.activeTriggerElement : null),
   /**
-   * Whether the trigger with the given ID was used to open the popup.
+   * Returns a value from the store's state using a selector function.
+   * Used to subscribe to specific parts of the state.
+   * This methods causes a rerender whenever the selected state changes.
+   *
+   * @param key Key of the selector to use.
    */
-  isTriggerActive: t((e, o) => o !== void 0 && e.activeTriggerId === o),
+  useState = (e, t, s, o) => {
+    r.useDebugValue(e);
+    const n = this.selectors[e];
+    return a(this, n, t, s, o);
+  };
   /**
-   * Whether the popup is open and was activated by a trigger with the given ID.
+   * Wraps a function with `useStableCallback` to ensure it has a stable reference
+   * and assigns it to the context.
+   *
+   * @param key Key of the event callback. Must be a function in the context.
+   * @param fn Function to assign.
    */
-  isOpenedByTrigger: t((e, o) => o !== void 0 && e.activeTriggerId === o && e.open),
+  useContextCallback(e, t) {
+    r.useDebugValue(e);
+    const s = h(t ?? d);
+    this.context[e] = s;
+  }
   /**
-   * Whether the popup is mounted and was activated by a trigger with the given ID.
+   * Returns a stable setter function for a specific key in the store's state.
+   * It's commonly used to pass as a ref callback to React elements.
+   *
+   * @param key Key of the state to set.
    */
-  isMountedByTrigger: t((e, o) => o !== void 0 && e.activeTriggerId === o && e.mounted),
-  triggerProps: t((e, o) => o ? e.activeTriggerProps : e.inactiveTriggerProps),
-  popupProps: t((e) => e.popupProps),
-  popupElement: t((e) => e.popupElement),
-  positionerElement: t((e) => e.positionerElement)
-};
+  useStateSetter(e) {
+    const t = r.useRef(void 0);
+    return t.current === void 0 && (t.current = (s) => {
+      this.set(e, s);
+    }), t.current;
+  }
+  /**
+   * Observes changes derived from the store's selectors and calls the listener when the selected value changes.
+   *
+   * @param key Key of the selector to observe.
+   * @param listener Listener function called when the selector result changes.
+   */
+  observe(e, t) {
+    let s;
+    typeof e == "function" ? s = e : s = this.selectors[e];
+    let o = s(this.state);
+    return t(o, o, this), this.subscribe((n) => {
+      const u = s(n);
+      if (!Object.is(o, u)) {
+        const c = o;
+        o = u, t(u, c, this);
+      }
+    });
+  }
+}
 export {
-  l as createInitialPopupStoreState,
-  a as popupStoreSelectors
+  O as ReactStore
 };