@expcat/tigercat-react 2.1.2 → 2.1.4

package/dist/{chunk-3HHEVMHE.mjs → chunk-532OVXLV.mjs}

@@ -2,22 +2,24 @@ import {
   Dropdown,
   DropdownItem,
   DropdownMenu
-} from "./chunk-RE5ZLA5D.mjs";
+} from "./chunk-H3UEVWOO.mjs";
 import {
   Button
-} from "./chunk-5TE7KLE5.mjs";
+} from "./chunk-WFLXJOFU.mjs";
 import {
-  ButtonGroup
-} from "./chunk-ZJWUBR2X.mjs";
+  useTigerConfig
+} from "./chunk-RUIFGSVN.mjs";
 
 // src/components/SplitButton.tsx
-import React, { useMemo } from "react";
+import React, { forwardRef, useMemo } from "react";
 import {
   DROPDOWN_CHEVRON_PATH,
   getDropdownChevronClasses,
   getSplitButtonPrimaryClasses,
   getSplitButtonRootClasses,
   getSplitButtonTriggerClasses,
+  resolveLocaleText,
+  splitButtonDropdownClasses,
   resolveSplitButtonSize,
   resolveSplitButtonTriggerAriaLabel,
   resolveSplitButtonVariant
@@ -56,11 +58,11 @@ function partitionChildren(children) {
   }
   return { primary, menu };
 }
