@particle-academy/react-fancy 5.61.0 → 5.62.0

package/dist/chunk-QXMQVLRQ.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/Tooltip/Tooltip.tsx"],"names":["forwardRef","Tooltip","useState","useRef","useFloatingPosition","useCallback","useMemo","composeRefs","cloneElement","jsxs","Fragment","Portal","cn","jsx"],"mappings":"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","file":"chunk-QXMQVLRQ.cjs","sourcesContent":["import {\n  cloneElement,\n  forwardRef,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n  type ReactElement,\n  type Ref,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { composeRefs } from \"../../utils/compose-refs\";\nimport { Portal } from \"../Portal\";\nimport { useFloatingPosition } from \"../../hooks/use-floating-position\";\nimport type { TooltipProps } from \"./Tooltip.types\";\n\nexport const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(\n  function Tooltip(\n    { children, content, placement = \"top\", delay = 200, offset = 8, className },\n    _ref,\n  ) {\n    const [open, setOpen] = useState(false);\n    const anchorRef = useRef<HTMLElement>(null);\n    const floatingRef = useRef<HTMLDivElement>(null);\n    const timeoutRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n    const position = useFloatingPosition(anchorRef, floatingRef, {\n      placement,\n      offset,\n      enabled: open,\n    });\n\n    const show = useCallback(() => {\n      timeoutRef.current = setTimeout(() => setOpen(true), delay);\n    }, [delay]);\n\n    const hide = useCallback(() => {\n      clearTimeout(timeoutRef.current);\n      setOpen(false);\n    }, []);\n\n    // The trigger is the caller's element, so its own ref and handlers have to\n    // survive the clone. Overwriting them broke any child that needs its ref:\n    // a <MultiSwitch> measures its thumb from it, and rendered with none.\n    // className and every other prop are untouched — cloneElement keeps them.\n    const child = children as ReactElement<Record<string, unknown>>;\n    const childProps = child.props;\n    const childRef = childProps.ref as Ref<HTMLElement> | undefined;\n    const triggerRef = useMemo(() => composeRefs(childRef, anchorRef), [childRef]);\n    const chain =\n      (own: unknown, ours: () => void) =>\n      (event: unknown) => {\n        if (typeof own === \"function\") own(event);\n        ours();\n      };\n    const trigger = cloneElement(child, {\n      ref: triggerRef,\n      onMouseEnter: chain(childProps.onMouseEnter, show),\n      onMouseLeave: chain(childProps.onMouseLeave, hide),\n      onFocus: chain(childProps.onFocus, show),\n      onBlur: chain(childProps.onBlur, hide),\n    });\n\n    return (\n      <>\n        {trigger}\n        {open && (\n          <Portal>\n            <div\n              ref={floatingRef}\n              data-react-fancy-tooltip=\"\"\n              role=\"tooltip\"\n              className={cn(\n                \"fancy-fade-in pointer-events-none fixed z-50 max-w-xs rounded-lg bg-zinc-900 px-3 py-1.5 text-sm text-white shadow-lg dark:bg-zinc-700 dark:text-zinc-100\",\n                className,\n              )}\n              style={{ left: position.x, top: position.y }}\n            >\n              {content}\n              <div\n                className={cn(\n                  // `bg-inherit`, not a colour of its own: a `className` that\n                  // restyles the bubble would otherwise leave a dark arrow\n                  // pointing out of a light one.\n                  \"absolute h-2 w-2 rotate-45 bg-inherit\",\n                  position.placement.startsWith(\"top\") &&\n                    \"bottom-[-4px] left-1/2 -translate-x-1/2\",\n                  position.placement.startsWith(\"bottom\") &&\n                    \"top-[-4px] left-1/2 -translate-x-1/2\",\n                  position.placement.startsWith(\"left\") &&\n                    \"right-[-4px] top-1/2 -translate-y-1/2\",\n                  position.placement.startsWith(\"right\") &&\n                    \"left-[-4px] top-1/2 -translate-y-1/2\",\n                )}\n              />\n            </div>\n          </Portal>\n        )}\n      </>\n    );\n  },\n);\n\nTooltip.displayName = \"Tooltip\";\n"]}

