softable-pixels-web 1.1.20 → 1.1.22

package/dist/popover.js

@@ -1,6 +1,6 @@
 import "./useThemedStyles-CrarDyWc.js";
-import "./useDismiss-CAEk_GV-.js";
-import "./useFloating-DCxblHIR.js";
-import { n as types_exports, t as Popover } from "./Popover-C-NRJlWf.js";
+import "./useDismiss-CgVHqmqk.js";
+import "./useFloating-DRwB71jG.js";
+import { t as Popover } from "./Popover-DpD3G9_i.js";
 
-export { Popover, types_exports as PopoverTypes };
+export { Popover };

package/dist/select.d.ts

@@ -1,3 +1,3 @@
-import { n as types_d_exports, t as Select } from "./index-9BlZnPff.js";
-import "./types-699enaOL.js";
+import { n as types_d_exports, t as Select } from "./index-VwpQusI_.js";
+import "./types-Dm-fEm6s.js";
 export { Select, types_d_exports as SelectTypes };

package/dist/select.js

@@ -1,11 +1,11 @@
 import "./useThemedStyles-CrarDyWc.js";
-import "./useDismiss-CAEk_GV-.js";
-import "./useFloating-DCxblHIR.js";
-import "./Popover-C-NRJlWf.js";
+import "./useDismiss-CgVHqmqk.js";
+import "./useFloating-DRwB71jG.js";
+import "./Popover-DpD3G9_i.js";
 import "./Icon-KzwFJI_k.js";
 import "./Typography-BkFV7BhK.js";
-import "./BasePopover-UzOryrTn.js";
+import "./BasePopover-PZwz1wdH.js";
 import "./Label-BHq2knad.js";
-import { n as types_exports, t as Select } from "./Select-CVcQGxjv.js";
+import { n as types_exports, t as Select } from "./Select-BIj1BrzP.js";
 
 export { Select, types_exports as SelectTypes };

package/dist/{styleProps-B2pBEf9N.d.ts → styleProps-CWZn-ouw.d.ts}

