@als-tp/als-react-ts-ui 0.5.1 → 0.5.2

package/dist/als-react-ts-ui314.js

@@ -1,202 +1,35 @@
-import * as r from "react";
-import { Store as l } from "./als-react-ts-ui407.js";
-import { useStore as a } from "./als-react-ts-ui408.js";
-import { useStableCallback as h } from "./als-react-ts-ui266.js";
-import { useIsoLayoutEffect as i } from "./als-react-ts-ui267.js";
-import { NOOP as d } from "./als-react-ts-ui304.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);
-      }
-    });
-  }
-}
+import * as e from "react";
+import { useRenderElement as p } from "./als-react-ts-ui220.js";
+import { useToolbarRootContext as u } from "./als-react-ts-ui364.js";
+import { ToolbarGroupContext as c } from "./als-react-ts-ui566.js";
+import { jsx as b } from "react/jsx-runtime";
+const f = /* @__PURE__ */ e.forwardRef(function(r, s) {
+  const {
+    className: T,
+    disabled: a = !1,
+    render: v,
+    ...l
+  } = r, {
+    orientation: t,
+    disabled: n
+  } = u(), o = n || a, i = e.useMemo(() => ({
+    disabled: o
+  }), [o]), d = e.useMemo(() => ({
+    disabled: o,
+    orientation: t
+  }), [o, t]), m = p("div", r, {
+    state: d,
+    ref: s,
+    props: [{
+      role: "group"
+    }, l]
+  });
+  return /* @__PURE__ */ b(c.Provider, {
+    value: i,
+    children: m
+  });
+});
+process.env.NODE_ENV !== "production" && (f.displayName = "ToolbarGroup");
 export {
-  O as ReactStore
+  f as ToolbarGroup
 };

package/dist/als-react-ts-ui315.js

@@ -1,50 +1,19 @@
-import i from "./als-react-ts-ui242.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;
-  }
-}
+import * as e from "react";
+import { useToolbarRootContext as i } from "./als-react-ts-ui364.js";
+import { jsx as n } from "react/jsx-runtime";
+import { Separator as p } from "./als-react-ts-ui107.js";
+const c = /* @__PURE__ */ e.forwardRef(function(o, r) {
+  const t = i(), a = {
+    vertical: "horizontal",
+    horizontal: "vertical"
+  }[t.orientation];
+  return /* @__PURE__ */ n(p, {
+    orientation: a,
+    ...o,
+    ref: r
+  });
+});
+process.env.NODE_ENV !== "production" && (c.displayName = "ToolbarSeparator");
 export {
-  a as PopupTriggerMap
+  c as ToolbarSeparator
 };

package/dist/als-react-ts-ui316.js

