@expcat/tigercat-react 1.3.3 → 1.4.0

package/dist/{chunk-V4JIZN3E.mjs → chunk-L6KSO66F.mjs}

@@ -1,6 +1,6 @@
 import {
   useControlledState
-} from "./chunk-UQMPEMY7.mjs";
+} from "./chunk-WHYHLUXG.mjs";
 
 // src/components/RichTextEditor.tsx
 import { useRef, useState, useCallback, useEffect, useMemo } from "react";
@@ -37,18 +37,11 @@ var RichTextEditor = ({
 }) => {
   const editorRef = useRef(null);
   const engineRef = useRef(null);
-  const [currentContent, setInternalValue, isControlled] = useControlledState(value, defaultValue);
+  const [currentContent, setContent] = useControlledState(value, defaultValue, onChange);
+  const isControlled = value !== void 0;
   const [activeFormats, setActiveFormats] = useState(/* @__PURE__ */ new Set());
   const toolbarItems = toolbar ?? defaultToolbar;
   const empty = isContentEmpty(currentContent);
-  const onChangeRef = useRef(onChange);
-  const setInternalValueRef = useRef(setInternalValue);
-  const isControlledRef = useRef(isControlled);
-  useEffect(() => {
-    onChangeRef.current = onChange;
-    setInternalValueRef.current = setInternalValue;
-    isControlledRef.current = isControlled;
-  }, [onChange, setInternalValue, isControlled]);
   useEffect(() => {
     if (!editorRef.current) return;
     const factory = engine ?? builtinRichTextEngine;
@@ -60,8 +53,7 @@ var RichTextEditor = ({
       placeholder,
       toolbar: toolbarItems,
       notifyChange(html) {
-        if (!isControlledRef.current) setInternalValueRef.current(html);
-        onChangeRef.current?.(html);
+        setContent(html);
       },
       notifyActiveFormats(next) {
         setActiveFormats(next);

package/dist/{chunk-4LX5UGPQ.js → chunk-LJRCEB7F.js}

@@ -4,23 +4,21 @@
 var _chunkSTTQ5LXXjs = require('./chunk-STTQ5LXX.js');
 
 // src/components/Menu.tsx
-
-
-
-
-
-
-
-
-
 var _react = require('react'); var _react2 = _interopRequireDefault(_react);
 
 
 
 
+var _tigercatcore = require('@expcat/tigercat-core');
 
+// src/components/Menu/context.ts
 
+var MenuContext = _react.createContext.call(void 0, null);
+function useMenuContext() {
+  return _react.useContext.call(void 0, MenuContext);
+}
 
+// src/components/Menu/state.ts
 
 
 
@@ -30,52 +28,31 @@ var _react = require('react'); var _react2 = _interopRequireDefault(_react);
 
 
 
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-var _tigercatcore = require('@expcat/tigercat-core');
-var _jsxruntime = require('react/jsx-runtime');
-var MenuContext = _react.createContext.call(void 0, null);
-function useMenuContext() {
-  return _react.useContext.call(void 0, MenuContext);
-}
-var Menu = ({
-  items,
-  mode = "vertical",
-  theme = "light",
-  selectedKeys: controlledSelectedKeys,
-  defaultSelectedKeys = [],
-  openKeys: controlledOpenKeys,
-  defaultOpenKeys = [],
-  collapsed = false,
-  multiple = true,
-  inlineIndent = 24,
-  popupPortal = false,
-  className,
-  style,
-  onSelect,
-  onOpenChange,
-  onSearch,
-  searchable = false,
-  searchValue: controlledSearchValue,
-  defaultSearchValue = "",
-  searchPlaceholder = "Search menu",
-  emptyText = "No menu items found",
-  children
-}) => {
+function useMenuRootState(props) {
+  const {
+    items,
+    mode = "vertical",
+    theme = "light",
+    selectedKeys: controlledSelectedKeys,
+    defaultSelectedKeys = [],
+    openKeys: controlledOpenKeys,
+    defaultOpenKeys = [],
+    collapsed = false,
+    multiple = true,
+    inlineIndent = 24,
+    popupPortal = false,
+    className,
+    style,
+    onSelect,
+    onOpenChange,
+    onSearch,
+    searchable = false,
+    searchValue: controlledSearchValue,
+    defaultSearchValue = "",
+    searchPlaceholder = "Search menu",
+    emptyText = "No menu items found"
+  } = props;
+  const children = props.children;
   const menuRef = _react.useRef.call(void 0, null);
   const resolvedMode = collapsed && mode === "inline" ? "vertical" : mode;
   const [internalSelectedKeys, setInternalSelectedKeys] = _react.useState.call(void 0, defaultSelectedKeys);
@@ -146,57 +123,41 @@ var Menu = ({
     () => _tigercatcore.filterMenuItems.call(void 0, _nullishCoalesce(items, () => ( [])), searchValue),
     [items, searchValue]
   );
-  function renderDataItem(item) {
-    if (item.children && item.children.length > 0) {
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        SubMenu,
-        {
-          itemKey: item.key,
-          title: item.label,
-          icon: item.icon,
-          disabled: item.disabled,
-          children: item.children.map(renderDataItem)
-        },
-        item.key
-      );
-    }
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, MenuItem, { itemKey: item.key, icon: item.icon, disabled: item.disabled, children: item.label }, item.key);
-  }
-  const dataChildren = filteredItems.map(renderDataItem);
-  const hasSlotChildren = _react2.default.Children.count(children) > 0;
-  const emptyChild = items && items.length > 0 && dataChildren.length === 0 && !hasSlotChildren ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "li", { role: "none", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.menuSearchEmptyClasses, children: emptyText }) }) : null;
   _react.useEffect.call(void 0, () => {
     if (menuRef.current) _tigercatcore.initRovingTabIndex.call(void 0, menuRef.current);
   }, [resolvedMode, collapsed, selectedKeys, openKeys, filteredItems]);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, MenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    "ul",
-    {
-      ref: menuRef,
-      className: menuClasses,
-      style,
-      role: "menu",
-      "data-tiger-menu-root": "true",
-      "data-tiger-menu-mode": resolvedMode,
-      "data-tiger-menu-requested-mode": mode,
-      children: [
-        searchable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "li", { role: "none", className: _tigercatcore.menuSearchFieldClasses, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          "input",
-          {
-            type: "search",
-            value: searchValue,
-            placeholder: searchPlaceholder,
-            "aria-label": searchPlaceholder,
-            className: _tigercatcore.menuSearchInputClasses,
-            onChange: handleSearchInput
-          }
-        ) }),
-        dataChildren,
-        children,
-        emptyChild
-      ]
-    }
-  ) });
-};
+  return {
+    menuRef,
+    menuClasses,
+    style,
+    resolvedMode,
+    mode,
+    contextValue,
+    searchable,
+    searchValue,
+    searchPlaceholder,
+    emptyText,
+    handleSearchInput,
+    filteredItems,
+    items,
+    children
+  };
+}
+
+// src/components/Menu/menu-item.tsx
+
+
+
+
+
+
+
+
+
+
+
+
+var _jsxruntime = require('react/jsx-runtime');
 var MenuItem = ({
   itemKey,
   disabled = false,
@@ -228,9 +189,7 @@ var MenuItem = ({
       const current = event.currentTarget;
       const rootMenu = current.closest('ul[role="menu"]');
       const isRoot = _optionalChain([rootMenu, 'optionalAccess', _4 => _4.dataset, 'access', _5 => _5.tigerMenuRoot]) === "true";
-      const isHorizontalRoot = isRoot && menuContext.mode === "horizontal";
-      const nextKey = isHorizontalRoot ? "ArrowRight" : "ArrowDown";
-      const prevKey = isHorizontalRoot ? "ArrowLeft" : "ArrowUp";
+      const { nextKey, prevKey } = _tigercatcore.getMenuNavigationKeys.call(void 0, menuContext.mode, isRoot);
       if (event.key === nextKey) {
         event.preventDefault();
         _tigercatcore.moveFocusInMenu.call(void 0, current, 1);
@@ -299,6 +258,51 @@ var MenuItem = ({
     }
   ) });
 };
+
+// src/components/Menu/submenu.tsx
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+// src/components/Menu/icons.tsx
+
+
+var ExpandIcon = ({ expanded }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  "svg",
+  {
+    className: _tigercatcore.getSubMenuExpandIconClasses.call(void 0, expanded),
+    width: "12",
+    height: "12",
+    viewBox: "0 0 12 12",
+    fill: "currentColor",
+    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M6 9L1.5 4.5L2.205 3.795L6 7.59L9.795 3.795L10.5 4.5L6 9Z" })
+  }
+);
+
+// src/components/Menu/menu-item-group.tsx
+
+
+
 function isComponentNamed(elementType, name) {
   if (typeof elementType !== "function" && typeof elementType !== "object") return false;
   const maybeFn = elementType;
@@ -329,17 +333,9 @@ var MenuItemGroup = ({
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "ul", { role: "group", className, children: enhancedChildren })
   ] });
 };