@@ -44,4 +44,4 @@ interface LayoutProps {
 type CommonStyleProps = MarginProps & PaddingProps & TextProps & LayoutProps;
 //#endregion
 export { TextProps as a, PaddingProps as i, LayoutProps as n, MarginProps as r, CommonStyleProps as t };
-//# sourceMappingURL=styleProps-B2pBEf9N.d.ts.map
+//# sourceMappingURL=styleProps-CWZn-ouw.d.ts.map

package/dist/switch.d.ts

@@ -1,2 +1,2 @@
-import { t as Switch } from "./index-aQIW73fh.js";
+import { t as Switch } from "./index-CEk3W9fj.js";
 export { Switch };

package/dist/tab-switch.d.ts

@@ -1,2 +1,2 @@
-import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-v04O7Gs-.js";
+import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-CK68mp8m.js";
 export { SwitchOption, TabSwitch, TabSwitchProps };

package/dist/text-area.d.ts

@@ -1,2 +1,2 @@
-import { t as TextArea } from "./index-BD5Vr9sw.js";
+import { t as TextArea } from "./index-Cl2z9ftU.js";
 export { TextArea };

package/dist/text-area.js

@@ -2,6 +2,6 @@ import "./useThemedStyles-CrarDyWc.js";
 import "./Icon-KzwFJI_k.js";
 import "./Typography-BkFV7BhK.js";
 import "./Label-BHq2knad.js";
-import { t as TextArea } from "./TextArea-Oqw0zh_x.js";
+import { t as TextArea } from "./TextArea-DHUTFFOU.js";
 
 export { TextArea };

package/dist/theme-context.d.ts

@@ -1,2 +1,2 @@
-import { a as ThemeName, c as ThemeRegistry, i as ThemeMode, l as ThemeTokens, n as useTheme, o as ThemePersistence, r as ThemeContextData, s as ThemeProviderProps, t as ThemeProvider } from "./index-BD5ThARj.js";
+import { a as ThemeName, c as ThemeRegistry, i as ThemeMode, l as ThemeTokens, n as useTheme, o as ThemePersistence, r as ThemeContextData, s as ThemeProviderProps, t as ThemeProvider } from "./index-BNPyjNve.js";
 export { ThemeContextData, ThemeMode, ThemeName, ThemePersistence, ThemeProvider, ThemeProviderProps, ThemeRegistry, ThemeTokens, useTheme };

package/dist/{types-rPQapqo2.d.ts → types-BIJRqScJ.d.ts}

@@ -15,4 +15,4 @@ type FloatingOptions = {
 };
 //#endregion
 export { Placement as n, FloatingOptions as t };
-//# sourceMappingURL=types-rPQapqo2.d.ts.map
+//# sourceMappingURL=types-BIJRqScJ.d.ts.map

package/dist/{types-Ck6jQYTO.d.ts → types-BM6zJmu5.d.ts}

@@ -1,5 +1,5 @@
-import { a as TextProps, r as MarginProps } from "./styleProps-B2pBEf9N.js";
-import { r as TypeStyles, t as SlotStyle } from "./useThemedStyles-C23Tevdv.js";
+import { a as TextProps, r as MarginProps } from "./styleProps-CWZn-ouw.js";
+import { r as TypeStyles, t as SlotStyle } from "./useThemedStyles-BUR6rDGs.js";
 import { ElementType, ReactNode } from "react";
 
 //#region src/components/commons/toolkit/Typography/style.d.ts
@@ -40,4 +40,4 @@ type TextAlign = 'left' | 'center' | 'right' | 'justify';
 type TypographyVariant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'b1' | 'b2' | 'b3' | 'caption' | 'legal';
 //#endregion
 export { TypographyVariant as n, TypographyProps as t };
-//# sourceMappingURL=types-Ck6jQYTO.d.ts.map
+//# sourceMappingURL=types-BM6zJmu5.d.ts.map

package/dist/{types-699enaOL.d.ts → types-Dm-fEm6s.d.ts}

@@ -1,5 +1,5 @@
-import { i as PaddingProps } from "./styleProps-B2pBEf9N.js";
-import { t as FloatingOptions } from "./types-rPQapqo2.js";
+import { i as PaddingProps } from "./styleProps-CWZn-ouw.js";
+import { t as FloatingOptions } from "./types-BIJRqScJ.js";
 import { MouseEventHandler, ReactNode, RefObject } from "react";
 
 //#region src/components/commons/toolkit/Popover/styles.d.ts
@@ -21,9 +21,8 @@ declare function createPopoverStyles({
     height: string;
   };
 };
-declare namespace types_d_exports {
-  export { PopoverProps, PopoverTriggerRenderProps };
-}
+//#endregion
+//#region src/components/commons/toolkit/Popover/types.d.ts
 type PopoverTriggerRenderProps = {
   ariaExpanded: boolean;
   ref: RefObject<HTMLElement>;
@@ -32,12 +31,14 @@ type PopoverTriggerRenderProps = {
 interface PopoverProps extends PaddingProps {
   open?: boolean;
   portalId?: string;
+  containerId?: string;
   hideShadow?: boolean;
   closeOnEscape?: boolean;
   closeOnOutsideClick?: boolean;
   floatingOptions?: FloatingOptions;
   anchorRef?: RefObject<HTMLElement>;
   absoluteReference?: FloatingOptions['absoluteReference'];
+  restoreFocusOnClose?: boolean;
   onOpenChange?: (v: boolean) => void;
   onMouseEnter?: MouseEventHandler<HTMLDivElement>;
   onMouseLeave?: MouseEventHandler<HTMLDivElement>;
@@ -49,5 +50,5 @@ interface PopoverProps extends PaddingProps {
   styles?: Partial<ReturnType<typeof createPopoverStyles>>;
 }
 //#endregion
-export { types_d_exports as n, PopoverProps as t };
-//# sourceMappingURL=types-699enaOL.d.ts.map
+export { PopoverProps as t };
+//# sourceMappingURL=types-Dm-fEm6s.d.ts.map

package/dist/typography.d.ts

@@ -1,4 +1,4 @@
-import { t as TypographyProps } from "./types-Ck6jQYTO.js";
+import { t as TypographyProps } from "./types-BM6zJmu5.js";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/commons/toolkit/Typography/index.d.ts

package/dist/use-dismiss.js

@@ -1,3 +1,3 @@
-import { t as useDismiss } from "./useDismiss-CAEk_GV-.js";
+import { t as useDismiss } from "./useDismiss-CgVHqmqk.js";
 
 export { useDismiss };

package/dist/use-floating.d.ts

@@ -1,4 +1,4 @@
-import { t as FloatingOptions } from "./types-rPQapqo2.js";
+import { t as FloatingOptions } from "./types-BIJRqScJ.js";
 
 //#region src/hooks/useFloating/index.d.ts
 type AnchorLike = {

package/dist/use-floating.js

@@ -1,3 +1,3 @@
-import { t as useFloating } from "./useFloating-DCxblHIR.js";
+import { t as useFloating } from "./useFloating-DRwB71jG.js";
 
 export { useFloating };

package/dist/useDismiss-CgVHqmqk.js

@@ -0,0 +1,46 @@
+import { useEffect } from "react";
+
+//#region src/hooks/useDismiss/index.ts
+function getEls(refs) {
+	return refs.map((r) => r.current).filter((x) => !!x);
+}
+function isInside(e, els) {
+	const anyE = e;
+	const path = typeof anyE.composedPath === "function" ? anyE.composedPath() : void 0;
+	if (path && path.length) return els.some((el) => path.includes(el));
+	const t = e.target;
+	if (!t) return false;
+	return els.some((el) => el.contains(t));
+}
+function useDismiss({ open, refs, closeOnEscape = true, closeOnOutsideClick = true, onClose }) {
+	useEffect(() => {
+		if (!open) return;
+		const onPointerDownCapture = (e) => {
+			if (!closeOnOutsideClick) return;
+			const els = getEls(refs);
+			if (!els.length) return;
+			if (isInside(e, els)) return;
+			onClose();
+		};
+		const onKeyDownCapture = (e) => {
+			if (!closeOnEscape) return;
+			if (e.key === "Escape") onClose();
+		};
+		document.addEventListener("pointerdown", onPointerDownCapture, true);
+		document.addEventListener("keydown", onKeyDownCapture, true);
+		return () => {
+			document.removeEventListener("pointerdown", onPointerDownCapture, true);
+			document.removeEventListener("keydown", onKeyDownCapture, true);
+		};
+	}, [
+		open,
+		onClose,
+		refs,
+		closeOnOutsideClick,
+		closeOnEscape
+	]);
+}
+
+//#endregion
+export { useDismiss as t };
+//# sourceMappingURL=useDismiss-CgVHqmqk.js.map

package/dist/useDismiss-CgVHqmqk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDismiss-CgVHqmqk.js","names":["path: EventTarget[] | undefined"],"sources":["../src/hooks/useDismiss/index.ts"],"sourcesContent":["import { type RefObject, useEffect } from 'react'\n\ntype UseDismissParams = {\n  open: boolean\n  closeOnEscape?: boolean\n  closeOnOutsideClick?: boolean\n  refs: Array<RefObject<HTMLElement | null>>\n  onClose: () => void\n}\n\nfunction getEls(refs: Array<RefObject<HTMLElement | null>>) {\n  return refs.map(r => r.current).filter((x): x is HTMLElement => !!x)\n}\n\nfunction isInside(e: Event, els: HTMLElement[]) {\n  const anyE = e as any\n  const path: EventTarget[] | undefined =\n    typeof anyE.composedPath === 'function' ? anyE.composedPath() : undefined\n\n  if (path && path.length) return els.some(el => path.includes(el))\n\n  const t = e.target as Node | null\n  if (!t) return false\n  return els.some(el => el.contains(t))\n}\n\nexport function useDismiss({\n  open,\n  refs,\n  closeOnEscape = true,\n  closeOnOutsideClick = true,\n  onClose\n}: UseDismissParams) {\n  useEffect(() => {\n    if (!open) return\n\n    const onPointerDownCapture = (e: PointerEvent) => {\n      if (!closeOnOutsideClick) return\n      const els = getEls(refs)\n      if (!els.length) return\n      if (isInside(e, els)) return\n      onClose()\n    }\n\n    const onKeyDownCapture = (e: KeyboardEvent) => {\n      if (!closeOnEscape) return\n      if (e.key === 'Escape') onClose()\n    }\n\n    document.addEventListener('pointerdown', onPointerDownCapture, true)\n    document.addEventListener('keydown', onKeyDownCapture, true)\n\n    return () => {\n      document.removeEventListener('pointerdown', onPointerDownCapture, true)\n      document.removeEventListener('keydown', onKeyDownCapture, true)\n    }\n  }, [open, onClose, refs, closeOnOutsideClick, closeOnEscape])\n}\n"],"mappings":";;;AAUA,SAAS,OAAO,MAA4C;AAC1D,QAAO,KAAK,KAAI,MAAK,EAAE,QAAQ,CAAC,QAAQ,MAAwB,CAAC,CAAC,EAAE;;AAGtE,SAAS,SAAS,GAAU,KAAoB;CAC9C,MAAM,OAAO;CACb,MAAMA,OACJ,OAAO,KAAK,iBAAiB,aAAa,KAAK,cAAc,GAAG;AAElE,KAAI,QAAQ,KAAK,OAAQ,QAAO,IAAI,MAAK,OAAM,KAAK,SAAS,GAAG,CAAC;CAEjE,MAAM,IAAI,EAAE;AACZ,KAAI,CAAC,EAAG,QAAO;AACf,QAAO,IAAI,MAAK,OAAM,GAAG,SAAS,EAAE,CAAC;;AAGvC,SAAgB,WAAW,EACzB,MACA,MACA,gBAAgB,MAChB,sBAAsB,MACtB,WACmB;AACnB,iBAAgB;AACd,MAAI,CAAC,KAAM;EAEX,MAAM,wBAAwB,MAAoB;AAChD,OAAI,CAAC,oBAAqB;GAC1B,MAAM,MAAM,OAAO,KAAK;AACxB,OAAI,CAAC,IAAI,OAAQ;AACjB,OAAI,SAAS,GAAG,IAAI,CAAE;AACtB,YAAS;;EAGX,MAAM,oBAAoB,MAAqB;AAC7C,OAAI,CAAC,cAAe;AACpB,OAAI,EAAE,QAAQ,SAAU,UAAS;;AAGnC,WAAS,iBAAiB,eAAe,sBAAsB,KAAK;AACpE,WAAS,iBAAiB,WAAW,kBAAkB,KAAK;AAE5D,eAAa;AACX,YAAS,oBAAoB,eAAe,sBAAsB,KAAK;AACvE,YAAS,oBAAoB,WAAW,kBAAkB,KAAK;;IAEhE;EAAC;EAAM;EAAS;EAAM;EAAqB;EAAc,CAAC"}

package/dist/{useFloating-DCxblHIR.js → useFloating-DRwB71jG.js}

@@ -278,6 +278,7 @@ function useFloating(targetRef, options) {
 	]);
 	useEffect(() => {
 		if (!floatingEl) return;
+		console.log({ scrollContainerId });
 		const scrollContainer = scrollContainerId ? document.getElementById(scrollContainerId) : window;
 		update();
 		const rafUpdate = () => requestAnimationFrame(update);
@@ -314,4 +315,4 @@ function useFloating(targetRef, options) {
 
 //#endregion
 export { useFloating as t };
-//# sourceMappingURL=useFloating-DCxblHIR.js.map
+//# sourceMappingURL=useFloating-DRwB71jG.js.map

package/dist/{useFloating-DCxblHIR.js.map → useFloating-DRwB71jG.js.map}

@@ -1 +1 @@
-{"version":3,"file":"useFloating-DCxblHIR.js","names":["FALLBACK_PLACEMENTS: Record<Placement, Placement[]>","raw","scrollContainer: Window | HTMLElement | null"],"sources":["../src/hooks/useFloating/constants/fallbackPlacements.ts","../src/hooks/useFloating/utils/position.ts","../src/hooks/useFloating/index.ts"],"sourcesContent":["// Types\nimport type { Placement } from '@hooks/useFloating/types'\n\nexport const FALLBACK_PLACEMENTS: Record<Placement, Placement[]> = {\n  'bottom-start': [\n    'bottom-start',\n    'top-start',\n    'bottom-end',\n    'top-end',\n    'right-start',\n    'left-start'\n  ],\n  'bottom-end': [\n    'bottom-end',\n    'top-end',\n    'bottom-start',\n    'top-start',\n    'left-start',\n    'right-start'\n  ],\n  bottom: [\n    'bottom',\n    'top',\n    'bottom-start',\n    'bottom-end',\n    'top-start',\n    'top-end'\n  ],\n  'top-start': [\n    'top-start',\n    'bottom-start',\n    'top-end',\n    'bottom-end',\n    'right-start',\n    'left-start'\n  ],\n  'top-end': [\n    'top-end',\n    'bottom-end',\n    'top-start',\n    'bottom-start',\n    'left-start',\n    'right-start'\n  ],\n  top: ['top', 'bottom', 'top-start', 'top-end', 'bottom-start', 'bottom-end'],\n  'right-start': [\n    'right-start',\n    'left-start',\n    'right-end',\n    'left-end',\n    'bottom-start',\n    'top-start'\n  ],\n  'right-end': [\n    'right-end',\n    'left-end',\n    'right-start',\n    'left-start',\n    'bottom-end',\n    'top-end'\n  ],\n  right: [\n    'right',\n    'left',\n    'right-start',\n    'right-end',\n    'left-start',\n    'left-end'\n  ],\n  'left-start': [\n    'left-start',\n    'right-start',\n    'left-end',\n    'right-end',\n    'bottom-start',\n    'top-start'\n  ],\n  'left-end': [\n    'left-end',\n    'right-end',\n    'left-start',\n    'right-start',\n    'bottom-end',\n    'top-end'\n  ],\n  left: ['left', 'right', 'left-start', 'left-end', 'right-start', 'right-end'],\n  center: ['center', 'bottom', 'top', 'right', 'left']\n}\n","// Utils\nimport { FALLBACK_PLACEMENTS } from '../constants/fallbackPlacements'\n\n// Types\nimport type { Placement, PositionResult } from '@hooks/useFloating/types'\n\ntype CalcParams = {\n  rect: DOMRect\n  floatingRect: DOMRect\n  placement: Placement\n  offsetX: number\n  offsetY: number\n}\n\nfunction calcForPlacement({\n  rect,\n  offsetY,\n  offsetX,\n  placement,\n  floatingRect\n}: CalcParams): Omit<PositionResult, 'placement'> {\n  let top = rect.top + offsetY\n  let left = rect.left + offsetX\n\n  switch (placement) {\n    case 'top':\n      top = rect.top - floatingRect.height - offsetY\n      left = rect.left + rect.width / 2 - floatingRect.width / 2 + offsetX\n      break\n\n    case 'top-start':\n      top = rect.top - floatingRect.height - offsetY\n      break\n\n    case 'top-end':\n      top = rect.top - floatingRect.height - offsetY\n      left = rect.right - offsetX - floatingRect.width\n      break\n\n    case 'bottom':\n      top = rect.bottom + offsetY\n      left = rect.left + rect.width / 2 - floatingRect.width / 2 + offsetX\n      break\n\n    case 'bottom-start':\n      top = rect.bottom + offsetY\n      break\n\n    case 'bottom-end':\n      top = rect.bottom + offsetY\n      left = rect.right - offsetX - floatingRect.width\n      break\n\n    case 'left':\n      top = rect.top + rect.height / 2 - floatingRect.height / 2 + offsetY\n      left = rect.left - floatingRect.width - offsetX\n      break\n\n    case 'left-start':\n      left = rect.left - floatingRect.width - offsetX\n      break\n\n    case 'left-end':\n      top = rect.bottom - floatingRect.height - offsetY\n      left = rect.left - floatingRect.width - offsetX\n      break\n\n    case 'right':\n      top = rect.top + rect.height / 2 - floatingRect.height / 2 + offsetY\n      left = rect.right + offsetX\n      break\n\n    case 'right-start':\n      left = rect.right + offsetX\n      break\n\n    case 'right-end':\n      left = rect.right + offsetX\n      top = rect.bottom - floatingRect.height - offsetY\n      break\n\n    case 'center':\n      left = rect.left + rect.width / 2 - floatingRect.width / 2 + offsetX\n      top = rect.top + rect.height / 2 - floatingRect.height / 2 + offsetY\n      break\n  }\n\n  return { top, left }\n}\n\nfunction clampToViewport(\n  top: number,\n  left: number,\n  floatingRect: DOMRect,\n  margin: number\n) {\n  const vw = window.innerWidth\n  const vh = window.innerHeight\n\n  const clampedLeft = Math.min(\n    Math.max(left, margin),\n    vw - floatingRect.width - margin\n  )\n  const clampedTop = Math.min(\n    Math.max(top, margin),\n    vh - floatingRect.height - margin\n  )\n\n  return { top: clampedTop, left: clampedLeft }\n}\n\nfunction overflows(\n  top: number,\n  left: number,\n  floatingRect: DOMRect,\n  margin: number\n) {\n  const vw = window.innerWidth\n  const vh = window.innerHeight\n  return {\n    left: left < margin,\n    right: left + floatingRect.width > vw - margin,\n    top: top < margin,\n    bottom: top + floatingRect.height > vh - margin\n  }\n}\n\nfunction fallbackPlacements(p: Placement): Placement[] {\n  return FALLBACK_PLACEMENTS[p] ?? [p]\n}\n\nexport function getPositionInViewport(params: {\n  rect: DOMRect\n  margin?: number\n  offsetX?: number\n  offsetY?: number\n  tryFlip?: boolean\n  floatingRect: DOMRect\n  placement: Placement\n}): PositionResult {\n  const {\n    rect,\n    floatingRect,\n    placement,\n    offsetX = 0,\n    offsetY = 0,\n    margin = 8,\n    tryFlip = true\n  } = params\n\n  const tries = tryFlip ? fallbackPlacements(placement) : [placement]\n\n  for (const p of tries) {\n    const raw = calcForPlacement({\n      rect,\n      floatingRect,\n      placement: p,\n      offsetX,\n      offsetY\n    })\n    const o = overflows(raw.top, raw.left, floatingRect, margin)\n    if (!o.left && !o.right && !o.top && !o.bottom) {\n      return { ...raw, placement: p }\n    }\n  }\n\n  const raw = calcForPlacement({\n    rect,\n    offsetY,\n    offsetX,\n    placement,\n    floatingRect\n  })\n  const clamped = clampToViewport(raw.top, raw.left, floatingRect, margin)\n  return { ...clamped, placement }\n}\n","// External Libraries\nimport { useMemo, useState, useEffect, useCallback } from 'react'\n\n// Utils\nimport { getPositionInViewport } from '@hooks/useFloating/utils/position'\n\n// Types\nimport type { FloatingOptions } from '@hooks/useFloating/types'\n\nexport type AnchorLike = { getBoundingClientRect: () => DOMRect }\ntype Anchor = HTMLElement | AnchorLike\n\nfunction isElement(value: unknown): value is Element {\n  return value instanceof Element\n}\n\nexport function useFloating(\n  targetRef: React.RefObject<Anchor>,\n  options?: FloatingOptions\n) {\n  const {\n    portalRef,\n    offsetX = 0,\n    offsetY = 6,\n    strategy = 'fixed',\n    scrollContainerId,\n    viewportMargin = 8,\n    keepInViewport = true,\n    absoluteReference = 'portal',\n    placement = 'bottom-start'\n  } = options || {}\n\n  const [floatingEl, setFloatingEl] = useState<HTMLElement | null>(null)\n\n  const update = useCallback(() => {\n    const target = targetRef.current\n    const floating = floatingEl\n    if (!target || !floating) return\n\n    const rect = target.getBoundingClientRect()\n    const floatingRect = floating.getBoundingClientRect()\n\n    const pos = getPositionInViewport({\n      rect,\n      offsetX,\n      offsetY,\n      placement,\n      floatingRect,\n      tryFlip: keepInViewport,\n      margin: viewportMargin\n    })\n\n    let left = pos.left\n    let top = pos.top\n\n    if (strategy === 'absolute') {\n      if (absoluteReference === 'offsetParent') {\n        const op = floating.offsetParent\n        if (op instanceof HTMLElement) {\n          const r = op.getBoundingClientRect()\n\n          left -= r.left + op.clientLeft - op.scrollLeft\n          top -= r.top + op.clientTop - op.scrollTop\n        }\n      }\n\n      if (absoluteReference === 'portal') {\n        const el = portalRef?.current\n        if (el) {\n          const r = el.getBoundingClientRect()\n\n          left -= r.left + el.clientLeft - el.scrollLeft\n          top -= r.top + el.clientTop - el.scrollTop\n        }\n      }\n    }\n\n    floating.style.top = '0px'\n    floating.style.left = '0px'\n    floating.style.position = strategy\n    floating.style.transform = `translate(${left}px, ${top}px)`\n  }, [\n    offsetX,\n    offsetY,\n    strategy,\n    floatingEl,\n    placement,\n    targetRef,\n    keepInViewport,\n    viewportMargin,\n    absoluteReference,\n    portalRef?.current\n  ])\n\n  useEffect(() => {\n    if (!floatingEl) return\n\n    const scrollContainer: Window | HTMLElement | null = scrollContainerId\n      ? document.getElementById(scrollContainerId)\n      : window\n\n    update()\n\n    const rafUpdate = () => requestAnimationFrame(update)\n\n    // scroll (Window ou Element)\n    if (scrollContainer && 'addEventListener' in scrollContainer) {\n      scrollContainer.addEventListener('scroll', rafUpdate, { passive: true })\n    }\n    window.addEventListener('resize', rafUpdate, { passive: true })\n\n    const ro = new ResizeObserver(rafUpdate)\n\n    const target = targetRef.current\n\n    if (isElement(target)) ro.observe(target)\n\n    ro.observe(floatingEl)\n\n    return () => {\n      if (scrollContainer && 'removeEventListener' in scrollContainer) {\n        scrollContainer.removeEventListener('scroll', rafUpdate as any)\n      }\n      window.removeEventListener('resize', rafUpdate)\n      ro.disconnect()\n    }\n  }, [floatingEl, update, scrollContainerId, targetRef])\n\n  const floatingRef = useCallback((el: HTMLElement | null) => {\n    setFloatingEl(el)\n  }, [])\n\n  return useMemo(\n    () => ({ floatingEl, floatingRef, update }),\n    [floatingEl, floatingRef, update]\n  )\n}\n"],"mappings":";;;AAGA,MAAaA,sBAAsD;CACjE,gBAAgB;EACd;EACA;EACA;EACA;EACA;EACA;EACD;CACD,cAAc;EACZ;EACA;EACA;EACA;EACA;EACA;EACD;CACD,QAAQ;EACN;EACA;EACA;EACA;EACA;EACA;EACD;CACD,aAAa;EACX;EACA;EACA;EACA;EACA;EACA;EACD;CACD,WAAW;EACT;EACA;EACA;EACA;EACA;EACA;EACD;CACD,KAAK;EAAC;EAAO;EAAU;EAAa;EAAW;EAAgB;EAAa;CAC5E,eAAe;EACb;EACA;EACA;EACA;EACA;EACA;EACD;CACD,aAAa;EACX;EACA;EACA;EACA;EACA;EACA;EACD;CACD,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACD;CACD,cAAc;EACZ;EACA;EACA;EACA;EACA;EACA;EACD;CACD,YAAY;EACV;EACA;EACA;EACA;EACA;EACA;EACD;CACD,MAAM;EAAC;EAAQ;EAAS;EAAc;EAAY;EAAe;EAAY;CAC7E,QAAQ;EAAC;EAAU;EAAU;EAAO;EAAS;EAAO;CACrD;;;;ACzED,SAAS,iBAAiB,EACxB,MACA,SACA,SACA,WACA,gBACgD;CAChD,IAAI,MAAM,KAAK,MAAM;CACrB,IAAI,OAAO,KAAK,OAAO;AAEvB,SAAQ,WAAR;EACE,KAAK;AACH,SAAM,KAAK,MAAM,aAAa,SAAS;AACvC,UAAO,KAAK,OAAO,KAAK,QAAQ,IAAI,aAAa,QAAQ,IAAI;AAC7D;EAEF,KAAK;AACH,SAAM,KAAK,MAAM,aAAa,SAAS;AACvC;EAEF,KAAK;AACH,SAAM,KAAK,MAAM,aAAa,SAAS;AACvC,UAAO,KAAK,QAAQ,UAAU,aAAa;AAC3C;EAEF,KAAK;AACH,SAAM,KAAK,SAAS;AACpB,UAAO,KAAK,OAAO,KAAK,QAAQ,IAAI,aAAa,QAAQ,IAAI;AAC7D;EAEF,KAAK;AACH,SAAM,KAAK,SAAS;AACpB;EAEF,KAAK;AACH,SAAM,KAAK,SAAS;AACpB,UAAO,KAAK,QAAQ,UAAU,aAAa;AAC3C;EAEF,KAAK;AACH,SAAM,KAAK,MAAM,KAAK,SAAS,IAAI,aAAa,SAAS,IAAI;AAC7D,UAAO,KAAK,OAAO,aAAa,QAAQ;AACxC;EAEF,KAAK;AACH,UAAO,KAAK,OAAO,aAAa,QAAQ;AACxC;EAEF,KAAK;AACH,SAAM,KAAK,SAAS,aAAa,SAAS;AAC1C,UAAO,KAAK,OAAO,aAAa,QAAQ;AACxC;EAEF,KAAK;AACH,SAAM,KAAK,MAAM,KAAK,SAAS,IAAI,aAAa,SAAS,IAAI;AAC7D,UAAO,KAAK,QAAQ;AACpB;EAEF,KAAK;AACH,UAAO,KAAK,QAAQ;AACpB;EAEF,KAAK;AACH,UAAO,KAAK,QAAQ;AACpB,SAAM,KAAK,SAAS,aAAa,SAAS;AAC1C;EAEF,KAAK;AACH,UAAO,KAAK,OAAO,KAAK,QAAQ,IAAI,aAAa,QAAQ,IAAI;AAC7D,SAAM,KAAK,MAAM,KAAK,SAAS,IAAI,aAAa,SAAS,IAAI;AAC7D;;AAGJ,QAAO;EAAE;EAAK;EAAM;;AAGtB,SAAS,gBACP,KACA,MACA,cACA,QACA;CACA,MAAM,KAAK,OAAO;CAClB,MAAM,KAAK,OAAO;CAElB,MAAM,cAAc,KAAK,IACvB,KAAK,IAAI,MAAM,OAAO,EACtB,KAAK,aAAa,QAAQ,OAC3B;AAMD,QAAO;EAAE,KALU,KAAK,IACtB,KAAK,IAAI,KAAK,OAAO,EACrB,KAAK,aAAa,SAAS,OAC5B;EAEyB,MAAM;EAAa;;AAG/C,SAAS,UACP,KACA,MACA,cACA,QACA;CACA,MAAM,KAAK,OAAO;CAClB,MAAM,KAAK,OAAO;AAClB,QAAO;EACL,MAAM,OAAO;EACb,OAAO,OAAO,aAAa,QAAQ,KAAK;EACxC,KAAK,MAAM;EACX,QAAQ,MAAM,aAAa,SAAS,KAAK;EAC1C;;AAGH,SAAS,mBAAmB,GAA2B;AACrD,QAAO,oBAAoB,MAAM,CAAC,EAAE;;AAGtC,SAAgB,sBAAsB,QAQnB;CACjB,MAAM,EACJ,MACA,cACA,WACA,UAAU,GACV,UAAU,GACV,SAAS,GACT,UAAU,SACR;CAEJ,MAAM,QAAQ,UAAU,mBAAmB,UAAU,GAAG,CAAC,UAAU;AAEnE,MAAK,MAAM,KAAK,OAAO;EACrB,MAAMC,QAAM,iBAAiB;GAC3B;GACA;GACA,WAAW;GACX;GACA;GACD,CAAC;EACF,MAAM,IAAI,UAAUA,MAAI,KAAKA,MAAI,MAAM,cAAc,OAAO;AAC5D,MAAI,CAAC,EAAE,QAAQ,CAAC,EAAE,SAAS,CAAC,EAAE,OAAO,CAAC,EAAE,OACtC,QAAO;GAAE,GAAGA;GAAK,WAAW;GAAG;;CAInC,MAAM,MAAM,iBAAiB;EAC3B;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QAAO;EAAE,GADO,gBAAgB,IAAI,KAAK,IAAI,MAAM,cAAc,OAAO;EACnD;EAAW;;;;;AClKlC,SAAS,UAAU,OAAkC;AACnD,QAAO,iBAAiB;;AAG1B,SAAgB,YACd,WACA,SACA;CACA,MAAM,EACJ,WACA,UAAU,GACV,UAAU,GACV,WAAW,SACX,mBACA,iBAAiB,GACjB,iBAAiB,MACjB,oBAAoB,UACpB,YAAY,mBACV,WAAW,EAAE;CAEjB,MAAM,CAAC,YAAY,iBAAiB,SAA6B,KAAK;CAEtE,MAAM,SAAS,kBAAkB;EAC/B,MAAM,SAAS,UAAU;EACzB,MAAM,WAAW;AACjB,MAAI,CAAC,UAAU,CAAC,SAAU;EAK1B,MAAM,MAAM,sBAAsB;GAChC,MAJW,OAAO,uBAAuB;GAKzC;GACA;GACA;GACA,cAPmB,SAAS,uBAAuB;GAQnD,SAAS;GACT,QAAQ;GACT,CAAC;EAEF,IAAI,OAAO,IAAI;EACf,IAAI,MAAM,IAAI;AAEd,MAAI,aAAa,YAAY;AAC3B,OAAI,sBAAsB,gBAAgB;IACxC,MAAM,KAAK,SAAS;AACpB,QAAI,cAAc,aAAa;KAC7B,MAAM,IAAI,GAAG,uBAAuB;AAEpC,aAAQ,EAAE,OAAO,GAAG,aAAa,GAAG;AACpC,YAAO,EAAE,MAAM,GAAG,YAAY,GAAG;;;AAIrC,OAAI,sBAAsB,UAAU;IAClC,MAAM,KAAK,WAAW;AACtB,QAAI,IAAI;KACN,MAAM,IAAI,GAAG,uBAAuB;AAEpC,aAAQ,EAAE,OAAO,GAAG,aAAa,GAAG;AACpC,YAAO,EAAE,MAAM,GAAG,YAAY,GAAG;;;;AAKvC,WAAS,MAAM,MAAM;AACrB,WAAS,MAAM,OAAO;AACtB,WAAS,MAAM,WAAW;AAC1B,WAAS,MAAM,YAAY,aAAa,KAAK,MAAM,IAAI;IACtD;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW;EACZ,CAAC;AAEF,iBAAgB;AACd,MAAI,CAAC,WAAY;EAEjB,MAAMC,kBAA+C,oBACjD,SAAS,eAAe,kBAAkB,GAC1C;AAEJ,UAAQ;EAER,MAAM,kBAAkB,sBAAsB,OAAO;AAGrD,MAAI,mBAAmB,sBAAsB,gBAC3C,iBAAgB,iBAAiB,UAAU,WAAW,EAAE,SAAS,MAAM,CAAC;AAE1E,SAAO,iBAAiB,UAAU,WAAW,EAAE,SAAS,MAAM,CAAC;EAE/D,MAAM,KAAK,IAAI,eAAe,UAAU;EAExC,MAAM,SAAS,UAAU;AAEzB,MAAI,UAAU,OAAO,CAAE,IAAG,QAAQ,OAAO;AAEzC,KAAG,QAAQ,WAAW;AAEtB,eAAa;AACX,OAAI,mBAAmB,yBAAyB,gBAC9C,iBAAgB,oBAAoB,UAAU,UAAiB;AAEjE,UAAO,oBAAoB,UAAU,UAAU;AAC/C,MAAG,YAAY;;IAEhB;EAAC;EAAY;EAAQ;EAAmB;EAAU,CAAC;CAEtD,MAAM,cAAc,aAAa,OAA2B;AAC1D,gBAAc,GAAG;IAChB,EAAE,CAAC;AAEN,QAAO,eACE;EAAE;EAAY;EAAa;EAAQ,GAC1C;EAAC;EAAY;EAAa;EAAO,CAClC"}
+{"version":3,"file":"useFloating-DRwB71jG.js","names":["FALLBACK_PLACEMENTS: Record<Placement, Placement[]>","raw","scrollContainer: Window | HTMLElement | null"],"sources":["../src/hooks/useFloating/constants/fallbackPlacements.ts","../src/hooks/useFloating/utils/position.ts","../src/hooks/useFloating/index.ts"],"sourcesContent":["// Types\nimport type { Placement } from '@hooks/useFloating/types'\n\nexport const FALLBACK_PLACEMENTS: Record<Placement, Placement[]> = {\n  'bottom-start': [\n    'bottom-start',\n    'top-start',\n    'bottom-end',\n    'top-end',\n    'right-start',\n    'left-start'\n  ],\n  'bottom-end': [\n    'bottom-end',\n    'top-end',\n    'bottom-start',\n    'top-start',\n    'left-start',\n    'right-start'\n  ],\n  bottom: [\n    'bottom',\n    'top',\n    'bottom-start',\n    'bottom-end',\n    'top-start',\n    'top-end'\n  ],\n  'top-start': [\n    'top-start',\n    'bottom-start',\n    'top-end',\n    'bottom-end',\n    'right-start',\n    'left-start'\n  ],\n  'top-end': [\n    'top-end',\n    'bottom-end',\n    'top-start',\n    'bottom-start',\n    'left-start',\n    'right-start'\n  ],\n  top: ['top', 'bottom', 'top-start', 'top-end', 'bottom-start', 'bottom-end'],\n  'right-start': [\n    'right-start',\n    'left-start',\n    'right-end',\n    'left-end',\n    'bottom-start',\n    'top-start'\n  ],\n  'right-end': [\n    'right-end',\n    'left-end',\n    'right-start',\n    'left-start',\n    'bottom-end',\n    'top-end'\n  ],\n  right: [\n    'right',\n    'left',\n    'right-start',\n    'right-end',\n    'left-start',\n    'left-end'\n  ],\n  'left-start': [\n    'left-start',\n    'right-start',\n    'left-end',\n    'right-end',\n    'bottom-start',\n    'top-start'\n  ],\n  'left-end': [\n    'left-end',\n    'right-end',\n    'left-start',\n    'right-start',\n    'bottom-end',\n    'top-end'\n  ],\n  left: ['left', 'right', 'left-start', 'left-end', 'right-start', 'right-end'],\n  center: ['center', 'bottom', 'top', 'right', 'left']\n}\n","// Utils\nimport { FALLBACK_PLACEMENTS } from '../constants/fallbackPlacements'\n\n// Types\nimport type { Placement, PositionResult } from '@hooks/useFloating/types'\n\ntype CalcParams = {\n  rect: DOMRect\n  floatingRect: DOMRect\n  placement: Placement\n  offsetX: number\n  offsetY: number\n}\n\nfunction calcForPlacement({\n  rect,\n  offsetY,\n  offsetX,\n  placement,\n  floatingRect\n}: CalcParams): Omit<PositionResult, 'placement'> {\n  let top = rect.top + offsetY\n  let left = rect.left + offsetX\n\n  switch (placement) {\n    case 'top':\n      top = rect.top - floatingRect.height - offsetY\n      left = rect.left + rect.width / 2 - floatingRect.width / 2 + offsetX\n      break\n\n    case 'top-start':\n      top = rect.top - floatingRect.height - offsetY\n      break\n\n    case 'top-end':\n      top = rect.top - floatingRect.height - offsetY\n      left = rect.right - offsetX - floatingRect.width\n      break\n\n    case 'bottom':\n      top = rect.bottom + offsetY\n      left = rect.left + rect.width / 2 - floatingRect.width / 2 + offsetX\n      break\n\n    case 'bottom-start':\n      top = rect.bottom + offsetY\n      break\n\n    case 'bottom-end':\n      top = rect.bottom + offsetY\n      left = rect.right - offsetX - floatingRect.width\n      break\n\n    case 'left':\n      top = rect.top + rect.height / 2 - floatingRect.height / 2 + offsetY\n      left = rect.left - floatingRect.width - offsetX\n      break\n\n    case 'left-start':\n      left = rect.left - floatingRect.width - offsetX\n      break\n\n    case 'left-end':\n      top = rect.bottom - floatingRect.height - offsetY\n      left = rect.left - floatingRect.width - offsetX\n      break\n\n    case 'right':\n      top = rect.top + rect.height / 2 - floatingRect.height / 2 + offsetY\n      left = rect.right + offsetX\n      break\n\n    case 'right-start':\n      left = rect.right + offsetX\n      break\n\n    case 'right-end':\n      left = rect.right + offsetX\n      top = rect.bottom - floatingRect.height - offsetY\n      break\n\n    case 'center':\n      left = rect.left + rect.width / 2 - floatingRect.width / 2 + offsetX\n      top = rect.top + rect.height / 2 - floatingRect.height / 2 + offsetY\n      break\n  }\n\n  return { top, left }\n}\n\nfunction clampToViewport(\n  top: number,\n  left: number,\n  floatingRect: DOMRect,\n  margin: number\n) {\n  const vw = window.innerWidth\n  const vh = window.innerHeight\n\n  const clampedLeft = Math.min(\n    Math.max(left, margin),\n    vw - floatingRect.width - margin\n  )\n  const clampedTop = Math.min(\n    Math.max(top, margin),\n    vh - floatingRect.height - margin\n  )\n\n  return { top: clampedTop, left: clampedLeft }\n}\n\nfunction overflows(\n  top: number,\n  left: number,\n  floatingRect: DOMRect,\n  margin: number\n) {\n  const vw = window.innerWidth\n  const vh = window.innerHeight\n  return {\n    left: left < margin,\n    right: left + floatingRect.width > vw - margin,\n    top: top < margin,\n    bottom: top + floatingRect.height > vh - margin\n  }\n}\n\nfunction fallbackPlacements(p: Placement): Placement[] {\n  return FALLBACK_PLACEMENTS[p] ?? [p]\n}\n\nexport function getPositionInViewport(params: {\n  rect: DOMRect\n  margin?: number\n  offsetX?: number\n  offsetY?: number\n  tryFlip?: boolean\n  floatingRect: DOMRect\n  placement: Placement\n}): PositionResult {\n  const {\n    rect,\n    floatingRect,\n    placement,\n    offsetX = 0,\n    offsetY = 0,\n    margin = 8,\n    tryFlip = true\n  } = params\n\n  const tries = tryFlip ? fallbackPlacements(placement) : [placement]\n\n  for (const p of tries) {\n    const raw = calcForPlacement({\n      rect,\n      floatingRect,\n      placement: p,\n      offsetX,\n      offsetY\n    })\n    const o = overflows(raw.top, raw.left, floatingRect, margin)\n    if (!o.left && !o.right && !o.top && !o.bottom) {\n      return { ...raw, placement: p }\n    }\n  }\n\n  const raw = calcForPlacement({\n    rect,\n    offsetY,\n    offsetX,\n    placement,\n    floatingRect\n  })\n  const clamped = clampToViewport(raw.top, raw.left, floatingRect, margin)\n  return { ...clamped, placement }\n}\n","// External Libraries\nimport { useMemo, useState, useEffect, useCallback } from 'react'\n\n// Utils\nimport { getPositionInViewport } from '@hooks/useFloating/utils/position'\n\n// Types\nimport type { FloatingOptions } from '@hooks/useFloating/types'\n\nexport type AnchorLike = { getBoundingClientRect: () => DOMRect }\ntype Anchor = HTMLElement | AnchorLike\n\nfunction isElement(value: unknown): value is Element {\n  return value instanceof Element\n}\n\nexport function useFloating(\n  targetRef: React.RefObject<Anchor>,\n  options?: FloatingOptions\n) {\n  const {\n    portalRef,\n    offsetX = 0,\n    offsetY = 6,\n    strategy = 'fixed',\n    scrollContainerId,\n    viewportMargin = 8,\n    keepInViewport = true,\n    absoluteReference = 'portal',\n    placement = 'bottom-start'\n  } = options || {}\n\n  const [floatingEl, setFloatingEl] = useState<HTMLElement | null>(null)\n\n  const update = useCallback(() => {\n    const target = targetRef.current\n    const floating = floatingEl\n    if (!target || !floating) return\n\n    const rect = target.getBoundingClientRect()\n    const floatingRect = floating.getBoundingClientRect()\n\n    const pos = getPositionInViewport({\n      rect,\n      offsetX,\n      offsetY,\n      placement,\n      floatingRect,\n      tryFlip: keepInViewport,\n      margin: viewportMargin\n    })\n\n    let left = pos.left\n    let top = pos.top\n\n    if (strategy === 'absolute') {\n      if (absoluteReference === 'offsetParent') {\n        const op = floating.offsetParent\n        if (op instanceof HTMLElement) {\n          const r = op.getBoundingClientRect()\n\n          left -= r.left + op.clientLeft - op.scrollLeft\n          top -= r.top + op.clientTop - op.scrollTop\n        }\n      }\n\n      if (absoluteReference === 'portal') {\n        const el = portalRef?.current\n        if (el) {\n          const r = el.getBoundingClientRect()\n\n          left -= r.left + el.clientLeft - el.scrollLeft\n          top -= r.top + el.clientTop - el.scrollTop\n        }\n      }\n    }\n\n    floating.style.top = '0px'\n    floating.style.left = '0px'\n    floating.style.position = strategy\n    floating.style.transform = `translate(${left}px, ${top}px)`\n  }, [\n    offsetX,\n    offsetY,\n    strategy,\n    floatingEl,\n    placement,\n    targetRef,\n    keepInViewport,\n    viewportMargin,\n    absoluteReference,\n    portalRef?.current\n  ])\n\n  useEffect(() => {\n    if (!floatingEl) return\n\n    console.log({ scrollContainerId })\n\n    const scrollContainer: Window | HTMLElement | null = scrollContainerId\n      ? document.getElementById(scrollContainerId)\n      : window\n\n    update()\n\n    const rafUpdate = () => requestAnimationFrame(update)\n\n    // scroll (Window ou Element)\n    if (scrollContainer && 'addEventListener' in scrollContainer) {\n      scrollContainer.addEventListener('scroll', rafUpdate, { passive: true })\n    }\n    window.addEventListener('resize', rafUpdate, { passive: true })\n\n    const ro = new ResizeObserver(rafUpdate)\n\n    const target = targetRef.current\n\n    if (isElement(target)) ro.observe(target)\n\n    ro.observe(floatingEl)\n\n    return () => {\n      if (scrollContainer && 'removeEventListener' in scrollContainer) {\n        scrollContainer.removeEventListener('scroll', rafUpdate as any)\n      }\n      window.removeEventListener('resize', rafUpdate)\n      ro.disconnect()\n    }\n  }, [floatingEl, update, scrollContainerId, targetRef])\n\n  const floatingRef = useCallback((el: HTMLElement | null) => {\n    setFloatingEl(el)\n  }, [])\n\n  return useMemo(\n    () => ({ floatingEl, floatingRef, update }),\n    [floatingEl, floatingRef, update]\n  )\n}\n"],"mappings":"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"}

package/dist/{useThemedStyles-C23Tevdv.d.ts → useThemedStyles-BUR6rDGs.d.ts}

@@ -107,4 +107,4 @@ type TypeStyles<TFactory extends StylesFactoryAny> = Partial<{ [K in keyof Retur
 type StylesOf<T extends (...args: any) => any> = Partial<ReturnType<T>>;
 //#endregion
 export { StylesOf as n, TypeStyles as r, SlotStyle as t };
-//# sourceMappingURL=useThemedStyles-C23Tevdv.d.ts.map
+//# sourceMappingURL=useThemedStyles-BUR6rDGs.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "softable-pixels-web",
-  "version": "1.1.20",
+  "version": "1.1.22",
   "description": "",
   "keywords": [],
   "author": "softable",

package/dist/BasePopover-UzOryrTn.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BasePopover-UzOryrTn.js","names":["BasePopover: React.FC<BasePopoverProps>"],"sources":["../src/components/commons/structure/BasePopover/styles.ts","../src/components/commons/structure/BasePopover/index.tsx"],"sourcesContent":["// Types\nimport type { BasePopoverProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createBasePopoverStyles({\n  maxWidth = 'unset',\n  minWidth = 'fit-content',\n  minHeight = 'fit-content',\n  maxHeight = '15rem',\n  panel\n}: BasePopoverProps) {\n  return styled({\n    content: {\n      minWidth,\n      maxWidth,\n      minHeight,\n      maxHeight,\n\n      display: 'flex',\n      flexDirection: 'column',\n\n      zIndex: 10,\n\n      overflowY: 'auto',\n      overscrollBehavior: 'contain',\n\n      borderWidth: 1,\n      rowGap: '0.25rem',\n      padding: panel?.padding ? panel.padding : '0.5rem',\n      borderRadius: '0.75rem',\n\n      backgroundColor: 'var(--px-bg)',\n      boxShadow: 'var(--px-shadow-default)',\n      borderColor: 'var(--px-border-primary)'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Components\nimport { Popover } from '@components/commons/toolkit/Popover'\n\n// Types\nimport type { BasePopoverProps } from './types'\n\n// Styles\nimport { createBasePopoverStyles } from './styles'\n\nexport const BasePopover: React.FC<BasePopoverProps> = props => {\n  const { children, ...rest } = props\n\n  const { styles } = useThemedStyles(props, createBasePopoverStyles, {\n    applyCommonProps: false,\n    pick: p => [p.open, p.trigger]\n  })\n\n  return (\n    <Popover\n      p={0}\n      hideShadow\n      {...rest}\n      content={({ widthTrigger }) => (\n        <div style={{ ...styles.content, width: widthTrigger }}>{children}</div>\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;AAIA,SAAgB,wBAAwB,EACtC,WAAW,SACX,WAAW,eACX,YAAY,eACZ,YAAY,SACZ,SACmB;AACnB,QAAO,OAAO,EACZ,SAAS;EACP;EACA;EACA;EACA;EAEA,SAAS;EACT,eAAe;EAEf,QAAQ;EAER,WAAW;EACX,oBAAoB;EAEpB,aAAa;EACb,QAAQ;EACR,SAAS,OAAO,UAAU,MAAM,UAAU;EAC1C,cAAc;EAEd,iBAAiB;EACjB,WAAW;EACX,aAAa;EACd,EACF,CAAC;;;;;ACpBJ,MAAaA,eAA0C,UAAS;CAC9D,MAAM,EAAE,UAAU,GAAG,SAAS;CAE9B,MAAM,EAAE,WAAW,gBAAgB,OAAO,yBAAyB;EACjE,kBAAkB;EAClB,OAAM,MAAK,CAAC,EAAE,MAAM,EAAE,QAAQ;EAC/B,CAAC;AAEF,QACE,oBAAC;EACC,GAAG;EACH;EACA,GAAI;EACJ,UAAU,EAAE,mBACV,oBAAC;GAAI,OAAO;IAAE,GAAG,OAAO;IAAS,OAAO;IAAc;GAAG;IAAe;GAE1E"}

package/dist/Input-B6a6mXsZ.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Input-B6a6mXsZ.js","names":[],"sources":["../src/components/commons/inputs/Input/hooks/useInput/index.ts","../src/components/commons/inputs/Input/styles.ts","../src/components/commons/inputs/Input/index.tsx"],"sourcesContent":["// External Libraries\nimport { useState, useRef } from 'react'\n\n// Types\nimport type { InputProps } from '../../types'\n\nexport function useInput({ onChange }: InputProps) {\n  // Refs\n  const inputRef = useRef<HTMLInputElement>(null)\n\n  // States\n  const [showPassword, setShowPassword] = useState(false)\n\n  // Functions\n  function togglePasswordVisibility() {\n    setShowPassword(prev => !prev)\n  }\n\n  function handleRefMethods() {\n    return { focus: handleFocus, blur: handleBlur }\n  }\n\n  function handleFocus() {\n    inputRef.current?.focus()\n  }\n\n  function handleBlur() {\n    inputRef.current?.blur()\n  }\n\n  function handleChange(e: React.ChangeEvent<HTMLInputElement>) {\n    const value = e.target.value\n    onChange?.(value)\n  }\n\n  return {\n    inputRef,\n    showPassword,\n    handleChange,\n    handleRefMethods,\n    togglePasswordVisibility\n  }\n}\n","// Hooks\nimport { styled } from '@hooks/useThemedStyles/types'\n\n// Types\nimport type { InputProps } from './types'\n\nexport function createInputStyles(props: InputProps) {\n  return styled({\n    container: {\n      width: '100%',\n\n      display: 'flex',\n      flexDirection: 'column',\n\n      rowGap: '0.375rem'\n    },\n    wrapper: {\n      width: '100%',\n      display: 'flex',\n      alignItems: 'center',\n\n      borderWidth: 1,\n      columnGap: '0.25rem',\n      borderRadius: '0.5rem',\n      padding: '0.625rem 0.875rem',\n\n      opacity: props.disabled ? 0.5 : 1,\n      boxShadow: 'var(--px-shadow-default)',\n      borderColor: props.errorMessage\n        ? 'var(--px-color-error)'\n        : 'var(--px-border-primary)',\n\n      __rules: {\n        '&:focus-within': {\n          outlineOffset: '-1px',\n          outline: `2px solid var(${props.errorMessage ? '--px-color-error' : '--px-color-primary'})`\n        }\n      }\n    },\n\n    input: {\n      flex: 1,\n\n      fontWeight: 500,\n      fontSize: '1rem',\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      color: 'var(--px-text-primary)',\n\n      __rules: {\n        '&:disabled': {\n          cursor: 'not-allowed'\n        },\n\n        '&:focus': {\n          outline: 'none'\n        },\n\n        '&::placeholder': {\n          fontWeight: 400,\n          color: 'var(--px-text-secondary)'\n        }\n      }\n    },\n\n    error: {\n      display: 'block',\n      fontWeight: 400,\n      lineHeight: '1rem',\n      fontSize: '0.75rem',\n      fontFamily: 'inherit',\n      color: 'var(--px-text-error)'\n    },\n\n    button: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n\n      cursor: 'pointer',\n      padding: '0.25rem',\n      borderRadius: '0.5rem',\n\n      __rules: {\n        '&:focus': {\n          outline: '1px solid var(--px-border-primary)'\n        }\n      }\n    }\n  })\n}\n","// External Libraries\nimport { forwardRef, useId, useImperativeHandle, useMemo } from 'react'\n\n// Components\nimport { Label } from '../../toolkit/Label'\nimport { Icon } from '@components/commons/toolkit/Icon'\n\n// Types\nimport type { InputProps, InputMethods } from './types'\n\n// Hooks\nimport { useInput } from './hooks/useInput'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createInputStyles } from './styles'\n\nexport const Input = forwardRef<InputMethods, InputProps>((props, ref) => {\n  // Constants\n  const reactId = useId()\n  const inputId = useMemo(() => {\n    return props.id || `input-${reactId}`\n  }, [props.id, reactId])\n\n  // Hooks\n  const {\n    inputRef,\n    showPassword,\n    handleChange,\n    handleRefMethods,\n    togglePasswordVisibility\n  } = useInput(props)\n  useImperativeHandle(ref, handleRefMethods)\n\n  // Hooks\n  const { styles, classes } = useThemedStyles(props, createInputStyles, {\n    pick: p => [p.disabled, p.errorMessage],\n    override: props.styles,\n    applyCommonProps: true,\n    commonSlot: 'container'\n  })\n\n  // Functions\n  function getType() {\n    if (props.type === 'password' && showPassword) return 'text'\n    return props.type\n  }\n\n  function renderEndContent() {\n    if (props.type === 'password') {\n      return (\n        <button\n          type=\"button\"\n          style={styles.button}\n          className={classes.button}\n          onClick={togglePasswordVisibility}\n        >\n          <Icon\n            size=\"sm\"\n            name={showPassword ? 'general-eye-off' : 'general-eye'}\n          />\n        </button>\n      )\n    }\n\n    return props.endIcon ?? null\n  }\n\n  return (\n    <div style={styles.container}>\n      {props.hideLabel ? null : (\n        <Label\n          htmlFor={inputId}\n          label={props.label}\n          required={props.required}\n          requiredColor={props.requiredColor}\n          {...props.labelConfig}\n        />\n      )}\n\n      <div style={styles.wrapper} className={classes.wrapper}>\n        {props.startIcon}\n\n        <input\n          ref={inputRef}\n          id={inputId}\n          type={getType()}\n          value={props.value}\n          style={styles.input}\n          required={props.required}\n          disabled={props.disabled}\n          className={classes.input}\n          minLength={props.minLength}\n          maxLength={props.maxLength}\n          placeholder={props.placeholder}\n          aria-label={!props.hideLabel ? undefined : props.label}\n          onChange={handleChange}\n        />\n\n        {renderEndContent()}\n      </div>\n\n      {props.errorMessage ? (\n        <span style={styles.error}>{props.errorMessage}</span>\n      ) : null}\n    </div>\n  )\n})\n\nInput.displayName = 'Input'\n"],"mappings":"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"}

package/dist/Popover-C-NRJlWf.js

@@ -1,170 +0,0 @@
-import { n as styled, t as useThemedStyles } from "./useThemedStyles-CrarDyWc.js";
-import { t as useDismiss } from "./useDismiss-CAEk_GV-.js";
-import { t as useFloating } from "./useFloating-DCxblHIR.js";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { createPortal } from "react-dom";
-
-//#region src/components/commons/toolkit/Popover/styles.ts
-function createPopoverStyles({ hideShadow = false }) {
-	return styled({
-		popoverNode: {
-			position: "fixed",
-			left: 0,
-			top: 0,
-			zIndex: 10,
-			padding: "0.25rem",
-			backgroundColor: "var(--px-bg)",
-			boxShadow: hideShadow ? "none" : "var(--px-ring-1)",
-			borderRadius: "var(--px-radius-xl)"
-		},
-		trigger: {
-			width: "fit-content",
-			height: "fit-content"
-		}
-	});
-}
-
-//#endregion
-//#region src/components/commons/toolkit/Popover/utils/portal.ts
-function createsFixedContainingBlock(el) {
-	let node = el;
-	while (node) {
-		const s = getComputedStyle(node);
-		if (s.transform !== "none" || s.translate !== "none" || s.perspective !== "none" || s.filter !== "none" || s.backdropFilter !== "none" || s.contain.includes("paint")) return true;
-		node = node.parentElement;
-	}
-	return false;
-}
-
-//#endregion
-//#region src/components/commons/toolkit/Popover/types.ts
-var types_exports = {};
-
-//#endregion
-//#region src/components/commons/toolkit/Popover/index.tsx
-const Popover = (props) => {
-	const { portalId, anchorRef, floatingOptions, absoluteReference, closeOnEscape = true, open: controlledOpen, closeOnOutsideClick = true, trigger, content, onOpenChange, onMouseEnter, onMouseLeave } = props;
-	const triggerRef = useRef(null);
-	const popoverRef = useRef(null);
-	const portalRef = useRef(null);
-	const resolvedAnchorRef = anchorRef ?? triggerRef;
-	const [uncontrolledOpen, setUncontrolledOpen] = useState(false);
-	const [widthTrigger, setWidthTrigger] = useState(triggerRef.current?.offsetWidth ?? 0);
-	const [portalEl, setPortalEl] = useState(null);
-	const open = controlledOpen ?? uncontrolledOpen;
-	const { styles } = useThemedStyles(props, createPopoverStyles, {
-		applyCommonProps: true,
-		override: props.styles,
-		commonSlot: "popoverNode",
-		pick: (p) => [
-			p.open,
-			p.content,
-			p.trigger
-		]
-	});
-	useEffect(() => {
-		if (typeof document === "undefined") return;
-		if (!portalId) {
-			setPortalEl(null);
-			return;
-		}
-		const found = document.getElementById(portalId);
-		setPortalEl(found);
-		if (found) return;
-		const obs = new MutationObserver(() => {
-			const el = document.getElementById(portalId);
-			if (el) {
-				setPortalEl(el);
-				obs.disconnect();
-			}
-		});
-		obs.observe(document.documentElement, {
-			childList: true,
-			subtree: true
-		});
-		return () => obs.disconnect();
-	}, [portalId]);
-	useEffect(() => {
-		portalRef.current = portalEl;
-	}, [portalEl]);
-	const portalContainer = useMemo(() => {
-		if (typeof document === "undefined") return null;
-		return portalEl ?? document.body;
-	}, [portalEl]);
-	const { floatingRef, update } = useFloating(resolvedAnchorRef, useMemo(() => {
-		const base = {
-			offsetY: 6,
-			keepInViewport: true,
-			placement: "bottom-start",
-			portalRef
-		};
-		const userStrategy = floatingOptions?.strategy ?? "fixed";
-		const shouldFixFixedInPortal = !!portalId && portalContainer && userStrategy === "fixed" && portalContainer !== document.body && createsFixedContainingBlock(portalContainer);
-		if (portalContainer) console.log(createsFixedContainingBlock(portalContainer));
-		if (shouldFixFixedInPortal) return {
-			...base,
-			...floatingOptions,
-			strategy: "absolute",
-			absoluteReference: "offsetParent"
-		};
-		return {
-			...base,
-			...floatingOptions,
-			absoluteReference
-		};
-	}, [
-		portalId,
-		portalContainer,
-		floatingOptions
-	]));
-	const setOpen = useCallback((v) => {
-		onOpenChange?.(v);
-		if (controlledOpen === void 0) setUncontrolledOpen(v);
-	}, [controlledOpen, onOpenChange]);
-	const close = useCallback(() => setOpen(false), [setOpen]);
-	useDismiss({
-		open,
-		closeOnEscape,
-		closeOnOutsideClick,
-		refs: [resolvedAnchorRef, popoverRef],
-		onClose: close
-	});
-	useEffect(() => {
-		if (open) requestAnimationFrame(update);
-		setWidthTrigger(triggerRef.current?.offsetWidth ?? 0);
-	}, [open, update]);
-	useEffect(() => {
-		const handleResize = () => {
-			setWidthTrigger(triggerRef.current?.offsetWidth ?? 0);
-		};
-		window.addEventListener("resize", handleResize);
-		return () => window.removeEventListener("resize", handleResize);
-	}, []);
-	const triggerNode = trigger?.({
-		ariaExpanded: open,
-		ref: triggerRef,
-		onClick: () => setOpen(!open)
-	}) ?? null;
-	const popoverNode = open ? /* @__PURE__ */ jsx("div", {
-		ref: (el) => {
-			popoverRef.current = el;
-			floatingRef(el);
-		},
-		role: "dialog",
-		style: styles.popoverNode,
-		onMouseEnter,
-		onMouseLeave,
-		onPointerDownCapture: (e) => e.stopPropagation(),
-		onMouseDownCapture: (e) => e.stopPropagation(),
-		children: content({
-			close,
-			widthTrigger
-		})
-	}) : null;
-	return /* @__PURE__ */ jsxs(Fragment, { children: [triggerNode, typeof document !== "undefined" ? createPortal(popoverNode, portalContainer ?? document.body) : null] });
-};
-
-//#endregion
-export { types_exports as n, Popover as t };
-//# sourceMappingURL=Popover-C-NRJlWf.js.map

package/dist/Popover-C-NRJlWf.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Popover-C-NRJlWf.js","names":["node: HTMLElement | null","Popover: React.FC<PopoverProps>"],"sources":["../src/components/commons/toolkit/Popover/styles.ts","../src/components/commons/toolkit/Popover/utils/portal.ts","../src/components/commons/toolkit/Popover/types.ts","../src/components/commons/toolkit/Popover/index.tsx"],"sourcesContent":["// Types\nimport type { PopoverProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createPopoverStyles({ hideShadow = false }: PopoverProps) {\n  return styled({\n    popoverNode: {\n      position: 'fixed',\n      left: 0,\n      top: 0,\n\n      zIndex: 10,\n\n      padding: '0.25rem',\n\n      backgroundColor: 'var(--px-bg)',\n      boxShadow: hideShadow ? 'none' : 'var(--px-ring-1)',\n\n      borderRadius: 'var(--px-radius-xl)'\n    },\n\n    trigger: {\n      width: 'fit-content',\n      height: 'fit-content'\n    }\n  })\n}\n","export function resolvePortalContainer(portalId?: string): HTMLElement | null {\n  if (typeof document === 'undefined') return null\n  if (!portalId) return document.body\n  return document.getElementById(portalId) ?? document.body\n}\n\nexport function createsFixedContainingBlock(el: HTMLElement): boolean {\n  let node: HTMLElement | null = el\n  while (node) {\n    const s = getComputedStyle(node)\n    if (\n      s.transform !== 'none' ||\n      s.translate !== 'none' ||\n      s.perspective !== 'none' ||\n      s.filter !== 'none' ||\n      s.backdropFilter !== 'none' ||\n      s.contain.includes('paint')\n    ) {\n      return true\n    }\n    node = node.parentElement\n  }\n  return false\n}\n","// External Libraries\nimport type { MouseEventHandler, ReactNode, RefObject } from 'react'\n\n// Types\nimport type { createPopoverStyles } from './styles'\nimport type { FloatingOptions } from '@hooks/useFloating/types'\nimport type { PaddingProps } from '@hooks/useThemedStyles/types'\n\nexport type PopoverTriggerRenderProps = {\n  ariaExpanded: boolean\n  ref: RefObject<HTMLElement>\n  onClick: () => void\n}\n\nexport interface PopoverProps extends PaddingProps {\n  open?: boolean\n  portalId?: string\n  hideShadow?: boolean\n  closeOnEscape?: boolean\n  closeOnOutsideClick?: boolean\n  floatingOptions?: FloatingOptions\n  anchorRef?: RefObject<HTMLElement>\n  absoluteReference?: FloatingOptions['absoluteReference']\n\n  onOpenChange?: (v: boolean) => void\n  onMouseEnter?: MouseEventHandler<HTMLDivElement>\n  onMouseLeave?: MouseEventHandler<HTMLDivElement>\n  content: (ctx: { close: () => void; widthTrigger: number }) => ReactNode\n  trigger?: (props: PopoverTriggerRenderProps) => ReactNode\n\n  styles?: Partial<ReturnType<typeof createPopoverStyles>>\n}\n","// External Libraries\n/** biome-ignore-all lint/suspicious/noExplicitAny: <Not needed> */\n/** biome-ignore-all lint/correctness/useExhaustiveDependencies: <Not needed> */\nimport type React from 'react'\nimport { createPortal } from 'react-dom'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\n\n// Hooks\nimport { useDismiss } from '@hooks/useDismiss'\nimport { useFloating } from '@hooks/useFloating'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { PopoverProps } from './types'\n\n// Styles\nimport { createPopoverStyles } from './styles'\nimport { createsFixedContainingBlock } from './utils'\n\nexport * as PopoverTypes from './types'\n\nexport const Popover: React.FC<PopoverProps> = props => {\n  const {\n    portalId,\n    anchorRef,\n    floatingOptions,\n    absoluteReference,\n    closeOnEscape = true,\n    open: controlledOpen,\n    closeOnOutsideClick = true,\n    trigger,\n    content,\n    onOpenChange,\n    onMouseEnter,\n    onMouseLeave\n  } = props\n\n  // Refs\n  const triggerRef = useRef<HTMLElement | null>(null)\n  const popoverRef = useRef<HTMLDivElement | null>(null)\n  const portalRef = useRef<HTMLElement | null>(null)\n\n  const resolvedAnchorRef = (anchorRef ?? triggerRef) as any\n\n  // States\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(false)\n  const [widthTrigger, setWidthTrigger] = useState(\n    triggerRef.current?.offsetWidth ?? 0\n  )\n  const [portalEl, setPortalEl] = useState<HTMLElement | null>(null)\n\n  const open = controlledOpen ?? uncontrolledOpen\n\n  // Hooks\n  const { styles } = useThemedStyles(props, createPopoverStyles, {\n    applyCommonProps: true,\n    override: props.styles,\n    commonSlot: 'popoverNode',\n    pick: p => [p.open, p.content, p.trigger]\n  })\n\n  // UseEffects\n  useEffect(() => {\n    if (typeof document === 'undefined') return\n\n    if (!portalId) {\n      setPortalEl(null)\n      return\n    }\n\n    const found = document.getElementById(portalId) as HTMLElement | null\n    setPortalEl(found)\n\n    if (found) return\n\n    const obs = new MutationObserver(() => {\n      const el = document.getElementById(portalId) as HTMLElement | null\n      if (el) {\n        setPortalEl(el)\n        obs.disconnect()\n      }\n    })\n\n    obs.observe(document.documentElement, { childList: true, subtree: true })\n    return () => obs.disconnect()\n  }, [portalId])\n\n  useEffect(() => {\n    portalRef.current = portalEl\n  }, [portalEl])\n\n  const portalContainer = useMemo(() => {\n    if (typeof document === 'undefined') return null\n    return portalEl ?? document.body\n  }, [portalEl])\n\n  const effectiveFloatingOptions = useMemo(() => {\n    const base = {\n      offsetY: 6,\n      keepInViewport: true,\n      placement: 'bottom-start',\n      portalRef\n    } as const\n\n    const userStrategy = floatingOptions?.strategy ?? 'fixed'\n\n    const shouldFixFixedInPortal =\n      !!portalId &&\n      portalContainer &&\n      userStrategy === 'fixed' &&\n      portalContainer !== document.body &&\n      createsFixedContainingBlock(portalContainer)\n\n    if (portalContainer)\n      console.log(createsFixedContainingBlock(portalContainer))\n    if (shouldFixFixedInPortal) {\n      return {\n        ...base,\n        ...floatingOptions,\n        strategy: 'absolute',\n        absoluteReference: 'offsetParent'\n      } as any\n    }\n\n    return {\n      ...base,\n      ...floatingOptions,\n      absoluteReference: absoluteReference\n    } as any\n  }, [portalId, portalContainer, floatingOptions])\n\n  const { floatingRef, update } = useFloating(\n    resolvedAnchorRef,\n    effectiveFloatingOptions\n  )\n\n  const setOpen = useCallback(\n    (v: boolean) => {\n      onOpenChange?.(v)\n      if (controlledOpen === undefined) setUncontrolledOpen(v)\n    },\n    [controlledOpen, onOpenChange]\n  )\n\n  const close = useCallback(() => setOpen(false), [setOpen])\n\n  useDismiss({\n    open,\n    closeOnEscape,\n    closeOnOutsideClick,\n    refs: [resolvedAnchorRef, popoverRef],\n    onClose: close\n  })\n\n  useEffect(() => {\n    if (open) requestAnimationFrame(update)\n    setWidthTrigger(triggerRef.current?.offsetWidth ?? 0)\n  }, [open, update])\n\n  useEffect(() => {\n    const handleResize = () => {\n      setWidthTrigger(triggerRef.current?.offsetWidth ?? 0)\n    }\n\n    window.addEventListener('resize', handleResize)\n    return () => window.removeEventListener('resize', handleResize)\n  }, [])\n\n  const triggerNode =\n    trigger?.({\n      ariaExpanded: open,\n      ref: triggerRef as any,\n      onClick: () => setOpen(!open)\n    }) ?? null\n\n  const popoverNode = open ? (\n    <div\n      ref={el => {\n        popoverRef.current = el\n        floatingRef(el)\n      }}\n      role=\"dialog\"\n      style={styles.popoverNode}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      onPointerDownCapture={e => e.stopPropagation()}\n      onMouseDownCapture={e => e.stopPropagation()}\n    >\n      {content({ close, widthTrigger })}\n    </div>\n  ) : null\n\n  return (\n    <>\n      {triggerNode}\n      {typeof document !== 'undefined'\n        ? createPortal(popoverNode, portalContainer ?? document.body)\n        : null}\n    </>\n  )\n}\n"],"mappings":"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"}

package/dist/Select-CVcQGxjv.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Select-CVcQGxjv.js","names":["OptionItem: React.FC<OptionItemProps>","Select: React.FC<SelectProps>"],"sources":["../src/components/commons/inputs/Select/components/OptionItem/styles.ts","../src/components/commons/inputs/Select/components/OptionItem/index.tsx","../src/components/commons/inputs/Select/hooks/useSelect/index.ts","../src/components/commons/inputs/Select/styles.ts","../src/components/commons/inputs/Select/types.ts","../src/components/commons/inputs/Select/index.tsx"],"sourcesContent":["import { styled } from '@hooks/useThemedStyles/types'\nimport type { OptionItemProps } from './types'\n\nexport function createOptionsStyles({ isSelected }: OptionItemProps) {\n  return styled({\n    container: {\n      width: '100%',\n\n      display: 'flex',\n      alignItems: 'center',\n      textAlign: 'left',\n\n      borderRadius: '0.25rem',\n      padding: '0.5rem 0.75rem',\n\n      cursor: 'pointer',\n      transition: 'background-color 0.2s ease-out',\n\n      backgroundColor: isSelected\n        ? 'var(--px-background-card-hover)'\n        : 'transparent',\n\n      __rules: {\n        '&:hover': {\n          backgroundColor: 'var(--px-background-card-hover) !important'\n        },\n\n        '&:focus': {\n          outlineOffset: '-1px',\n          outline: '2px solid var(--px-color-primary)'\n        }\n      }\n    },\n\n    text: {\n      flex: 1,\n\n      fontSize: '1rem',\n      fontWeight: 500,\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      color: 'var(--px-text-primary)',\n\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      textOverflow: 'ellipsis'\n    }\n  })\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { OptionItemProps } from './types'\n\n// Styles\nimport { createOptionsStyles } from './styles'\n\nexport const OptionItem: React.FC<OptionItemProps> = props => {\n  // Hooks\n  const { styles, classes } = useThemedStyles(props, createOptionsStyles)\n\n  // Functions\n  function handleClick() {\n    props.onClick(props.option.value)\n  }\n\n  return (\n    <button\n      type=\"button\"\n      role=\"option\"\n      style={styles.container}\n      className={classes.container}\n      aria-label={props.option.label}\n      aria-selected={props.isSelected}\n      onClick={handleClick}\n    >\n      <span style={styles.text}>{props.option.label}</span>\n    </button>\n  )\n}\n","// External Libraries\nimport { useState } from 'react'\n\n// Types\nimport type { SelectProps } from '../../types'\n\nexport function useSelect({\n  value,\n  multiple,\n  canClear,\n  onChange\n}: SelectProps) {\n  // States\n  const [open, setOpen] = useState(false)\n\n  // Functions\n  function handleOptionClick(option: string) {\n    const isAlreadySelected = value.includes(option)\n\n    if (!multiple) {\n      if (isAlreadySelected) {\n        if (canClear) onChange([])\n      } else onChange([option])\n\n      setOpen(false)\n      return\n    }\n\n    if (isAlreadySelected) {\n      if (value.length === 1) {\n        if (canClear) onChange([])\n      } else onChange(value.filter(v => v !== option))\n    } else onChange([...value, option])\n  }\n\n  function togglePanel() {\n    setOpen(prev => !prev)\n  }\n\n  function closePanel() {\n    setOpen(false)\n  }\n\n  return { open, togglePanel, closePanel, handleOptionClick }\n}\n","import { styled } from '@hooks/useThemedStyles/types'\nimport type { SelectProps } from './types'\n\nexport function createSelectStyles(props: SelectProps) {\n  return styled({\n    container: {\n      width: '100%',\n\n      display: 'flex',\n      flexDirection: 'column',\n\n      position: 'relative',\n\n      rowGap: '0.375rem'\n    },\n\n    content: {\n      width: '100%',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n\n      borderWidth: 1,\n      columnGap: '0.25rem',\n      borderRadius: '0.5rem',\n      padding: '0.625rem 0.875rem',\n\n      opacity: props.disabled ? 0.5 : 1,\n      cursor: props.disabled ? 'not-allowed' : 'pointer',\n      boxShadow: 'var(--px-shadow-default)',\n      borderColor: props.errorMessage\n        ? 'var(--px-color-error)'\n        : 'var(--px-border-primary)',\n\n      __rules: {\n        '&:focus-within': {\n          outlineOffset: '-1px !important',\n          outline: `2px solid var(${props.errorMessage ? '--px-color-error' : '--px-color-primary'}) !important`\n        }\n      }\n    },\n\n    text: {\n      flex: 1,\n\n      textAlign: 'left',\n\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      textOverflow: 'ellipsis',\n\n      fontSize: '1rem',\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      fontWeight: props.value.length ? 500 : 400,\n      color: props.value.length\n        ? 'var(--px-text-primary)'\n        : 'var(--px-text-secondary)'\n    },\n\n    error: {\n      display: 'block',\n      fontWeight: 400,\n      lineHeight: '1rem',\n      fontSize: '0.75rem',\n      fontFamily: 'inherit',\n      color: 'var(--px-text-error)'\n    },\n\n    panel: {\n      width: '100%'\n    }\n  })\n}\n","import type {\n  StylesOf,\n  TextProps,\n  LayoutProps,\n  MarginProps\n} from '@hooks/useThemedStyles/types'\nimport type { createSelectStyles } from './styles'\nimport type { FloatingOptions } from '@hooks/useFloating/types'\nimport type { PopoverProps } from '@components/commons/toolkit/Popover/types'\n\nexport interface SelectProps extends LayoutProps, MarginProps {\n  label: string\n  value: string[]\n  placeholder?: string\n  options: SelectOption[]\n\n  portalId?: PopoverProps['portalId']\n  strategy?: FloatingOptions['strategy']\n  absoluteReference?: FloatingOptions['absoluteReference']\n\n  canClear?: boolean\n  multiple?: boolean\n  required?: boolean\n  disabled?: boolean\n  hideLabel?: boolean\n  errorMessage?: string\n  maxVisibleItems?: number\n\n  startIcon?: React.ReactNode\n  styles?: StylesOf<typeof createSelectStyles>\n\n  requiredColor?: string\n  labelConfig?: TextProps\n\n  onChange: (value: string[]) => void\n}\n\nexport interface SelectOption {\n  label: string\n  value: string\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\n// External Libraries\nimport type React from 'react'\nimport { useMemo } from 'react'\n\n// Components\nimport { OptionItem } from './components/OptionItem'\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { Label } from '@components/commons/toolkit/Label'\n\n// Hooks\nimport { useSelect } from './hooks/useSelect'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SelectProps } from './types'\nimport type { PopoverTriggerRenderProps } from '@components/commons/toolkit/Popover/types'\n\n// Styles\nimport { createSelectStyles } from './styles'\nimport { BasePopover } from '@components/commons/structure/BasePopover'\n\nexport * as SelectTypes from './types'\n\nexport const Select: React.FC<SelectProps> = props => {\n  // Hooks\n  const { open, togglePanel, handleOptionClick } = useSelect(props)\n  const { styles, classes } = useThemedStyles(props, createSelectStyles, {\n    pick: p => [p.disabled, p.errorMessage, p.value],\n    override: props.styles,\n    applyCommonProps: true,\n    commonSlot: 'container'\n  })\n\n  // Constants\n  const maxVisible = props.maxVisibleItems ?? Infinity\n  const optionsMap = useMemo(\n    () => new Map(props.options.map(option => [option.value, option.label])),\n    [props.options]\n  )\n\n  // Functions\n  function renderContent() {\n    if (!props.value?.length) return props.placeholder\n\n    const resolvedValues = props.value.map(val => optionsMap.get(val) ?? val)\n\n    const visibleItems = resolvedValues.slice(0, maxVisible)\n    const hiddenCount = resolvedValues.length - visibleItems.length\n\n    let result = visibleItems.join(', ')\n    if (hiddenCount > 0) result += ` +${hiddenCount}`\n\n    return result\n  }\n\n  function renderTrigger({\n    ref,\n    ariaExpanded,\n    onClick\n  }: PopoverTriggerRenderProps) {\n    return (\n      <button\n        ref={ref as any}\n        dir=\"ltr\"\n        type=\"button\"\n        role=\"combobox\"\n        style={styles.content}\n        aria-autocomplete=\"none\"\n        aria-label={props.label}\n        className={classes.content}\n        aria-expanded={ariaExpanded}\n        onClick={onClick}\n      >\n        {props.value.length ? props.startIcon : null}\n\n        <span id=\"text-content\" style={styles.text}>\n          {renderContent()}\n        </span>\n\n        <Icon size=\"sm\" name=\"chevrons-down\" />\n      </button>\n    )\n  }\n\n  return (\n    <div style={styles.container}>\n      {props.hideLabel ? null : (\n        <Label\n          label={props.label}\n          required={props.required}\n          requiredColor={props.requiredColor}\n          {...props.labelConfig}\n        />\n      )}\n\n      <BasePopover\n        open={open}\n        portalId={props.portalId}\n        absoluteReference={props.absoluteReference}\n        floatingOptions={{ viewportMargin: 0, strategy: props.strategy }}\n        trigger={renderTrigger}\n        onOpenChange={togglePanel}\n      >\n        <div style={styles.panel}>\n          {props.options.map(option => (\n            <OptionItem\n              key={option.value}\n              option={option}\n              isSelected={props.value.includes(option.value)}\n              onClick={handleOptionClick}\n            />\n          ))}\n        </div>\n      </BasePopover>\n\n      {props.errorMessage ? (\n        <span style={styles.error}>{props.errorMessage}</span>\n      ) : null}\n    </div>\n  )\n}\n"],"mappings":"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"}