@@ -1,22 +1,56 @@
-import t from "./als-react-ts-ui242.js";
-import { createSelectorCreator as s, lruMemoize as i } from "./als-react-ts-ui418.js";
-s({
-  memoize: i,
-  memoizeOptions: {
-    maxSize: 1,
-    equalityCheck: Object.is
-  }
+import * as s from "react";
+import { useFocusableWhenDisabled as D } from "./als-react-ts-ui342.js";
+import { ARROW_LEFT as R, ARROW_RIGHT as T } from "./als-react-ts-ui281.js";
+import { useToolbarRootContext as N } from "./als-react-ts-ui364.js";
+import { useToolbarGroupContext as P } from "./als-react-ts-ui566.js";
+import { CompositeItem as x } from "./als-react-ts-ui488.js";
+import { jsx as C } from "react/jsx-runtime";
+import { stopEvent as I } from "./als-react-ts-ui305.js";
+const W = /* @__PURE__ */ s.forwardRef(function(a, n) {
+  const {
+    className: i,
+    focusableWhenDisabled: t = !0,
+    render: p,
+    disabled: l = !1,
+    ...m
+  } = a, f = s.useMemo(() => ({
+    focusableWhenDisabled: t
+  }), [t]), {
+    disabled: u,
+    orientation: r
+  } = N(), d = P(), e = u || (d?.disabled ?? !1) || l, {
+    props: c
+  } = D({
+    composite: !0,
+    disabled: e,
+    focusableWhenDisabled: t,
+    isNativeButton: !1
+  }), b = s.useMemo(() => ({
+    disabled: e,
+    orientation: r,
+    focusable: t
+  }), [e, t, r]);
+  return /* @__PURE__ */ C(x, {
+    tag: "input",
+    render: p,
+    className: i,
+    metadata: f,
+    state: b,
+    refs: [n],
+    props: [{
+      onClick(o) {
+        e && o.preventDefault();
+      },
+      onKeyDown(o) {
+        o.key !== R && o.key !== T && e && I(o);
+      },
+      onPointerDown(o) {
+        e && o.preventDefault();
+      }
+    }, m, c]
+  });
 });
-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;
-};
+process.env.NODE_ENV !== "production" && (W.displayName = "ToolbarInput");
 export {
-  u as createSelector
+  W as ToolbarInput
 };

package/dist/als-react-ts-ui317.js

@@ -1,8 +1,11 @@
-import * as t from "react";
-const e = parseInt(t.version, 10);
-function o(r) {
-  return e >= r;
+import * as n from "react";
+import { isReactVersionAtLeast as o } from "./als-react-ts-ui339.js";
+function s(t) {
+  if (!/* @__PURE__ */ n.isValidElement(t))
+    return null;
+  const e = t, r = e.props;
+  return (o(19) ? r?.ref : e.ref) ?? null;
 }
 export {
-  o as isReactVersionAtLeast
+  s as getReactElementRef
 };

package/dist/als-react-ts-ui318.js

@@ -1,19 +1,14 @@
-import { useIsoLayoutEffect as r } from "./als-react-ts-ui267.js";
-import { useRefWithInit as n } from "./als-react-ts-ui222.js";
-function s(e) {
-  const t = n(f, e).current;
-  return t.next = e, r(t.effect), t;
-}
-function f(e) {
-  const t = {
-    current: e,
-    next: e,
-    effect: () => {
-      t.current = t.next;
-    }
-  };
-  return t;
+function n(e, r) {
+  if (e && !r)
+    return e;
+  if (!e && r)
+    return r;
+  if (e || r)
+    return {
+      ...e,
+      ...r
+    };
 }
 export {
-  s as useValueAsRef
+  n as mergeObjects
 };

package/dist/als-react-ts-ui319.js

@@ -1,28 +1,16 @@
-import * as l from "react-dom";
-import { useAnimationFrame as m } from "./als-react-ts-ui346.js";
-import { useStableCallback as u } from "./als-react-ts-ui266.js";
-import { resolveRef as c } from "./als-react-ts-ui365.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();
-    }));
-  });
+function i(r, n) {
+  const o = {};
+  for (const t in r) {
+    const e = r[t];
+    if (n?.hasOwnProperty(t)) {
+      const s = n[t](e);
+      s != null && Object.assign(o, s);
+      continue;
+    }
+    e === !0 ? o[`data-${t.toLowerCase()}`] = "" : e && (o[`data-${t.toLowerCase()}`] = e.toString());
+  }
+  return o;
 }
 export {
-  S as useAnimationsFinished
+  i as getStateAttributesProps
 };

package/dist/als-react-ts-ui32.js

