@yselimcan/ui 0.0.7 → 0.0.8

package/dist/index217.js

@@ -1,19 +1,50 @@
-import * as n from "react";
-function e(i) {
-  const o = n.useRef(""), c = n.useCallback((r) => {
-    r.defaultPrevented || (o.current = r.pointerType, i(r, r.pointerType));
-  }, [i]);
+import { getEmptyRootContext as i } from "./index249.js";
+import { EMPTY_OBJECT as n } from "./index100.js";
+import { createSelector as t } from "./index220.js";
+function l() {
   return {
-    onClick: n.useCallback((r) => {
-      if (r.detail === 0) {
-        i(r, "keyboard");
-        return;
-      }
-      "pointerType" in r && i(r, r.pointerType), i(r, o.current), o.current = "";
-    }, [i]),
-    onPointerDown: c
+    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 {
-  e as useEnhancedClickHandler
+  l as createInitialPopupStoreState,
+  a as popupStoreSelectors
 };

package/dist/index218.js

@@ -1,17 +1,202 @@
-function o() {
-  const t = /* @__PURE__ */ new Map();
-  return {
-    emit(e, a) {
-      t.get(e)?.forEach((n) => n(a));
-    },
-    on(e, a) {
-      t.has(e) || t.set(e, /* @__PURE__ */ new Set()), t.get(e).add(a);
-    },
-    off(e, a) {
-      t.get(e)?.delete(a);
+import * as r from "react";
+import { Store as l } from "./index146.js";
+import { useStore as a } from "./index145.js";
+import { useStableCallback as h } from "./index127.js";
+import { useIsoLayoutEffect as i } from "./index126.js";
+import { NOOP as d } from "./index100.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);
+  };
+  /**
+   * 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.
+   */
+  useState = (e, t, s, o) => {
+    r.useDebugValue(e);
+    const n = this.selectors[e];
+    return a(this, n, t, s, o);
   };
+  /**
+   * 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.
+   */
+  useContextCallback(e, t) {
+    r.useDebugValue(e);
+    const s = h(t ?? d);
+    this.context[e] = s;
+  }
+  /**
+   * 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.
+   */
+  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 {
-  o as createEventEmitter
+  O as ReactStore
 };

package/dist/index219.js

@@ -1,35 +1,50 @@
-"use client";
-import * as r from "react";
-import { useMergedRefs as p } from "./index101.js";
-import { useCompositeRootContext as h } from "./index98.js";
-import { useCompositeListItem as g } from "./index110.js";
-function I(m = {}) {
-  const {
-    highlightItemOnHover: s,
-    highlightedIndex: c,
-    onHighlightedIndexChange: i
-  } = h(), {
-    ref: u,
-    index: e
-  } = g(m), t = c === e, n = r.useRef(null), d = p(u, n);
-  return {
-    compositeProps: r.useMemo(() => ({
-      tabIndex: t ? 0 : -1,
-      onFocus() {
-        i(e);
-      },
-      onMouseMove() {
-        const o = n.current;
-        if (!s || !o)
-          return;
-        const f = o.hasAttribute("disabled") || o.ariaDisabled === "true";
-        !t && !f && o.focus();
-      }
-    }), [t, i, e, s]),
-    compositeRef: d,
-    index: e
-  };
+import i from "./index94.js";
+class a {
+  constructor() {
+    this.elements = /* @__PURE__ */ new Set(), this.idMap = /* @__PURE__ */ new Map();
+  }
+  /**
+   * Adds a trigger element with the given ID.
+   *
+   * Note: The provided element is assumed to not be registered under multiple IDs.
+   */
+  add(e, t) {
+    const s = this.idMap.get(e);
+    if (s !== t && (s !== void 0 && this.elements.delete(s), this.elements.add(t), this.idMap.set(e, t), process.env.NODE_ENV !== "production" && this.elements.size !== this.idMap.size))
+      throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: A trigger element cannot be registered under multiple IDs in PopupTriggerMap." : i(87));
+  }
+  /**
+   * Removes the trigger element with the given ID.
+   */
+  delete(e) {
+    const t = this.idMap.get(e);
+    t && (this.elements.delete(t), this.idMap.delete(e));
+  }
+  /**
+   * Whether the given element is registered as a trigger.
+   */
+  hasElement(e) {
+    return this.elements.has(e);
+  }
+  /**
+   * Whether there is a registered trigger element matching the given predicate.
+   */
+  hasMatchingElement(e) {
+    for (const t of this.elements)
+      if (e(t))
+        return !0;
+    return !1;
+  }
+  getById(e) {
+    return this.idMap.get(e);
+  }
+  entries() {
+    return this.idMap.entries();
+  }
+  get size() {
+    return this.idMap.size;
+  }
 }
 export {
-  I as useCompositeItem
+  a as PopupTriggerMap
 };

package/dist/index22.js

@@ -1,11 +1,11 @@
 "use client";
 import * as s from "react";
-import { inertValue as m } from "./index129.js";
-import { useDialogRootContext as d } from "./index195.js";
-import { DialogPortalContext as c } from "./index199.js";
-import { InternalBackdrop as u } from "./index132.js";
+import { inertValue as m } from "./index116.js";
+import { useDialogRootContext as d } from "./index103.js";
+import { DialogPortalContext as c } from "./index112.js";
+import { InternalBackdrop as u } from "./index117.js";
 import { jsx as n, jsxs as f } from "react/jsx-runtime";
-import { FloatingPortal as p } from "./index128.js";
+import { FloatingPortal as p } from "./index118.js";
 const P = /* @__PURE__ */ s.forwardRef(function(t, a) {
   const {
     keepMounted: r = !1,

package/dist/index220.js

@@ -1,6 +1,22 @@
-let a = /* @__PURE__ */ (function(d) {
-  return d.disabled = "data-disabled", d.valid = "data-valid", d.invalid = "data-invalid", d.touched = "data-touched", d.dirty = "data-dirty", d.filled = "data-filled", d.focused = "data-focused", d;
-})({});
+import t from "./index94.js";
+import { createSelectorCreator as s, lruMemoize as i } from "./index250.js";
+s({
+  memoize: i,
+  memoizeOptions: {
+    maxSize: 1,
+    equalityCheck: Object.is
+  }
+});
+const u = (e, m, c, n, l, p, ...o) => {
+  if (o.length > 0)
+    throw new Error(process.env.NODE_ENV !== "production" ? "Unsupported number of selectors" : t(1));
+  let r;
+  if (e)
+    r = e;
+  else
+    throw new Error("Missing arguments");
+  return r;
+};
 export {
-  a as FieldControlDataAttributes
+  u as createSelector
 };

package/dist/index221.js

@@ -1,14 +1,35 @@
-function t(r) {
-  if (r == null)
-    return "";
-  if (typeof r == "string")
-    return r;
-  try {
-    return JSON.stringify(r);
-  } catch {
-    return String(r);
-  }
+"use client";
+import * as r from "react";
+import { useMergedRefs as p } from "./index95.js";
+import { useCompositeRootContext as h } from "./index190.js";
+import { useCompositeListItem as g } from "./index165.js";
+function I(m = {}) {
+  const {
+    highlightItemOnHover: s,
+    highlightedIndex: c,
+    onHighlightedIndexChange: i
+  } = h(), {
+    ref: u,
+    index: e
+  } = g(m), t = c === e, n = r.useRef(null), d = p(u, n);
+  return {
+    compositeProps: r.useMemo(() => ({
+      tabIndex: t ? 0 : -1,
+      onFocus() {
+        i(e);
+      },
+      onMouseMove() {
+        const o = n.current;
+        if (!s || !o)
+          return;
+        const f = o.hasAttribute("disabled") || o.ariaDisabled === "true";
+        !t && !f && o.focus();
+      }
+    }), [t, i, e, s]),
+    compositeRef: d,
+    index: e
+  };
 }
 export {
-  t as serializeValue
+  I as useCompositeItem
 };

package/dist/index222.js

@@ -1,12 +1,9 @@
-function n(e, t) {
-  return {
-    ...e,
-    state: {
-      ...e.state,
-      valid: !t && e.state.valid
-    }
-  };
+"use client";
+import * as e from "react";
+const n = [];
+function o(t) {
+  e.useEffect(t, n);
 }
 export {
-  n as getCombinedFieldValidityData
+  o as useOnMount
 };

package/dist/index223.js

@@ -1,41 +1,29 @@
-import e from "./index100.js";
-import * as t from "react";
-const n = /* @__PURE__ */ t.createContext(void 0);
-process.env.NODE_ENV !== "production" && (n.displayName = "ComboboxRootContext");
-const s = /* @__PURE__ */ t.createContext(void 0);
-process.env.NODE_ENV !== "production" && (s.displayName = "ComboboxFloatingContext");
-const r = /* @__PURE__ */ t.createContext(void 0);
-process.env.NODE_ENV !== "production" && (r.displayName = "ComboboxDerivedItemsContext");
-const i = /* @__PURE__ */ t.createContext("");
-process.env.NODE_ENV !== "production" && (i.displayName = "ComboboxInputValueContext");
-function b() {
-  const o = t.useContext(n);
-  if (!o)
-    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: ComboboxRootContext is missing. Combobox parts must be placed within <Combobox.Root>." : e(22));
-  return o;
-}
-function C() {
-  const o = t.useContext(s);
-  if (!o)
-    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: ComboboxFloatingContext is missing. Combobox parts must be placed within <Combobox.Root>." : e(23));
-  return o;
-}
-function m() {
-  const o = t.useContext(r);
-  if (!o)
-    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: ComboboxItemsContext is missing. Combobox parts must be placed within <Combobox.Root>." : e(24));
-  return o;
-}
-function c() {
-  return t.useContext(i);
+"use client";
+import * as l from "react-dom";
+import { useAnimationFrame as m } from "./index160.js";
+import { useStableCallback as u } from "./index127.js";
+import { resolveRef as c } from "./index242.js";
+function S(s, f = !1, a = !0) {
+  const i = m();
+  return u((r, t = null) => {
+    i.cancel();
+    const e = c(s);
+    e != null && (typeof e.getAnimations != "function" || globalThis.BASE_UI_ANIMATIONS_DISABLED ? r() : i.request(() => {
+      function o() {
+        e && Promise.all(e.getAnimations().map((n) => n.finished)).then(() => {
+          t != null && t.aborted || l.flushSync(r);
+        }).catch(() => {
+          if (a) {
+            if (t != null && t.aborted)
+              return;
+            l.flushSync(r);
+          } else e.getAnimations().length > 0 && e.getAnimations().some((n) => n.pending || n.playState !== "finished") && o();
+        });
+      }
+      f ? i.request(o) : o();
+    }));
+  });
 }
 export {
-  r as ComboboxDerivedItemsContext,
-  s as ComboboxFloatingContext,
-  i as ComboboxInputValueContext,
-  n as ComboboxRootContext,
-  m as useComboboxDerivedItemsContext,
-  C as useComboboxFloatingContext,
-  c as useComboboxInputValueContext,
-  b as useComboboxRootContext
+  S as useAnimationsFinished
 };

package/dist/index224.js

@@ -1,59 +1,14 @@
-import { compareItemEquality as l } from "./index179.js";
-import { createSelector as t } from "./index213.js";
-const u = {
-  id: t((e) => e.id),
-  query: t((e) => e.query),
-  items: t((e) => e.items),
-  selectedValue: t((e) => e.selectedValue),
-  open: t((e) => e.open),
-  mounted: t((e) => e.mounted),
-  forceMounted: t((e) => e.forceMounted),
-  inline: t((e) => e.inline),
-  activeIndex: t((e) => e.activeIndex),
-  selectedIndex: t((e) => e.selectedIndex),
-  isActive: t((e, i) => e.activeIndex === i),
-  isSelected: t((e, i) => {
-    const n = e.isItemEqualToValue, o = e.selectedValue;
-    return Array.isArray(o) ? o.some((p) => l(p, i, n)) : l(o, i, n);
-  }),
-  transitionStatus: t((e) => e.transitionStatus),
-  popupProps: t((e) => e.popupProps),
-  inputProps: t((e) => e.inputProps),
-  triggerProps: t((e) => e.triggerProps),
-  getItemProps: t((e) => e.getItemProps),
-  positionerElement: t((e) => e.positionerElement),
-  listElement: t((e) => e.listElement),
-  triggerElement: t((e) => e.triggerElement),
-  inputElement: t((e) => e.inputElement),
-  popupSide: t((e) => e.popupSide),
-  openMethod: t((e) => e.openMethod),
-  inputInsidePopup: t((e) => e.inputInsidePopup),
-  selectionMode: t((e) => e.selectionMode),
-  listRef: t((e) => e.listRef),
-  labelsRef: t((e) => e.labelsRef),
-  popupRef: t((e) => e.popupRef),
-  emptyRef: t((e) => e.emptyRef),
-  inputRef: t((e) => e.inputRef),
-  keyboardActiveRef: t((e) => e.keyboardActiveRef),
-  chipsContainerRef: t((e) => e.chipsContainerRef),
-  clearRef: t((e) => e.clearRef),
-  valuesRef: t((e) => e.valuesRef),
-  allValuesRef: t((e) => e.allValuesRef),
-  name: t((e) => e.name),
-  disabled: t((e) => e.disabled),
-  readOnly: t((e) => e.readOnly),
-  required: t((e) => e.required),
-  grid: t((e) => e.grid),
-  isGrouped: t((e) => e.isGrouped),
-  virtualized: t((e) => e.virtualized),
-  onOpenChangeComplete: t((e) => e.onOpenChangeComplete),
-  openOnInputClick: t((e) => e.openOnInputClick),
-  itemToStringLabel: t((e) => e.itemToStringLabel),
-  isItemEqualToValue: t((e) => e.isItemEqualToValue),
-  modal: t((e) => e.modal),
-  autoHighlight: t((e) => e.autoHighlight),
-  submitOnItemClick: t((e) => e.submitOnItemClick)
-};
+function t(r) {
+  if (r == null)
+    return "";
+  if (typeof r == "string")
+    return r;
+  try {
+    return JSON.stringify(r);
+  } catch {
+    return String(r);
+  }
+}
 export {
-  u as selectors
+  t as serializeValue
 };