-var ExpandIcon = ({ expanded }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  "svg",
-  {
-    className: _tigercatcore.getSubMenuExpandIconClasses.call(void 0, expanded),
-    width: "12",
-    height: "12",
-    viewBox: "0 0 12 12",
-    fill: "currentColor",
-    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M6 9L1.5 4.5L2.205 3.795L6 7.59L9.795 3.795L10.5 4.5L6 9Z" })
-  }
-);
+
+// src/components/Menu/submenu.tsx
+
 var SubMenu = ({
   itemKey,
   title = "",
@@ -471,9 +467,7 @@ var SubMenu = ({
       const current = event.currentTarget;
       const rootMenu = current.closest('ul[role="menu"]');
       const isRoot = _optionalChain([rootMenu, 'optionalAccess', _14 => _14.dataset, 'access', _15 => _15.tigerMenuRoot]) === "true";
-      const isHorizontalRoot = isRoot && menuContext.mode === "horizontal";
-      const nextKey = isHorizontalRoot ? "ArrowRight" : "ArrowDown";
-      const prevKey = isHorizontalRoot ? "ArrowLeft" : "ArrowUp";
+      const { nextKey, prevKey } = _tigercatcore.getMenuNavigationKeys.call(void 0, menuContext.mode, isRoot);
       if (event.key === nextKey) {
         event.preventDefault();
         _tigercatcore.moveFocusInMenu.call(void 0, current, 1);
@@ -662,10 +656,63 @@ var SubMenu = ({
   );
 };
 
+// src/components/Menu.tsx
+
+var Menu = (props) => {
+  const ctx = useMenuRootState(props);
+  function renderDataItem(item) {
+    if (item.children && item.children.length > 0) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        SubMenu,
+        {
+          itemKey: item.key,
+          title: item.label,
+          icon: item.icon,
+          disabled: item.disabled,
+          children: item.children.map(renderDataItem)
+        },
+        item.key
+      );
+    }
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, MenuItem, { itemKey: item.key, icon: item.icon, disabled: item.disabled, children: item.label }, item.key);
+  }
+  const dataChildren = ctx.filteredItems.map(renderDataItem);
+  const hasSlotChildren = _react2.default.Children.count(ctx.children) > 0;
+  const emptyChild = ctx.items && ctx.items.length > 0 && dataChildren.length === 0 && !hasSlotChildren ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "li", { role: "none", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.menuSearchEmptyClasses, children: ctx.emptyText }) }) : null;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, MenuContext.Provider, { value: ctx.contextValue, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "ul",
+    {
+      ref: ctx.menuRef,
+      className: ctx.menuClasses,
+      style: ctx.style,
+      role: "menu",
+      "data-tiger-menu-root": "true",
+      "data-tiger-menu-mode": ctx.resolvedMode,
+      "data-tiger-menu-requested-mode": ctx.mode,
+      children: [
+        ctx.searchable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "li", { role: "none", className: _tigercatcore.menuSearchFieldClasses, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "input",
+          {
+            type: "search",
+            value: ctx.searchValue,
+            placeholder: ctx.searchPlaceholder,
+            "aria-label": ctx.searchPlaceholder,
+            className: _tigercatcore.menuSearchInputClasses,
+            onChange: ctx.handleSearchInput
+          }
+        ) }),
+        dataChildren,
+        ctx.children,
+        emptyChild
+      ]
+    }
+  ) });
+};
+
 
 
 
 
 
 
-exports.useMenuContext = useMenuContext; exports.Menu = Menu; exports.MenuItem = MenuItem; exports.MenuItemGroup = MenuItemGroup; exports.SubMenu = SubMenu;
+exports.useMenuContext = useMenuContext; exports.MenuItem = MenuItem; exports.MenuItemGroup = MenuItemGroup; exports.SubMenu = SubMenu; exports.Menu = Menu;