package/dist/chunk-RXDRYWVD.cjs

@@ -1,21 +0,0 @@
-'use strict';
-
-var react = require('react');
-
-// src/hooks/use-escape-key.ts
-function useEscapeKey(handler, enabled = true) {
-  react.useEffect(() => {
-    if (!enabled) return;
-    const listener = (event) => {
-      if (event.key === "Escape") {
-        handler();
-      }
-    };
-    document.addEventListener("keydown", listener);
-    return () => document.removeEventListener("keydown", listener);
-  }, [handler, enabled]);
-}
-
-exports.useEscapeKey = useEscapeKey;
-//# sourceMappingURL=chunk-RXDRYWVD.cjs.map
-//# sourceMappingURL=chunk-RXDRYWVD.cjs.map

package/dist/chunk-RXDRYWVD.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/hooks/use-escape-key.ts"],"names":["useEffect"],"mappings":";;;;;AAEO,SAAS,YAAA,CACd,OAAA,EACA,OAAA,GAAmB,IAAA,EACb;AACN,EAAAA,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,OAAA,EAAS;AAEd,IAAA,MAAM,QAAA,GAAW,CAAC,KAAA,KAAyB;AACzC,MAAA,IAAI,KAAA,CAAM,QAAQ,QAAA,EAAU;AAC1B,QAAA,OAAA,EAAQ;AAAA,MACV;AAAA,IACF,CAAA;AAEA,IAAA,QAAA,CAAS,gBAAA,CAAiB,WAAW,QAAQ,CAAA;AAC7C,IAAA,OAAO,MAAM,QAAA,CAAS,mBAAA,CAAoB,SAAA,EAAW,QAAQ,CAAA;AAAA,EAC/D,CAAA,EAAG,CAAC,OAAA,EAAS,OAAO,CAAC,CAAA;AACvB","file":"chunk-RXDRYWVD.cjs","sourcesContent":["import { useEffect } from \"react\";\n\nexport function useEscapeKey(\n  handler: () => void,\n  enabled: boolean = true,\n): void {\n  useEffect(() => {\n    if (!enabled) return;\n\n    const listener = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        handler();\n      }\n    };\n\n    document.addEventListener(\"keydown\", listener);\n    return () => document.removeEventListener(\"keydown\", listener);\n  }, [handler, enabled]);\n}\n"]}