-function Chevron({ open }) {
+function Chevron({ open, size }) {
   return /* @__PURE__ */ jsx(
     "svg",
     {
-      className: getDropdownChevronClasses(open),
+      className: getDropdownChevronClasses(open, { tone: "current", size }),
       viewBox: "0 0 24 24",
       fill: "none",
       stroke: "currentColor",
@@ -73,7 +75,7 @@ function Chevron({ open }) {
     }
   );
 }
-var SplitButton = ({
+var SplitButton = forwardRef(function SplitButton2({
   variant = "primary",
   size = "md",
   disabled = false,
@@ -86,6 +88,7 @@ var SplitButton = ({
   loadingIcon,
   trigger,
   triggerAriaLabel,
+  primaryAriaLabel,
   open,
   defaultOpen = false,
   closeOnClick = true,
@@ -99,79 +102,83 @@ var SplitButton = ({
   style,
   children,
   ...rest
-}) => {
+}, forwardedRef) {
+  const { locale } = useTigerConfig();
   const resolvedVariant = resolveSplitButtonVariant(variant);
   const resolvedSize = resolveSplitButtonSize(size);
-  const isDisabled = disabled || loading;
-  const triggerLabel = resolveSplitButtonTriggerAriaLabel(triggerAriaLabel);
+  const triggerLabel = resolveSplitButtonTriggerAriaLabel(
+    triggerAriaLabel,
+    resolveLocaleText("More options", locale?.common?.moreOptionsText)
+  );
   const partitioned = useMemo(() => partitionChildren(children), [children]);
   const menuNode = menu != null ? wrapMenu(menu) : partitioned.menu;
+  const hasMenu = menuNode != null;
   const rootClasses = getSplitButtonRootClasses({ block, className });
   const primaryClasses = getSplitButtonPrimaryClasses({ block });
   const triggerClasses = getSplitButtonTriggerClasses({ size: resolvedSize });
-  return /* @__PURE__ */ jsxs(
-    ButtonGroup,
-    {
-      size: resolvedSize,
-      className: rootClasses,
-      style,
-      "data-split-button": "",
-      ...rest,
-      children: [
-        /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs("div", { className: rootClasses, style, role: "group", "data-split-button": "", ...rest, children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        ref: forwardedRef,
+        variant: resolvedVariant,
+        size: resolvedSize,
+        disabled,
+        loading,
+        danger,
+        htmlType,
+        iconPosition,
+        icon,
+        loadingIcon,
+        className: primaryClasses,
+        "aria-label": primaryAriaLabel,
+        "data-split-button-primary": "",
+        onClick,
+        children: partitioned.primary
+      }
+    ),
+    hasMenu ? /* @__PURE__ */ jsx(
+      Dropdown,
+      {
+        className: splitButtonDropdownClasses,
+        trigger: "click",
+        showArrow: false,
+        asChild: true,
+        disabled,
+        open,
+        defaultOpen,
+        closeOnClick,
+        portal,
+        placement,
+        offset,
+        onOpenChange: (next) => {
+          if (loading) return;
+          onOpenChange?.(next);
+        },
+        renderTrigger: ({ open: menuOpen }) => /* @__PURE__ */ jsx(
           Button,
           {
             variant: resolvedVariant,
             size: resolvedSize,
             disabled,
-            loading,
             danger,
-            htmlType,
-            iconPosition,
-            icon,
-            loadingIcon,
-            className: primaryClasses,
-            "data-split-button-primary": "",
-            onClick,
-            children: partitioned.primary
+            htmlType: "button",
+            className: triggerClasses,
+            "aria-label": triggerLabel,
+            "aria-disabled": loading || void 0,
+            "data-split-button-trigger": "",
+            onClick: (event) => {
+              if (loading) event.preventDefault();
+            },
+            children: trigger ?? /* @__PURE__ */ jsx(Chevron, { open: menuOpen, size: resolvedSize })
           }
         ),
-        /* @__PURE__ */ jsx(
-          Dropdown,
-          {
-            trigger: "click",
-            showArrow: false,
-            disabled: isDisabled,
-            open,
-            defaultOpen,
-            closeOnClick,
-            portal,
-            placement,
-            offset,
-            onOpenChange,
-            renderTrigger: ({ open: menuOpen }) => /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: resolvedVariant,
-                size: resolvedSize,
-                disabled: isDisabled,
-                danger,
-                htmlType: "button",
-                className: triggerClasses,
-                "aria-label": triggerLabel,
-                "aria-haspopup": "menu",
-                "aria-expanded": menuOpen,
-                "data-split-button-trigger": "",
-                children: trigger ?? /* @__PURE__ */ jsx(Chevron, { open: menuOpen })
-              }
-            ),
-            children: menuNode
-          }
-        )
-      ]
-    }
-  );
-};
+        children: menuNode
+      }
+    ) : null
+  ] });
+});
+SplitButton.displayName = "SplitButton";
 var SplitButton_default = SplitButton;
 
 export {

package/dist/{chunk-TQ6RIFWR.mjs → chunk-57IHCV62.mjs}

@@ -1,16 +1,19 @@
 // src/components/Marquee.tsx
-import { forwardRef, useCallback, useState } from "react";
+import { forwardRef, useCallback, useLayoutEffect, useState } from "react";
 import {
+  getMarqueeCloneAttributes,
   getMarqueeContentClasses,
+  getMarqueeContentStyle,
   getMarqueeRootClasses,
   getMarqueeTrackClasses,
   getMarqueeTrackStyle,
   injectMarqueeStyles,
   isMarqueeFocusInside,
   isMarqueePaused,
-  resolveMarqueeAriaLabel,
   resolveMarqueeDirection,
+  resolveMarqueePauseOnFocus,
   resolveMarqueePauseOnHover,
+  resolveMarqueeRegion,
   resolveMarqueeRepeat
 } from "@expcat/tigercat-core";
 import { jsx } from "react/jsx-runtime";
@@ -19,6 +22,8 @@ var Marquee = forwardRef(
     direction,
     duration,
     pauseOnHover,
+    pauseOnFocus,
+    paused: pausedProp,
     gap,
     repeat,
     ariaLabel,
@@ -31,21 +36,27 @@ var Marquee = forwardRef(
     onBlur,
     ...rest
   }, ref) => {
-    injectMarqueeStyles();
+    useLayoutEffect(() => {
+      injectMarqueeStyles();
+    }, []);
     const [hovered, setHovered] = useState(false);
     const [focused, setFocused] = useState(false);
     const resolvedDirection = resolveMarqueeDirection(direction);
     const resolvedPauseOnHover = resolveMarqueePauseOnHover(pauseOnHover);
+    const resolvedPauseOnFocus = resolveMarqueePauseOnFocus(pauseOnFocus);
     const copies = resolveMarqueeRepeat(repeat);
     const paused = isMarqueePaused({
+      paused: pausedProp,
       pauseOnHover: resolvedPauseOnHover,
+      pauseOnFocus: resolvedPauseOnFocus,
       hovered,
       focused
     });
-    const { "aria-label": ariaLabelAttr, ...domProps } = rest;
-    const resolvedAriaLabel = resolveMarqueeAriaLabel(
-      typeof ariaLabelAttr === "string" ? ariaLabelAttr : ariaLabel
-    );
+    const { "aria-label": ariaLabelAttr, "aria-labelledby": ariaLabelledByAttr, ...domProps } = rest;
+    const region = resolveMarqueeRegion({
+      ariaLabel: typeof ariaLabelAttr === "string" ? ariaLabelAttr : ariaLabel,
+      labelledBy: typeof ariaLabelledByAttr === "string" ? ariaLabelledByAttr : void 0
+    });
     const handleMouseEnter = useCallback(
       (event) => {
         if (resolvedPauseOnHover) setHovered(true);
@@ -62,34 +73,38 @@ var Marquee = forwardRef(
     );
     const handleFocus = useCallback(
       (event) => {
-        if (resolvedPauseOnHover) setFocused(true);
+        if (resolvedPauseOnFocus) setFocused(true);
         onFocus?.(event);
       },
-      [onFocus, resolvedPauseOnHover]
+      [onFocus, resolvedPauseOnFocus]
     );
     const handleBlur = useCallback(
       (event) => {
-        if (resolvedPauseOnHover && !isMarqueeFocusInside(event.currentTarget, event.relatedTarget)) {
+        if (resolvedPauseOnFocus && !isMarqueeFocusInside(event.currentTarget, event.relatedTarget)) {
           setFocused(false);
         }
         onBlur?.(event);
       },
-      [onBlur, resolvedPauseOnHover]
+      [onBlur, resolvedPauseOnFocus]
     );
     return /* @__PURE__ */ jsx(
       "div",
       {
         ...domProps,
         ref,
-        role: "region",
-        "aria-label": resolvedAriaLabel,
+        role: region.role,
+        "aria-label": region.ariaLabel,
+        "aria-labelledby": typeof ariaLabelledByAttr === "string" ? ariaLabelledByAttr : void 0,
         "data-marquee": "",
         "data-marquee-direction": resolvedDirection,
         "data-marquee-paused": paused ? "true" : "false",
         "data-marquee-pause-on-hover": resolvedPauseOnHover ? "true" : "false",
+        "data-marquee-pause-on-focus": resolvedPauseOnFocus ? "true" : "false",
         className: getMarqueeRootClasses({
           direction: resolvedDirection,
           pauseOnHover: resolvedPauseOnHover,
+          pauseOnFocus: resolvedPauseOnFocus,
+          paused: pausedProp,
           repeat: copies,
           className
         }),
@@ -114,7 +129,8 @@ var Marquee = forwardRef(
                     clone
                   }),
                   "data-marquee-content": "",
-                  ...clone ? { "data-marquee-clone": "", "aria-hidden": true } : {},
+                  style: getMarqueeContentStyle({ clone, index }),
+                  ...clone ? getMarqueeCloneAttributes() : {},
                   children
                 },
                 clone ? `clone-${index}` : "content"

package/dist/chunk-5D6BOIZB.mjs

@@ -0,0 +1,104 @@
+// src/components/Affix.tsx
+import { forwardRef, useLayoutEffect, useRef, useState, useMemo } from "react";
+import {
+  classNames,
+  createAffixController,
+  getAffixSentinelStyle,
+  resolveScrollRoot,
+  AFFIX_UNPINNED_STATE
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Affix = forwardRef(function Affix2({
+  offsetTop = 0,
+  offsetBottom,
+  target,
+  zIndex = 10,
+  className,
+  style,
+  children,
+  onChange,
+  ...props
+}, ref) {
+  const wrapperRef = useRef(null);
+  const sentinelRef = useRef(null);
+  const placeholderRef = useRef(null);
+  const [state, setState] = useState({ ...AFFIX_UNPINNED_STATE });
+  const onChangeRef = useRef(onChange);
+  onChangeRef.current = onChange;
+  const targetRef = useRef(target);
+  targetRef.current = target;
+  const offsetTopRef = useRef(offsetTop);
+  offsetTopRef.current = offsetTop;
+  const offsetBottomRef = useRef(offsetBottom);
+  offsetBottomRef.current = offsetBottom;
+  const zIndexRef = useRef(zIndex);
+  zIndexRef.current = zIndex;
+  const controllerRef = useRef(null);
+  if (controllerRef.current === null) {
+    controllerRef.current = createAffixController({
+      getSentinel: () => sentinelRef.current,
+      getPlaceholder: () => placeholderRef.current,
+      getContent: () => wrapperRef.current,
+      getTarget: () => targetRef.current,
+      getOffsetTop: () => offsetTopRef.current,
+      getOffsetBottom: () => offsetBottomRef.current,
+      getZIndex: () => zIndexRef.current,
+      onState: setState,
+      onChange: (affixed) => onChangeRef.current?.(affixed)
+    });
+  }
+  const resolved = resolveScrollRoot(target);
+  const resolvedKey = resolved.isWindow ? "window" : resolved.target;
+  useLayoutEffect(() => {
+    controllerRef.current?.bind();
+    return () => {
+      controllerRef.current?.unbind();
+    };
+  }, [resolvedKey, offsetTop, offsetBottom]);
+  useLayoutEffect(() => {
+    controllerRef.current?.updateStyle();
+  }, [zIndex]);
+  useLayoutEffect(() => {
+    controllerRef.current?.observeFlow();
+  });
+  const setContentRef = (node) => {
+    wrapperRef.current = node;
+    if (typeof ref === "function") ref(node);
+    else if (ref) ref.current = node;
+  };
+  const wrapperClasses = useMemo(() => classNames(className), [className]);
+  const wrapperStyle = useMemo(
+    () => state.affixed ? { ...style, ...state.style } : style,
+    [state.affixed, state.style, style]
+  );
+  const sentinel = /* @__PURE__ */ jsx("div", { ref: sentinelRef, "aria-hidden": "true", style: getAffixSentinelStyle() });
+  const content = /* @__PURE__ */ jsx("div", { ref: setContentRef, className: wrapperClasses, style: wrapperStyle, ...props, children });
+  const placeholder = state.affixed ? /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: placeholderRef,
+      "aria-hidden": "true",
+      style: {
+        width: state.placeholder.width,
+        height: state.placeholder.height
+      }
+    }
+  ) : null;
+  if (offsetBottom !== void 0) {
+    return /* @__PURE__ */ jsxs("div", { style: { display: "contents" }, children: [
+      placeholder,
+      content,
+      sentinel
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { style: { display: "contents" }, children: [
+    sentinel,
+    placeholder,
+    content
+  ] });
+});
+Affix.displayName = "Affix";
+
+export {
+  Affix
+};

package/dist/chunk-5J7EDMS7.mjs

@@ -0,0 +1,13 @@
+// src/utils/layout-context.ts
+import { createContext, useContext } from "react";
+var LayoutContext = createContext(null);
+var SidebarContext = createContext(null);
+function useSidebarContext() {
+  return useContext(SidebarContext);
+}
+
+export {
+  LayoutContext,
+  SidebarContext,
+  useSidebarContext
+};