package/dist/{chunk-F7H4ALKN.js → chunk-LZG24TDB.js}

@@ -1,6 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkJLRRXRZOjs = require('./chunk-JLRRXRZO.js');
+var _chunkSQONS5PHjs = require('./chunk-SQONS5PH.js');
+
+
+var _chunkL3WPA2RPjs = require('./chunk-L3WPA2RP.js');
 
 // src/components/Checkbox.tsx
 var _react = require('react');
@@ -22,12 +25,11 @@ var Checkbox = ({
   className,
   ...props
 }) => {
-  const groupContext = _chunkJLRRXRZOjs.useCheckboxGroup.call(void 0, );
-  const [internalChecked, setInternalChecked] = _react.useState.call(void 0, defaultChecked);
-  const isControlled = controlledChecked !== void 0;
+  const groupContext = _chunkSQONS5PHjs.useCheckboxGroup.call(void 0, );
+  const [checkedState, setChecked] = _chunkL3WPA2RPjs.useControlledState.call(void 0, controlledChecked, defaultChecked, onChange);
   const effectiveSize = propSize || _optionalChain([groupContext, 'optionalAccess', _ => _.size]) || "md";
   const effectiveDisabled = propDisabled || _optionalChain([groupContext, 'optionalAccess', _2 => _2.disabled]) || false;
-  const checked = groupContext && value !== void 0 ? groupContext.value.includes(value) : isControlled ? controlledChecked : internalChecked;
+  const checked = groupContext && value !== void 0 ? groupContext.value.includes(value) : checkedState;
   const checkboxRef = _react.useRef.call(void 0, null);
   _react.useEffect.call(void 0, () => {
     if (checkboxRef.current) {
@@ -40,10 +42,7 @@ var Checkbox = ({
     if (groupContext && value !== void 0) {
       groupContext.updateValue(value, newValue);
     } else {
-      if (!isControlled) {
-        setInternalChecked(newValue);
-      }
-      _optionalChain([onChange, 'optionalCall', _3 => _3(newValue, event)]);
+      setChecked(newValue, event);
     }
   };
   const checkboxClasses = _tigercatcore.getCheckboxClasses.call(void 0, effectiveSize, effectiveDisabled);

package/dist/{chunk-ZYJTHGQW.js → chunk-M3FVPPMM.js}

@@ -1,4 +1,8 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/components/Input.tsx
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+var _chunkL3WPA2RPjs = require('./chunk-L3WPA2RP.js');
+
+// src/components/Input.tsx
 var _react = require('react');
 
 
@@ -51,7 +55,7 @@ var Input = ({
   const inputRef = _react.useRef.call(void 0, null);
   const reactId = _react.useId.call(void 0, );
   const errorMsgId = `tiger-input-error-${reactId}`;
-  const [internalValue, setInternalValue] = _react.useState.call(void 0, _nullishCoalesce(defaultValue, () => ( "")));
+  const [inputValue, setInputValue] = _chunkL3WPA2RPjs.useControlledState.call(void 0, value, _nullishCoalesce(defaultValue, () => ( "")));
   const [passwordVisible, setPasswordVisible] = _react.useState.call(void 0, false);
   _react.useEffect.call(void 0, () => {
     if (status === "error" && wrapperRef.current) {
@@ -64,25 +68,17 @@ var Input = ({
   const handleAnimationEnd = _react.useCallback.call(void 0, () => {
     _optionalChain([wrapperRef, 'access', _ => _.current, 'optionalAccess', _2 => _2.classList, 'access', _3 => _3.remove, 'call', _4 => _4(_tigercatcore.SHAKE_CLASS)]);
   }, []);
-  const isControlled = value !== void 0;
-  const inputValue = isControlled ? value : internalValue;
   const currentValStr = String(inputValue);
   const handleInput = (event) => {
-    if (!isControlled) {
-      setInternalValue(_tigercatcore.parseInputValue.call(void 0, event.currentTarget, type));
-    }
+    setInputValue(_tigercatcore.parseInputValue.call(void 0, event.currentTarget, type));
     _optionalChain([onInput, 'optionalCall', _5 => _5(event)]);
   };
   const handleChange = (event) => {
-    if (!isControlled) {
-      setInternalValue(_tigercatcore.parseInputValue.call(void 0, event.currentTarget, type));
-    }
+    setInputValue(_tigercatcore.parseInputValue.call(void 0, event.currentTarget, type));
     _optionalChain([onChange, 'optionalCall', _6 => _6(event)]);
   };
   const handleClear = () => {
-    if (!isControlled) {
-      setInternalValue("");
-    }
+    setInputValue("");
     _optionalChain([onClear, 'optionalCall', _7 => _7()]);
     _optionalChain([inputRef, 'access', _8 => _8.current, 'optionalAccess', _9 => _9.focus, 'call', _10 => _10()]);
   };

package/dist/{chunk-GN3TSQWW.mjs → chunk-M6YXUNOU.mjs}

@@ -1,9 +1,9 @@
 import {
   ImageGroupContext
-} from "./chunk-3QPCQH62.mjs";
+} from "./chunk-RYNLPRUM.mjs";
 import {
   ImagePreview
-} from "./chunk-6GYT3EZD.mjs";
+} from "./chunk-KXT2TP6A.mjs";
 import {
   usePopup
 } from "./chunk-C44WSDEY.mjs";