package/dist/chunk-ZPBCZPMD.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/FullScreen/FullScreen.context.tsx","../src/components/FullScreen/FullScreenToggle.tsx"],"names":["createContext","useContext","jsx","PortalContainerContext","Icon","cn"],"mappings":";;;;;;;;AAIO,IAAM,iBAAA,GAAoBA,oBAA0C,IAAI;AAGxE,SAAS,oBAAA,GAAmD;AACjE,EAAA,OAAOC,iBAAW,iBAAiB,CAAA;AACrC;AAaO,SAAS,kBAAA,CAAmB,EAAE,KAAA,EAAO,QAAA,EAAS,EAA4B;AAC/E,EAAA,uBACEC,cAAA,CAAC,iBAAA,CAAkB,QAAA,EAAlB,EAA2B,KAAA,EAC1B,QAAA,kBAAAA,cAAA,CAACC,wCAAA,CAAuB,QAAA,EAAvB,EAAgC,KAAA,EAAO,KAAA,CAAM,eAAA,EAAkB,UAAS,CAAA,EAC3E,CAAA;AAEJ;ACTO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,SAAA,GAAY,YAAA;AAAA,EACZ,QAAA,GAAW,YAAA;AAAA,EACX,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAA0B;AACxB,EAAA,MAAM,KAAK,oBAAA,EAAqB;AAChC,EAAA,IAAI,CAAC,IAAI,OAAO,IAAA;AAEhB,EAAA,MAAM,UACJ,OAAO,QAAA,KAAa,aAChB,QAAA,CAAS,EAAA,CAAG,UAAU,CAAA,GACtB,QAAA,oBAAYD,cAAAA,CAACE,0BAAK,IAAA,EAAM,EAAA,CAAG,aAAa,QAAA,GAAW,SAAA,EAAW,MAAK,IAAA,EAAK,CAAA;AAE9E,EAAA,uBACEF,cAAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACH,GAAG,EAAA,CAAG,WAAA;AAAA,MACP,SAAA,EAAWG,oBAAA;AAAA,QACT,sFAAA;AAAA,QACA,+IAAA;AAAA,QACA,+HAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC,QAAA,EAAA;AAAA;AAAA,GACH;AAEJ;AAEA,gBAAA,CAAiB,WAAA,GAAc,kBAAA","file":"chunk-ZPBCZPMD.cjs","sourcesContent":["import { createContext, useContext, type ReactNode } from \"react\";\nimport { PortalContainerContext } from \"../Portal/Portal\";\nimport type { UseFullScreenResult } from \"../../hooks/use-full-screen\";\n\nexport const FullScreenContext = createContext<UseFullScreenResult | null>(null);\n\n/** The nearest full-screen surface's state, or `null` outside one. */\nexport function useFullScreenContext(): UseFullScreenResult | null {\n  return useContext(FullScreenContext);\n}\n\nexport interface FullScreenProviderProps {\n  /** What `useFullScreen()` returned for the surface. */\n  value: UseFullScreenResult<HTMLElement> | UseFullScreenResult<HTMLDivElement>;\n  children?: ReactNode;\n}\n\n/**\n * For a surface that owns its root and calls `useFullScreen()` itself (Editor,\n * DeckEditor, SheetWorkbook). Makes `<FullScreen.Toggle />` work anywhere inside\n * and redirects descendant `<Portal>`s into the surface while it is active.\n */\nexport function FullScreenProvider({ value, children }: FullScreenProviderProps) {\n  return (\n    <FullScreenContext.Provider value={value as UseFullScreenResult}>\n      <PortalContainerContext.Provider value={value.portalContainer}>{children}</PortalContainerContext.Provider>\n    </FullScreenContext.Provider>\n  );\n}\n","import type { ButtonHTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Icon } from \"../Icon\";\nimport { useFullScreenContext } from \"./FullScreen.context\";\n\nexport interface FullScreenToggleProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"type\" | \"onClick\" | \"children\"> {\n  /** Lucide name shown while NOT full screen. @default \"maximize-2\" */\n  enterIcon?: string;\n  /** Lucide name shown while full screen. @default \"minimize-2\" */\n  exitIcon?: string;\n  /** Replace the icon entirely. Receives the current state. */\n  children?: ReactNode | ((fullScreen: boolean) => ReactNode);\n}\n\n/**\n * The toggle for the nearest `<FullScreen>` / `<FullScreenProvider>`. Renders\n * nothing outside one, so a shared toolbar can include it unconditionally.\n */\nexport function FullScreenToggle({\n  enterIcon = \"maximize-2\",\n  exitIcon = \"minimize-2\",\n  children,\n  className,\n  ...rest\n}: FullScreenToggleProps) {\n  const fs = useFullScreenContext();\n  if (!fs) return null;\n\n  const content =\n    typeof children === \"function\"\n      ? children(fs.fullScreen)\n      : children ?? <Icon name={fs.fullScreen ? exitIcon : enterIcon} size=\"sm\" />;\n\n  return (\n    <button\n      {...rest}\n      {...fs.toggleProps}\n      className={cn(\n        \"inline-flex h-8 w-8 items-center justify-center rounded-md text-sm transition-colors\",\n        \"hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]\",\n        \"focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-brand,var(--color-blue-500))]\",\n        className,\n      )}\n    >\n      {content}\n    </button>\n  );\n}\n\nFullScreenToggle.displayName = \"FullScreenToggle\";\n"]}