@@ -1,4 +1,4 @@
-import { ALSTabsPanel as a, ALSTabsIndicator as o, ALSTabsTab as s, ALSTabsList as t, ALSTabsRoot as b } from "./als-react-ts-ui298.js";
+import { ALSTabsPanel as a, ALSTabsIndicator as o, ALSTabsTab as s, ALSTabsList as t, ALSTabsRoot as b } from "./als-react-ts-ui266.js";
 const T = {
   Root: b,
   List: t,

package/dist/als-react-ts-ui320.js

@@ -1,136 +1,6 @@
-function c() {
-  return typeof window < "u";
-}
-function u(t) {
-  return p(t) ? (t.nodeName || "").toLowerCase() : "#document";
-}
-function i(t) {
-  var e;
-  return (t == null || (e = t.ownerDocument) == null ? void 0 : e.defaultView) || window;
-}
-function N(t) {
-  var e;
-  return (e = (p(t) ? t.ownerDocument : t.document) || window.document) == null ? void 0 : e.documentElement;
-}
-function p(t) {
-  return c() ? t instanceof Node || t instanceof i(t).Node : !1;
-}
-function m(t) {
-  return c() ? t instanceof Element || t instanceof i(t).Element : !1;
-}
-function w(t) {
-  return c() ? t instanceof HTMLElement || t instanceof i(t).HTMLElement : !1;
-}
-function f(t) {
-  return !c() || typeof ShadowRoot > "u" ? !1 : t instanceof ShadowRoot || t instanceof i(t).ShadowRoot;
-}
-const E = /* @__PURE__ */ new Set(["inline", "contents"]);
-function y(t) {
-  const {
-    overflow: e,
-    overflowX: n,
-    overflowY: o,
-    display: r
-  } = S(t);
-  return /auto|scroll|overlay|hidden|clip/.test(e + o + n) && !E.has(r);
-}
-const T = /* @__PURE__ */ new Set(["table", "td", "th"]);
-function A(t) {
-  return T.has(u(t));
-}
-const v = [":popover-open", ":modal"];
-function L(t) {
-  return v.some((e) => {
-    try {
-      return t.matches(e);
-    } catch {
-      return !1;
-    }
-  });
-}
-const D = ["transform", "translate", "scale", "rotate", "perspective"], C = ["transform", "translate", "scale", "rotate", "perspective", "filter"], k = ["paint", "layout", "strict", "content"];
-function V(t) {
-  const e = O(), n = m(t) ? S(t) : t;
-  return D.some((o) => n[o] ? n[o] !== "none" : !1) || (n.containerType ? n.containerType !== "normal" : !1) || !e && (n.backdropFilter ? n.backdropFilter !== "none" : !1) || !e && (n.filter ? n.filter !== "none" : !1) || C.some((o) => (n.willChange || "").includes(o)) || k.some((o) => (n.contain || "").includes(o));
-}
-function B(t) {
-  let e = s(t);
-  for (; w(e) && !h(e); ) {
-    if (V(e))
-      return e;
-    if (L(e))
-      return null;
-    e = s(e);
-  }
-  return null;
-}
-function O() {
-  return typeof CSS > "u" || !CSS.supports ? !1 : CSS.supports("-webkit-backdrop-filter", "none");
-}
-const R = /* @__PURE__ */ new Set(["html", "body", "#document"]);
-function h(t) {
-  return R.has(u(t));
-}
-function S(t) {
-  return i(t).getComputedStyle(t);
-}
-function F(t) {
-  return m(t) ? {
-    scrollLeft: t.scrollLeft,
-    scrollTop: t.scrollTop
-  } : {
-    scrollLeft: t.scrollX,
-    scrollTop: t.scrollY
-  };
-}
-function s(t) {
-  if (u(t) === "html")
-    return t;
-  const e = (
-    // Step into the shadow DOM of the parent of a slotted node.
-    t.assignedSlot || // DOM Element detected.
-    t.parentNode || // ShadowRoot detected.
-    f(t) && t.host || // Fallback.
-    N(t)
-  );
-  return f(e) ? e.host : e;
-}
-function b(t) {
-  const e = s(t);
-  return h(e) ? t.ownerDocument ? t.ownerDocument.body : t.body : w(e) && y(e) ? e : b(e);
-}
-function d(t, e, n) {
-  var o;
-  e === void 0 && (e = []), n === void 0 && (n = !0);
-  const r = b(t), g = r === ((o = t.ownerDocument) == null ? void 0 : o.body), l = i(r);
-  if (g) {
-    const a = _(l);
-    return e.concat(l, l.visualViewport || [], y(r) ? r : [], a && n ? d(a) : []);
-  }
-  return e.concat(r, d(r, [], n));
-}
-function _(t) {
-  return t.parent && Object.getPrototypeOf(t.parent) ? t.frameElement : null;
+function t(n, o) {
+  return typeof n == "function" ? n(o) : n;
 }
 export {
-  S as getComputedStyle,
-  B as getContainingBlock,
-  N as getDocumentElement,
-  _ as getFrameElement,
-  b as getNearestOverflowAncestor,
-  u as getNodeName,
-  F as getNodeScroll,
-  d as getOverflowAncestors,
-  s as getParentNode,
-  i as getWindow,
-  V as isContainingBlock,
-  m as isElement,
-  w as isHTMLElement,
-  h as isLastTraversableNode,
-  p as isNode,
-  y as isOverflowElement,
-  f as isShadowRoot,
-  A as isTableElement,
-  L as isTopLayer,
-  O as isWebKit
+  t as resolveClassName
 };

package/dist/als-react-ts-ui321.js

@@ -1,11 +1,6 @@
-let o;
-process.env.NODE_ENV !== "production" && (o = /* @__PURE__ */ new Set());
-function s(...r) {
-  if (process.env.NODE_ENV !== "production") {
-    const e = r.join(" ");
-    o.has(e) || (o.add(e), console.error(`Base UI: ${e}`));
-  }
+function e(n, o) {
+  return typeof n == "function" ? n(o) : n;
 }
 export {
-  s as error
+  e as resolveStyle
 };

package/dist/als-react-ts-ui322.js

@@ -1,14 +1,8 @@
-import n from "./als-react-ts-ui242.js";
-import * as t from "react";
-const e = /* @__PURE__ */ t.createContext(void 0);
-process.env.NODE_ENV !== "production" && (e.displayName = "CompositeRootContext");
-function r(s = !1) {
-  const o = t.useContext(e);
-  if (o === void 0 && !s)
-    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: CompositeRootContext is missing. Composite parts must be placed within <Composite.Root>." : n(16));
-  return o;
+function e() {
 }
+const t = Object.freeze([]), c = Object.freeze({});
 export {
-  e as CompositeRootContext,
-  r as useCompositeRootContext
+  t as EMPTY_ARRAY,
+  c as EMPTY_OBJECT,
+  e as NOOP
 };