@nofinite/nui 1.1.2 → 2.0.0

package/dist/dist/components/tabs/Tabs.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.cjs","sources":["../../../../src/components/tabs/Tabs.tsx"],"sourcesContent":["/**\r\n * Tabs.tsx\r\n * ---------\r\n * Fully accessible WAI-ARIA Tabs Component.\r\n *\r\n * Features:\r\n * - roving tabindex\r\n * - ArrowLeft, ArrowRight, Home, End keyboard navigation\r\n * - aria-selected, aria-controls, role=\"tablist\"\r\n * - auto-focus on selected tab\r\n * - single-component API\r\n */\r\n\r\nimport React, { useState, useRef, useEffect } from 'react';\r\nimport './Tabs.css';\r\n\r\nexport interface TabItem {\r\n  id: string;\r\n  label: string;\r\n  content: React.ReactNode;\r\n}\r\n\r\ninterface TabsProps {\r\n  tabs: TabItem[];\r\n  defaultTab?: string;\r\n  className?: string;\r\n}\r\n\r\nexport function Tabs({ tabs, defaultTab, className = '' }: TabsProps) {\r\n  const [active, setActive] = useState(defaultTab || tabs[0]?.id);\r\n\r\n  const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\r\n\r\n  // Focus active tab\r\n  useEffect(() => {\r\n    const index = tabs.findIndex((t) => t.id === active);\r\n    tabRefs.current[index]?.focus();\r\n  }, [active, tabs]);\r\n\r\n  const handleKeyDown = (e: React.KeyboardEvent, index: number) => {\r\n    if (!['ArrowRight', 'ArrowLeft', 'Home', 'End'].includes(e.key)) return;\r\n\r\n    e.preventDefault();\r\n\r\n    let newIndex = index;\r\n\r\n    if (e.key === 'ArrowRight') newIndex = (index + 1) % tabs.length;\r\n    if (e.key === 'ArrowLeft')\r\n      newIndex = (index - 1 + tabs.length) % tabs.length;\r\n    if (e.key === 'Home') newIndex = 0;\r\n    if (e.key === 'End') newIndex = tabs.length - 1;\r\n\r\n    setActive(tabs[newIndex].id);\r\n  };\r\n\r\n  return (\r\n    <div className={`ui-tabs ${className}`}>\r\n      <div role=\"tablist\" className=\"ui-tabs-list\">\r\n        {tabs.map((tab, index) => {\r\n          const isSelected = tab.id === active;\r\n\r\n          return (\r\n            <button\r\n              key={tab.id}\r\n              ref={(el) => {\r\n                tabRefs.current[index] = el;\r\n              }}\r\n              role=\"tab\"\r\n              id={`tab-${tab.id}`}\r\n              aria-selected={isSelected}\r\n              aria-controls={`panel-${tab.id}`}\r\n              tabIndex={isSelected ? 0 : -1}\r\n              className=\"ui-tab\"\r\n              onClick={() => setActive(tab.id)}\r\n              onKeyDown={(e) => handleKeyDown(e, index)}\r\n            >\r\n              {tab.label}\r\n            </button>\r\n          );\r\n        })}\r\n      </div>\r\n\r\n      {tabs.map((tab) =>\r\n        tab.id === active ? (\r\n          <div\r\n            key={tab.id}\r\n            id={`panel-${tab.id}`}\r\n            role=\"tabpanel\"\r\n            aria-labelledby={`tab-${tab.id}`}\r\n            className=\"ui-tabs-panel\"\r\n          >\r\n            {tab.content}\r\n          </div>\r\n        ) : null\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n"],"names":["Tabs","tabs","defaultTab","className","active","setActive","useState","tabRefs","useRef","useEffect","index","t","handleKeyDown","newIndex","jsxs","jsx","tab","isSelected","el","e"],"mappings":"kKA4BO,SAASA,EAAK,CAAE,KAAAC,EAAM,WAAAC,EAAY,UAAAC,EAAY,IAAiB,CACpE,KAAM,CAACC,EAAQC,CAAS,EAAIC,EAAAA,SAASJ,GAAcD,EAAK,CAAC,GAAG,EAAE,EAExDM,EAAUC,EAAAA,OAAqC,EAAE,EAGvDC,EAAAA,UAAU,IAAM,CACd,MAAMC,EAAQT,EAAK,UAAWU,GAAMA,EAAE,KAAOP,CAAM,EACnDG,EAAQ,QAAQG,CAAK,GAAG,MAAA,CAC1B,EAAG,CAACN,EAAQH,CAAI,CAAC,EAEjB,MAAMW,EAAgB,CAAC,EAAwBF,IAAkB,CAC/D,GAAI,CAAC,CAAC,aAAc,YAAa,OAAQ,KAAK,EAAE,SAAS,EAAE,GAAG,EAAG,OAEjE,EAAE,eAAA,EAEF,IAAIG,EAAWH,EAEX,EAAE,MAAQ,eAAcG,GAAYH,EAAQ,GAAKT,EAAK,QACtD,EAAE,MAAQ,cACZY,GAAYH,EAAQ,EAAIT,EAAK,QAAUA,EAAK,QAC1C,EAAE,MAAQ,SAAQY,EAAW,GAC7B,EAAE,MAAQ,QAAOA,EAAWZ,EAAK,OAAS,GAE9CI,EAAUJ,EAAKY,CAAQ,EAAE,EAAE,CAC7B,EAEA,OACEC,EAAAA,KAAC,MAAA,CAAI,UAAW,WAAWX,CAAS,GAClC,SAAA,CAAAY,EAAAA,IAAC,MAAA,CAAI,KAAK,UAAU,UAAU,eAC3B,SAAAd,EAAK,IAAI,CAACe,EAAKN,IAAU,CACxB,MAAMO,EAAaD,EAAI,KAAOZ,EAE9B,OACEW,EAAAA,IAAC,SAAA,CAEC,IAAMG,GAAO,CACXX,EAAQ,QAAQG,CAAK,EAAIQ,CAC3B,EACA,KAAK,MACL,GAAI,OAAOF,EAAI,EAAE,GACjB,gBAAeC,EACf,gBAAe,SAASD,EAAI,EAAE,GAC9B,SAAUC,EAAa,EAAI,GAC3B,UAAU,SACV,QAAS,IAAMZ,EAAUW,EAAI,EAAE,EAC/B,UAAYG,GAAMP,EAAcO,EAAGT,CAAK,EAEvC,SAAAM,EAAI,KAAA,EAbAA,EAAI,EAAA,CAgBf,CAAC,CAAA,CACH,EAECf,EAAK,IAAKe,GACTA,EAAI,KAAOZ,EACTW,EAAAA,IAAC,MAAA,CAEC,GAAI,SAASC,EAAI,EAAE,GACnB,KAAK,WACL,kBAAiB,OAAOA,EAAI,EAAE,GAC9B,UAAU,gBAET,SAAAA,EAAI,OAAA,EANAA,EAAI,EAAA,EAQT,IAAA,CACN,EACF,CAEJ"}

package/dist/dist/components/tabs/Tabs.js

@@ -0,0 +1,56 @@
+import { jsxs as u, jsx as d } from "react/jsx-runtime";
+import { useState as m, useRef as h, useEffect as p } from "react";
+/* empty css         */
+function k({ tabs: i, defaultTab: s, className: a = "" }) {
+  const [l, o] = m(s || i[0]?.id), c = h([]);
+  p(() => {
+    const e = i.findIndex((n) => n.id === l);
+    c.current[e]?.focus();
+  }, [l, i]);
+  const f = (e, n) => {
+    if (!["ArrowRight", "ArrowLeft", "Home", "End"].includes(e.key)) return;
+    e.preventDefault();
+    let r = n;
+    e.key === "ArrowRight" && (r = (n + 1) % i.length), e.key === "ArrowLeft" && (r = (n - 1 + i.length) % i.length), e.key === "Home" && (r = 0), e.key === "End" && (r = i.length - 1), o(i[r].id);
+  };
+  return /* @__PURE__ */ u("div", { className: `ui-tabs ${a}`, children: [
+    /* @__PURE__ */ d("div", { role: "tablist", className: "ui-tabs-list", children: i.map((e, n) => {
+      const r = e.id === l;
+      return /* @__PURE__ */ d(
+        "button",
+        {
+          ref: (t) => {
+            c.current[n] = t;
+          },
+          role: "tab",
+          id: `tab-${e.id}`,
+          "aria-selected": r,
+          "aria-controls": `panel-${e.id}`,
+          tabIndex: r ? 0 : -1,
+          className: "ui-tab",
+          onClick: () => o(e.id),
+          onKeyDown: (t) => f(t, n),
+          children: e.label
+        },
+        e.id
+      );
+    }) }),
+    i.map(
+      (e) => e.id === l ? /* @__PURE__ */ d(
+        "div",
+        {
+          id: `panel-${e.id}`,
+          role: "tabpanel",
+          "aria-labelledby": `tab-${e.id}`,
+          className: "ui-tabs-panel",
+          children: e.content
+        },
+        e.id
+      ) : null
+    )
+  ] });
+}
+export {
+  k as Tabs
+};
+//# sourceMappingURL=Tabs.js.map

package/dist/dist/components/tabs/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sources":["../../../../src/components/tabs/Tabs.tsx"],"sourcesContent":["/**\r\n * Tabs.tsx\r\n * ---------\r\n * Fully accessible WAI-ARIA Tabs Component.\r\n *\r\n * Features:\r\n * - roving tabindex\r\n * - ArrowLeft, ArrowRight, Home, End keyboard navigation\r\n * - aria-selected, aria-controls, role=\"tablist\"\r\n * - auto-focus on selected tab\r\n * - single-component API\r\n */\r\n\r\nimport React, { useState, useRef, useEffect } from 'react';\r\nimport './Tabs.css';\r\n\r\nexport interface TabItem {\r\n  id: string;\r\n  label: string;\r\n  content: React.ReactNode;\r\n}\r\n\r\ninterface TabsProps {\r\n  tabs: TabItem[];\r\n  defaultTab?: string;\r\n  className?: string;\r\n}\r\n\r\nexport function Tabs({ tabs, defaultTab, className = '' }: TabsProps) {\r\n  const [active, setActive] = useState(defaultTab || tabs[0]?.id);\r\n\r\n  const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\r\n\r\n  // Focus active tab\r\n  useEffect(() => {\r\n    const index = tabs.findIndex((t) => t.id === active);\r\n    tabRefs.current[index]?.focus();\r\n  }, [active, tabs]);\r\n\r\n  const handleKeyDown = (e: React.KeyboardEvent, index: number) => {\r\n    if (!['ArrowRight', 'ArrowLeft', 'Home', 'End'].includes(e.key)) return;\r\n\r\n    e.preventDefault();\r\n\r\n    let newIndex = index;\r\n\r\n    if (e.key === 'ArrowRight') newIndex = (index + 1) % tabs.length;\r\n    if (e.key === 'ArrowLeft')\r\n      newIndex = (index - 1 + tabs.length) % tabs.length;\r\n    if (e.key === 'Home') newIndex = 0;\r\n    if (e.key === 'End') newIndex = tabs.length - 1;\r\n\r\n    setActive(tabs[newIndex].id);\r\n  };\r\n\r\n  return (\r\n    <div className={`ui-tabs ${className}`}>\r\n      <div role=\"tablist\" className=\"ui-tabs-list\">\r\n        {tabs.map((tab, index) => {\r\n          const isSelected = tab.id === active;\r\n\r\n          return (\r\n            <button\r\n              key={tab.id}\r\n              ref={(el) => {\r\n                tabRefs.current[index] = el;\r\n              }}\r\n              role=\"tab\"\r\n              id={`tab-${tab.id}`}\r\n              aria-selected={isSelected}\r\n              aria-controls={`panel-${tab.id}`}\r\n              tabIndex={isSelected ? 0 : -1}\r\n              className=\"ui-tab\"\r\n              onClick={() => setActive(tab.id)}\r\n              onKeyDown={(e) => handleKeyDown(e, index)}\r\n            >\r\n              {tab.label}\r\n            </button>\r\n          );\r\n        })}\r\n      </div>\r\n\r\n      {tabs.map((tab) =>\r\n        tab.id === active ? (\r\n          <div\r\n            key={tab.id}\r\n            id={`panel-${tab.id}`}\r\n            role=\"tabpanel\"\r\n            aria-labelledby={`tab-${tab.id}`}\r\n            className=\"ui-tabs-panel\"\r\n          >\r\n            {tab.content}\r\n          </div>\r\n        ) : null\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n"],"names":["Tabs","tabs","defaultTab","className","active","setActive","useState","tabRefs","useRef","useEffect","index","t","handleKeyDown","newIndex","jsxs","jsx","tab","isSelected","el","e"],"mappings":";;;AA4BO,SAASA,EAAK,EAAE,MAAAC,GAAM,YAAAC,GAAY,WAAAC,IAAY,MAAiB;AACpE,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAASJ,KAAcD,EAAK,CAAC,GAAG,EAAE,GAExDM,IAAUC,EAAqC,EAAE;AAGvD,EAAAC,EAAU,MAAM;AACd,UAAMC,IAAQT,EAAK,UAAU,CAACU,MAAMA,EAAE,OAAOP,CAAM;AACnD,IAAAG,EAAQ,QAAQG,CAAK,GAAG,MAAA;AAAA,EAC1B,GAAG,CAACN,GAAQH,CAAI,CAAC;AAEjB,QAAMW,IAAgB,CAAC,GAAwBF,MAAkB;AAC/D,QAAI,CAAC,CAAC,cAAc,aAAa,QAAQ,KAAK,EAAE,SAAS,EAAE,GAAG,EAAG;AAEjE,MAAE,eAAA;AAEF,QAAIG,IAAWH;AAEf,IAAI,EAAE,QAAQ,iBAAcG,KAAYH,IAAQ,KAAKT,EAAK,SACtD,EAAE,QAAQ,gBACZY,KAAYH,IAAQ,IAAIT,EAAK,UAAUA,EAAK,SAC1C,EAAE,QAAQ,WAAQY,IAAW,IAC7B,EAAE,QAAQ,UAAOA,IAAWZ,EAAK,SAAS,IAE9CI,EAAUJ,EAAKY,CAAQ,EAAE,EAAE;AAAA,EAC7B;AAEA,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAW,WAAWX,CAAS,IAClC,UAAA;AAAA,IAAA,gBAAAY,EAAC,OAAA,EAAI,MAAK,WAAU,WAAU,gBAC3B,UAAAd,EAAK,IAAI,CAACe,GAAKN,MAAU;AACxB,YAAMO,IAAaD,EAAI,OAAOZ;AAE9B,aACE,gBAAAW;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,KAAK,CAACG,MAAO;AACX,YAAAX,EAAQ,QAAQG,CAAK,IAAIQ;AAAA,UAC3B;AAAA,UACA,MAAK;AAAA,UACL,IAAI,OAAOF,EAAI,EAAE;AAAA,UACjB,iBAAeC;AAAA,UACf,iBAAe,SAASD,EAAI,EAAE;AAAA,UAC9B,UAAUC,IAAa,IAAI;AAAA,UAC3B,WAAU;AAAA,UACV,SAAS,MAAMZ,EAAUW,EAAI,EAAE;AAAA,UAC/B,WAAW,CAACG,MAAMP,EAAcO,GAAGT,CAAK;AAAA,UAEvC,UAAAM,EAAI;AAAA,QAAA;AAAA,QAbAA,EAAI;AAAA,MAAA;AAAA,IAgBf,CAAC,EAAA,CACH;AAAA,IAECf,EAAK;AAAA,MAAI,CAACe,MACTA,EAAI,OAAOZ,IACT,gBAAAW;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,IAAI,SAASC,EAAI,EAAE;AAAA,UACnB,MAAK;AAAA,UACL,mBAAiB,OAAOA,EAAI,EAAE;AAAA,UAC9B,WAAU;AAAA,UAET,UAAAA,EAAI;AAAA,QAAA;AAAA,QANAA,EAAI;AAAA,MAAA,IAQT;AAAA,IAAA;AAAA,EACN,GACF;AAEJ;"}

package/dist/dist/components/textarea/Textarea.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react/jsx-runtime"),t=require("react");;/* empty css               */function x(e){e&&(e.style.height="0px",e.style.height=`${e.scrollHeight}px`)}const l=t.forwardRef(({value:e,defaultValue:o,onChange:h,className:v="",maxLength:s,showCount:g=!1,autoGrow:i=!0,disabled:m=!1,readOnly:p=!1,required:y=!1,error:d=!1,id:b,name:T,placeholder:$,helperId:j,rows:R=3,...C},N)=>{const n=t.useRef(null);t.useImperativeHandle(N,()=>n.current??document.createElement("textarea"));const f=e!==void 0,[q,E]=t.useState(()=>o||""),u=f?e:q,r=t.useCallback(()=>{i&&x(n.current)},[i]);t.useEffect(()=>{r();const a=setTimeout(r,0);return()=>clearTimeout(a)},[r]),t.useEffect(()=>{r()},[u,r]);const H=a=>{f||E(a.target.value),h?.(a),i&&x(a.target)},S=j||void 0;return c.jsxs("div",{className:`ui-textarea-wrapper ${v}`,children:[c.jsx("textarea",{ref:n,id:b,name:T,className:`ui-textarea ${d?"ui-textarea--error":""}`,value:u,defaultValue:o,onChange:H,maxLength:s,disabled:m,readOnly:p,required:y,"aria-invalid":d||void 0,"aria-describedby":S,placeholder:$,rows:R,...C}),(g||s)&&c.jsx("div",{className:"ui-textarea-counter","aria-hidden":"true",children:`${u?.length??0}${s?` / ${s}`:""}`})]})});l.displayName="Textarea";exports.Textarea=l;exports.default=l;
+//# sourceMappingURL=Textarea.cjs.map

package/dist/dist/components/textarea/Textarea.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.cjs","sources":["../../../../src/components/textarea/Textarea.tsx"],"sourcesContent":["/**\r\n * Textarea.tsx\r\n * -------------\r\n * Advanced, accessible textarea (auto-grow).\r\n *\r\n * Features:\r\n * - auto-resize (autoGrow)\r\n * - controlled / uncontrolled modes\r\n * - maxLength + optional character counter\r\n * - disabled, readOnly, required support\r\n * - aria-describedby linking for error / help text\r\n * - identical coding style to your existing library\r\n */\r\n\r\nimport React, {\r\n  useRef,\r\n  useEffect,\r\n  useCallback,\r\n  useState,\r\n  forwardRef,\r\n  useImperativeHandle,\r\n} from 'react';\r\n\r\nimport './Textarea.css';\r\n\r\nexport interface TextareaProps\r\n  extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\r\n  /** Show character counter */\r\n  showCount?: boolean;\r\n\r\n  /** Enable auto resizing of height */\r\n  autoGrow?: boolean;\r\n\r\n  /** Visual error state */\r\n  error?: boolean;\r\n\r\n  /** Used for aria-describedby */\r\n  helperId?: string;\r\n}\r\n\r\n/* Auto-grow helper */\r\nfunction syncHeight(el: HTMLTextAreaElement | null) {\r\n  if (!el) return;\r\n  el.style.height = '0px'; // reset first\r\n  el.style.height = `${el.scrollHeight}px`;\r\n}\r\n\r\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(\r\n  (\r\n    {\r\n      value,\r\n      defaultValue,\r\n      onChange,\r\n      className = '',\r\n      maxLength,\r\n      showCount = false,\r\n      autoGrow = true,\r\n      disabled = false,\r\n      readOnly = false,\r\n      required = false,\r\n      error = false,\r\n      id,\r\n      name,\r\n      placeholder,\r\n      helperId,\r\n      rows = 3,\r\n      ...rest\r\n    },\r\n    ref\r\n  ) => {\r\n    const innerRef = useRef<HTMLTextAreaElement | null>(null);\r\n\r\n    useImperativeHandle(ref, () => {\r\n      return innerRef.current ?? document.createElement('textarea');\r\n    });\r\n\r\n    const isControlled = value !== undefined;\r\n\r\n    const [internalValue, setInternalValue] = useState<string>(\r\n      () => (defaultValue as string) || ''\r\n    );\r\n\r\n    const currentValue = isControlled ? (value as string) : internalValue;\r\n\r\n    /* Auto-grow on mount & updates */\r\n    const resize = useCallback(() => {\r\n      if (!autoGrow) return;\r\n      syncHeight(innerRef.current);\r\n    }, [autoGrow]);\r\n\r\n    useEffect(() => {\r\n      resize();\r\n      const t = setTimeout(resize, 0);\r\n      return () => clearTimeout(t);\r\n    }, [resize]);\r\n\r\n    useEffect(() => {\r\n      resize();\r\n    }, [currentValue, resize]);\r\n\r\n    /* On change */\r\n    const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\r\n      if (!isControlled) setInternalValue(e.target.value);\r\n      onChange?.(e);\r\n\r\n      if (autoGrow) syncHeight(e.target);\r\n    };\r\n\r\n    const describedBy = helperId || undefined;\r\n\r\n    return (\r\n      <div className={`ui-textarea-wrapper ${className}`}>\r\n        <textarea\r\n          ref={innerRef}\r\n          id={id}\r\n          name={name}\r\n          className={`ui-textarea ${error ? 'ui-textarea--error' : ''}`}\r\n          value={currentValue}\r\n          defaultValue={defaultValue as string | undefined}\r\n          onChange={handleChange}\r\n          maxLength={maxLength}\r\n          disabled={disabled}\r\n          readOnly={readOnly}\r\n          required={required}\r\n          aria-invalid={error || undefined}\r\n          aria-describedby={describedBy}\r\n          placeholder={placeholder}\r\n          rows={rows}\r\n          {...rest}\r\n        />\r\n\r\n        {(showCount || maxLength) && (\r\n          <div className=\"ui-textarea-counter\" aria-hidden=\"true\">\r\n            {`${currentValue?.length ?? 0}${\r\n              maxLength ? ` / ${maxLength}` : ''\r\n            }`}\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n);\r\n\r\nTextarea.displayName = 'Textarea';\r\n\r\nexport default Textarea;\r\n"],"names":["syncHeight","el","Textarea","forwardRef","value","defaultValue","onChange","className","maxLength","showCount","autoGrow","disabled","readOnly","required","error","id","name","placeholder","helperId","rows","rest","ref","innerRef","useRef","useImperativeHandle","isControlled","internalValue","setInternalValue","useState","currentValue","resize","useCallback","useEffect","t","handleChange","e","describedBy","jsxs","jsx"],"mappings":"kMAyCA,SAASA,EAAWC,EAAgC,CAC7CA,IACLA,EAAG,MAAM,OAAS,MAClBA,EAAG,MAAM,OAAS,GAAGA,EAAG,YAAY,KACtC,CAEO,MAAMC,EAAWC,EAAAA,WACtB,CACE,CACE,MAAAC,EACA,aAAAC,EACA,SAAAC,EACA,UAAAC,EAAY,GACZ,UAAAC,EACA,UAAAC,EAAY,GACZ,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,MAAAC,EAAQ,GACR,GAAAC,EACA,KAAAC,EACA,YAAAC,EACA,SAAAC,EACA,KAAAC,EAAO,EACP,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAAWC,EAAAA,OAAmC,IAAI,EAExDC,EAAAA,oBAAoBH,EAAK,IAChBC,EAAS,SAAW,SAAS,cAAc,UAAU,CAC7D,EAED,MAAMG,EAAerB,IAAU,OAEzB,CAACsB,EAAeC,CAAgB,EAAIC,EAAAA,SACxC,IAAOvB,GAA2B,EAAA,EAG9BwB,EAAeJ,EAAgBrB,EAAmBsB,EAGlDI,EAASC,EAAAA,YAAY,IAAM,CAC1BrB,GACLV,EAAWsB,EAAS,OAAO,CAC7B,EAAG,CAACZ,CAAQ,CAAC,EAEbsB,EAAAA,UAAU,IAAM,CACdF,EAAA,EACA,MAAMG,EAAI,WAAWH,EAAQ,CAAC,EAC9B,MAAO,IAAM,aAAaG,CAAC,CAC7B,EAAG,CAACH,CAAM,CAAC,EAEXE,EAAAA,UAAU,IAAM,CACdF,EAAA,CACF,EAAG,CAACD,EAAcC,CAAM,CAAC,EAGzB,MAAMI,EAAgBC,GAA8C,CAC7DV,GAAcE,EAAiBQ,EAAE,OAAO,KAAK,EAClD7B,IAAW6B,CAAC,EAERzB,GAAUV,EAAWmC,EAAE,MAAM,CACnC,EAEMC,EAAclB,GAAY,OAEhC,OACEmB,EAAAA,KAAC,MAAA,CAAI,UAAW,uBAAuB9B,CAAS,GAC9C,SAAA,CAAA+B,EAAAA,IAAC,WAAA,CACC,IAAKhB,EACL,GAAAP,EACA,KAAAC,EACA,UAAW,eAAeF,EAAQ,qBAAuB,EAAE,GAC3D,MAAOe,EACP,aAAAxB,EACA,SAAU6B,EACV,UAAA1B,EACA,SAAAG,EACA,SAAAC,EACA,SAAAC,EACA,eAAcC,GAAS,OACvB,mBAAkBsB,EAClB,YAAAnB,EACA,KAAAE,EACC,GAAGC,CAAA,CAAA,GAGJX,GAAaD,IACb8B,EAAAA,IAAC,OAAI,UAAU,sBAAsB,cAAY,OAC9C,SAAA,GAAGT,GAAc,QAAU,CAAC,GAC3BrB,EAAY,MAAMA,CAAS,GAAK,EAClC,EAAA,CACF,CAAA,EAEJ,CAEJ,CACF,EAEAN,EAAS,YAAc"}

package/dist/dist/components/textarea/Textarea.js

@@ -0,0 +1,75 @@
+import { jsxs as V, jsx as o } from "react/jsx-runtime";
+import { forwardRef as k, useRef as z, useImperativeHandle as B, useState as S, useCallback as q, useEffect as d } from "react";
+/* empty css             */
+function f(e) {
+  e && (e.style.height = "0px", e.style.height = `${e.scrollHeight}px`);
+}
+const w = k(
+  ({
+    value: e,
+    defaultValue: l,
+    onChange: m,
+    className: h = "",
+    maxLength: a,
+    showCount: p = !1,
+    autoGrow: s = !0,
+    disabled: x = !1,
+    readOnly: v = !1,
+    required: g = !1,
+    error: c = !1,
+    id: y,
+    name: $,
+    placeholder: b,
+    helperId: C,
+    rows: N = 3,
+    ...T
+  }, H) => {
+    const i = z(null);
+    B(H, () => i.current ?? document.createElement("textarea"));
+    const u = e !== void 0, [R, j] = S(
+      () => l || ""
+    ), n = u ? e : R, t = q(() => {
+      s && f(i.current);
+    }, [s]);
+    d(() => {
+      t();
+      const r = setTimeout(t, 0);
+      return () => clearTimeout(r);
+    }, [t]), d(() => {
+      t();
+    }, [n, t]);
+    const E = (r) => {
+      u || j(r.target.value), m?.(r), s && f(r.target);
+    }, I = C || void 0;
+    return /* @__PURE__ */ V("div", { className: `ui-textarea-wrapper ${h}`, children: [
+      /* @__PURE__ */ o(
+        "textarea",
+        {
+          ref: i,
+          id: y,
+          name: $,
+          className: `ui-textarea ${c ? "ui-textarea--error" : ""}`,
+          value: n,
+          defaultValue: l,
+          onChange: E,
+          maxLength: a,
+          disabled: x,
+          readOnly: v,
+          required: g,
+          "aria-invalid": c || void 0,
+          "aria-describedby": I,
+          placeholder: b,
+          rows: N,
+          ...T
+        }
+      ),
+      (p || a) && /* @__PURE__ */ o("div", { className: "ui-textarea-counter", "aria-hidden": "true", children: `${n?.length ?? 0}${a ? ` / ${a}` : ""}` })
+    ] });
+  }
+);
+w.displayName = "Textarea";
+export {
+  w as Textarea,
+  w as default
+};
+//# sourceMappingURL=Textarea.js.map

package/dist/dist/components/textarea/Textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.js","sources":["../../../../src/components/textarea/Textarea.tsx"],"sourcesContent":["/**\r\n * Textarea.tsx\r\n * -------------\r\n * Advanced, accessible textarea (auto-grow).\r\n *\r\n * Features:\r\n * - auto-resize (autoGrow)\r\n * - controlled / uncontrolled modes\r\n * - maxLength + optional character counter\r\n * - disabled, readOnly, required support\r\n * - aria-describedby linking for error / help text\r\n * - identical coding style to your existing library\r\n */\r\n\r\nimport React, {\r\n  useRef,\r\n  useEffect,\r\n  useCallback,\r\n  useState,\r\n  forwardRef,\r\n  useImperativeHandle,\r\n} from 'react';\r\n\r\nimport './Textarea.css';\r\n\r\nexport interface TextareaProps\r\n  extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\r\n  /** Show character counter */\r\n  showCount?: boolean;\r\n\r\n  /** Enable auto resizing of height */\r\n  autoGrow?: boolean;\r\n\r\n  /** Visual error state */\r\n  error?: boolean;\r\n\r\n  /** Used for aria-describedby */\r\n  helperId?: string;\r\n}\r\n\r\n/* Auto-grow helper */\r\nfunction syncHeight(el: HTMLTextAreaElement | null) {\r\n  if (!el) return;\r\n  el.style.height = '0px'; // reset first\r\n  el.style.height = `${el.scrollHeight}px`;\r\n}\r\n\r\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(\r\n  (\r\n    {\r\n      value,\r\n      defaultValue,\r\n      onChange,\r\n      className = '',\r\n      maxLength,\r\n      showCount = false,\r\n      autoGrow = true,\r\n      disabled = false,\r\n      readOnly = false,\r\n      required = false,\r\n      error = false,\r\n      id,\r\n      name,\r\n      placeholder,\r\n      helperId,\r\n      rows = 3,\r\n      ...rest\r\n    },\r\n    ref\r\n  ) => {\r\n    const innerRef = useRef<HTMLTextAreaElement | null>(null);\r\n\r\n    useImperativeHandle(ref, () => {\r\n      return innerRef.current ?? document.createElement('textarea');\r\n    });\r\n\r\n    const isControlled = value !== undefined;\r\n\r\n    const [internalValue, setInternalValue] = useState<string>(\r\n      () => (defaultValue as string) || ''\r\n    );\r\n\r\n    const currentValue = isControlled ? (value as string) : internalValue;\r\n\r\n    /* Auto-grow on mount & updates */\r\n    const resize = useCallback(() => {\r\n      if (!autoGrow) return;\r\n      syncHeight(innerRef.current);\r\n    }, [autoGrow]);\r\n\r\n    useEffect(() => {\r\n      resize();\r\n      const t = setTimeout(resize, 0);\r\n      return () => clearTimeout(t);\r\n    }, [resize]);\r\n\r\n    useEffect(() => {\r\n      resize();\r\n    }, [currentValue, resize]);\r\n\r\n    /* On change */\r\n    const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\r\n      if (!isControlled) setInternalValue(e.target.value);\r\n      onChange?.(e);\r\n\r\n      if (autoGrow) syncHeight(e.target);\r\n    };\r\n\r\n    const describedBy = helperId || undefined;\r\n\r\n    return (\r\n      <div className={`ui-textarea-wrapper ${className}`}>\r\n        <textarea\r\n          ref={innerRef}\r\n          id={id}\r\n          name={name}\r\n          className={`ui-textarea ${error ? 'ui-textarea--error' : ''}`}\r\n          value={currentValue}\r\n          defaultValue={defaultValue as string | undefined}\r\n          onChange={handleChange}\r\n          maxLength={maxLength}\r\n          disabled={disabled}\r\n          readOnly={readOnly}\r\n          required={required}\r\n          aria-invalid={error || undefined}\r\n          aria-describedby={describedBy}\r\n          placeholder={placeholder}\r\n          rows={rows}\r\n          {...rest}\r\n        />\r\n\r\n        {(showCount || maxLength) && (\r\n          <div className=\"ui-textarea-counter\" aria-hidden=\"true\">\r\n            {`${currentValue?.length ?? 0}${\r\n              maxLength ? ` / ${maxLength}` : ''\r\n            }`}\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n);\r\n\r\nTextarea.displayName = 'Textarea';\r\n\r\nexport default Textarea;\r\n"],"names":["syncHeight","el","Textarea","forwardRef","value","defaultValue","onChange","className","maxLength","showCount","autoGrow","disabled","readOnly","required","error","id","name","placeholder","helperId","rows","rest","ref","innerRef","useRef","useImperativeHandle","isControlled","internalValue","setInternalValue","useState","currentValue","resize","useCallback","useEffect","t","handleChange","e","describedBy","jsxs","jsx"],"mappings":";;;AAyCA,SAASA,EAAWC,GAAgC;AAClD,EAAKA,MACLA,EAAG,MAAM,SAAS,OAClBA,EAAG,MAAM,SAAS,GAAGA,EAAG,YAAY;AACtC;AAEO,MAAMC,IAAWC;AAAA,EACtB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,WAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,IACX,OAAAC,IAAQ;AAAA,IACR,IAAAC;AAAA,IACA,MAAAC;AAAA,IACA,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAAWC,EAAmC,IAAI;AAExD,IAAAC,EAAoBH,GAAK,MAChBC,EAAS,WAAW,SAAS,cAAc,UAAU,CAC7D;AAED,UAAMG,IAAerB,MAAU,QAEzB,CAACsB,GAAeC,CAAgB,IAAIC;AAAA,MACxC,MAAOvB,KAA2B;AAAA,IAAA,GAG9BwB,IAAeJ,IAAgBrB,IAAmBsB,GAGlDI,IAASC,EAAY,MAAM;AAC/B,MAAKrB,KACLV,EAAWsB,EAAS,OAAO;AAAA,IAC7B,GAAG,CAACZ,CAAQ,CAAC;AAEb,IAAAsB,EAAU,MAAM;AACd,MAAAF,EAAA;AACA,YAAMG,IAAI,WAAWH,GAAQ,CAAC;AAC9B,aAAO,MAAM,aAAaG,CAAC;AAAA,IAC7B,GAAG,CAACH,CAAM,CAAC,GAEXE,EAAU,MAAM;AACd,MAAAF,EAAA;AAAA,IACF,GAAG,CAACD,GAAcC,CAAM,CAAC;AAGzB,UAAMI,IAAe,CAACC,MAA8C;AAClE,MAAKV,KAAcE,EAAiBQ,EAAE,OAAO,KAAK,GAClD7B,IAAW6B,CAAC,GAERzB,KAAUV,EAAWmC,EAAE,MAAM;AAAA,IACnC,GAEMC,IAAclB,KAAY;AAEhC,WACE,gBAAAmB,EAAC,OAAA,EAAI,WAAW,uBAAuB9B,CAAS,IAC9C,UAAA;AAAA,MAAA,gBAAA+B;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAKhB;AAAA,UACL,IAAAP;AAAA,UACA,MAAAC;AAAA,UACA,WAAW,eAAeF,IAAQ,uBAAuB,EAAE;AAAA,UAC3D,OAAOe;AAAA,UACP,cAAAxB;AAAA,UACA,UAAU6B;AAAA,UACV,WAAA1B;AAAA,UACA,UAAAG;AAAA,UACA,UAAAC;AAAA,UACA,UAAAC;AAAA,UACA,gBAAcC,KAAS;AAAA,UACvB,oBAAkBsB;AAAA,UAClB,aAAAnB;AAAA,UACA,MAAAE;AAAA,UACC,GAAGC;AAAA,QAAA;AAAA,MAAA;AAAA,OAGJX,KAAaD,MACb,gBAAA8B,EAAC,SAAI,WAAU,uBAAsB,eAAY,QAC9C,UAAA,GAAGT,GAAc,UAAU,CAAC,GAC3BrB,IAAY,MAAMA,CAAS,KAAK,EAClC,GAAA,CACF;AAAA,IAAA,GAEJ;AAAA,EAEJ;AACF;AAEAN,EAAS,cAAc;"}

package/dist/dist/components/toast/Toast.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),i=require("react"),T=require("../../utils/portal/portal.cjs");;/* empty css            */function l({id:s,message:a,onClose:o}){return t.jsxs("div",{className:"ui-toast",role:"alert",children:[t.jsx("span",{children:a}),t.jsx("button",{type:"button","aria-label":"Close notification",onClick:()=>o(s),children:"×"})]})}const u=i.createContext(null);function v({children:s}){const[a,o]=i.useState([]),d=i.useCallback((e,n=3e3)=>{const r=Math.random().toString(36).slice(2);o(c=>[...c,{id:r,message:e}]),setTimeout(()=>{o(c=>c.filter(x=>x.id!==r))},n)},[]),m=e=>{o(n=>n.filter(r=>r.id!==e))};return t.jsxs(u.Provider,{value:{show:d},children:[s,t.jsx(T.Portal,{children:t.jsx("div",{className:"ui-toast-container","aria-live":"polite","aria-atomic":"true",children:a.map(e=>t.jsx(l,{id:e.id,message:e.message,onClose:m},e.id))})})]})}function h(){const s=i.useContext(u);if(!s)throw new Error("useToast must be used inside <ToastProvider>");return s}exports.Toast=l;exports.ToastProvider=v;exports.useToast=h;
+//# sourceMappingURL=Toast.cjs.map

package/dist/dist/components/toast/Toast.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.cjs","sources":["../../../../src/components/toast/Toast.tsx"],"sourcesContent":["/**\r\n * Toast.tsx\r\n * ----------\r\n * Basic toast component UI. The provider handles logic.\r\n * ------------------\r\n * - Global provider that renders all toasts\r\n * - Contains aria-live region for screen readers\r\n * - Handles auto-dismiss\r\n * - Provides useToast() hook\r\n */\r\n\r\nimport React, { createContext, useContext, useState, useCallback } from 'react';\r\nimport { Portal } from '../../utils/portal/portal';\r\nimport './Toast.css';\r\n\r\ninterface ToastItem {\r\n  id: string;\r\n  message: string;\r\n}\r\n\r\ninterface ToastContextValue {\r\n  show: (message: string, timeout?: number) => void;\r\n}\r\n\r\ninterface ToastProps {\r\n  id: string;\r\n  message: string;\r\n  onClose: (id: string) => void;\r\n}\r\n\r\nexport function Toast({ id, message, onClose }: ToastProps) {\r\n  return (\r\n    <div className=\"ui-toast\" role=\"alert\">\r\n      <span>{message}</span>\r\n      <button\r\n        type=\"button\"\r\n        aria-label=\"Close notification\"\r\n        onClick={() => onClose(id)}\r\n      >\r\n        ×\r\n      </button>\r\n    </div>\r\n  );\r\n}\r\n\r\nconst ToastContext = createContext<ToastContextValue | null>(null);\r\n\r\nexport function ToastProvider({ children }: { children: React.ReactNode }) {\r\n  const [toasts, setToasts] = useState<ToastItem[]>([]);\r\n\r\n  const show = useCallback((message: string, timeout = 3000) => {\r\n    const id = Math.random().toString(36).slice(2);\r\n\r\n    setToasts((prev) => [...prev, { id, message }]);\r\n\r\n    setTimeout(() => {\r\n      setToasts((prev) => prev.filter((t) => t.id !== id));\r\n    }, timeout);\r\n  }, []);\r\n\r\n  const remove = (id: string) => {\r\n    setToasts((prev) => prev.filter((t) => t.id !== id));\r\n  };\r\n\r\n  return (\r\n    <ToastContext.Provider value={{ show }}>\r\n      {/* Main app */}\r\n      {children}\r\n\r\n      {/* Portal for notification list */}\r\n      <Portal>\r\n        <div\r\n          className=\"ui-toast-container\"\r\n          aria-live=\"polite\"\r\n          aria-atomic=\"true\"\r\n        >\r\n          {toasts.map((t) => (\r\n            <Toast key={t.id} id={t.id} message={t.message} onClose={remove} />\r\n          ))}\r\n        </div>\r\n      </Portal>\r\n    </ToastContext.Provider>\r\n  );\r\n}\r\n\r\nexport function useToast() {\r\n  const ctx = useContext(ToastContext);\r\n  if (!ctx) throw new Error('useToast must be used inside <ToastProvider>');\r\n  return ctx;\r\n}\r\n"],"names":["Toast","id","message","onClose","jsxs","jsx","ToastContext","createContext","ToastProvider","children","toasts","setToasts","useState","show","useCallback","timeout","prev","t","remove","Portal","useToast","ctx","useContext"],"mappings":"8MA8BO,SAASA,EAAM,CAAE,GAAAC,EAAI,QAAAC,EAAS,QAAAC,GAAuB,CAC1D,OACEC,EAAAA,KAAC,MAAA,CAAI,UAAU,WAAW,KAAK,QAC7B,SAAA,CAAAC,EAAAA,IAAC,QAAM,SAAAH,CAAA,CAAQ,EACfG,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,aAAW,qBACX,QAAS,IAAMF,EAAQF,CAAE,EAC1B,SAAA,GAAA,CAAA,CAED,EACF,CAEJ,CAEA,MAAMK,EAAeC,EAAAA,cAAwC,IAAI,EAE1D,SAASC,EAAc,CAAE,SAAAC,GAA2C,CACzE,KAAM,CAACC,EAAQC,CAAS,EAAIC,EAAAA,SAAsB,CAAA,CAAE,EAE9CC,EAAOC,EAAAA,YAAY,CAACZ,EAAiBa,EAAU,MAAS,CAC5D,MAAMd,EAAK,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,MAAM,CAAC,EAE7CU,EAAWK,GAAS,CAAC,GAAGA,EAAM,CAAE,GAAAf,EAAI,QAAAC,CAAA,CAAS,CAAC,EAE9C,WAAW,IAAM,CACfS,EAAWK,GAASA,EAAK,OAAQC,GAAMA,EAAE,KAAOhB,CAAE,CAAC,CACrD,EAAGc,CAAO,CACZ,EAAG,CAAA,CAAE,EAECG,EAAUjB,GAAe,CAC7BU,EAAWK,GAASA,EAAK,OAAQC,GAAMA,EAAE,KAAOhB,CAAE,CAAC,CACrD,EAEA,cACGK,EAAa,SAAb,CAAsB,MAAO,CAAE,KAAAO,GAE7B,SAAA,CAAAJ,QAGAU,EAAAA,OAAA,CACC,SAAAd,EAAAA,IAAC,MAAA,CACC,UAAU,qBACV,YAAU,SACV,cAAY,OAEX,WAAO,IAAKY,GACXZ,MAACL,GAAiB,GAAIiB,EAAE,GAAI,QAASA,EAAE,QAAS,QAASC,CAAA,EAA7CD,EAAE,EAAmD,CAClE,CAAA,CAAA,CACH,CACF,CAAA,EACF,CAEJ,CAEO,SAASG,GAAW,CACzB,MAAMC,EAAMC,EAAAA,WAAWhB,CAAY,EACnC,GAAI,CAACe,EAAK,MAAM,IAAI,MAAM,8CAA8C,EACxE,OAAOA,CACT"}

package/dist/dist/components/toast/Toast.js

@@ -0,0 +1,52 @@
+import { jsxs as l, jsx as i } from "react/jsx-runtime";
+import { useState as f, useCallback as h, createContext as p, useContext as v } from "react";
+import { Portal as T } from "../../utils/portal/portal.js";
+/* empty css          */
+function x({ id: e, message: s, onClose: o }) {
+  return /* @__PURE__ */ l("div", { className: "ui-toast", role: "alert", children: [
+    /* @__PURE__ */ i("span", { children: s }),
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        "aria-label": "Close notification",
+        onClick: () => o(e),
+        children: "×"
+      }
+    )
+  ] });
+}
+const c = p(null);
+function w({ children: e }) {
+  const [s, o] = f([]), u = h((t, n = 3e3) => {
+    const r = Math.random().toString(36).slice(2);
+    o((a) => [...a, { id: r, message: t }]), setTimeout(() => {
+      o((a) => a.filter((m) => m.id !== r));
+    }, n);
+  }, []), d = (t) => {
+    o((n) => n.filter((r) => r.id !== t));
+  };
+  return /* @__PURE__ */ l(c.Provider, { value: { show: u }, children: [
+    e,
+    /* @__PURE__ */ i(T, { children: /* @__PURE__ */ i(
+      "div",
+      {
+        className: "ui-toast-container",
+        "aria-live": "polite",
+        "aria-atomic": "true",
+        children: s.map((t) => /* @__PURE__ */ i(x, { id: t.id, message: t.message, onClose: d }, t.id))
+      }
+    ) })
+  ] });
+}
+function j() {
+  const e = v(c);
+  if (!e) throw new Error("useToast must be used inside <ToastProvider>");
+  return e;
+}
+export {
+  x as Toast,
+  w as ToastProvider,
+  j as useToast
+};
+//# sourceMappingURL=Toast.js.map

package/dist/dist/components/toast/Toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.js","sources":["../../../../src/components/toast/Toast.tsx"],"sourcesContent":["/**\r\n * Toast.tsx\r\n * ----------\r\n * Basic toast component UI. The provider handles logic.\r\n * ------------------\r\n * - Global provider that renders all toasts\r\n * - Contains aria-live region for screen readers\r\n * - Handles auto-dismiss\r\n * - Provides useToast() hook\r\n */\r\n\r\nimport React, { createContext, useContext, useState, useCallback } from 'react';\r\nimport { Portal } from '../../utils/portal/portal';\r\nimport './Toast.css';\r\n\r\ninterface ToastItem {\r\n  id: string;\r\n  message: string;\r\n}\r\n\r\ninterface ToastContextValue {\r\n  show: (message: string, timeout?: number) => void;\r\n}\r\n\r\ninterface ToastProps {\r\n  id: string;\r\n  message: string;\r\n  onClose: (id: string) => void;\r\n}\r\n\r\nexport function Toast({ id, message, onClose }: ToastProps) {\r\n  return (\r\n    <div className=\"ui-toast\" role=\"alert\">\r\n      <span>{message}</span>\r\n      <button\r\n        type=\"button\"\r\n        aria-label=\"Close notification\"\r\n        onClick={() => onClose(id)}\r\n      >\r\n        ×\r\n      </button>\r\n    </div>\r\n  );\r\n}\r\n\r\nconst ToastContext = createContext<ToastContextValue | null>(null);\r\n\r\nexport function ToastProvider({ children }: { children: React.ReactNode }) {\r\n  const [toasts, setToasts] = useState<ToastItem[]>([]);\r\n\r\n  const show = useCallback((message: string, timeout = 3000) => {\r\n    const id = Math.random().toString(36).slice(2);\r\n\r\n    setToasts((prev) => [...prev, { id, message }]);\r\n\r\n    setTimeout(() => {\r\n      setToasts((prev) => prev.filter((t) => t.id !== id));\r\n    }, timeout);\r\n  }, []);\r\n\r\n  const remove = (id: string) => {\r\n    setToasts((prev) => prev.filter((t) => t.id !== id));\r\n  };\r\n\r\n  return (\r\n    <ToastContext.Provider value={{ show }}>\r\n      {/* Main app */}\r\n      {children}\r\n\r\n      {/* Portal for notification list */}\r\n      <Portal>\r\n        <div\r\n          className=\"ui-toast-container\"\r\n          aria-live=\"polite\"\r\n          aria-atomic=\"true\"\r\n        >\r\n          {toasts.map((t) => (\r\n            <Toast key={t.id} id={t.id} message={t.message} onClose={remove} />\r\n          ))}\r\n        </div>\r\n      </Portal>\r\n    </ToastContext.Provider>\r\n  );\r\n}\r\n\r\nexport function useToast() {\r\n  const ctx = useContext(ToastContext);\r\n  if (!ctx) throw new Error('useToast must be used inside <ToastProvider>');\r\n  return ctx;\r\n}\r\n"],"names":["Toast","id","message","onClose","jsxs","jsx","ToastContext","createContext","ToastProvider","children","toasts","setToasts","useState","show","useCallback","timeout","prev","t","remove","Portal","useToast","ctx","useContext"],"mappings":";;;;AA8BO,SAASA,EAAM,EAAE,IAAAC,GAAI,SAAAC,GAAS,SAAAC,KAAuB;AAC1D,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAU,YAAW,MAAK,SAC7B,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAM,UAAAH,EAAA,CAAQ;AAAA,IACf,gBAAAG;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,cAAW;AAAA,QACX,SAAS,MAAMF,EAAQF,CAAE;AAAA,QAC1B,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED,GACF;AAEJ;AAEA,MAAMK,IAAeC,EAAwC,IAAI;AAE1D,SAASC,EAAc,EAAE,UAAAC,KAA2C;AACzE,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAsB,CAAA,CAAE,GAE9CC,IAAOC,EAAY,CAACZ,GAAiBa,IAAU,QAAS;AAC5D,UAAMd,IAAK,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,MAAM,CAAC;AAE7C,IAAAU,EAAU,CAACK,MAAS,CAAC,GAAGA,GAAM,EAAE,IAAAf,GAAI,SAAAC,EAAA,CAAS,CAAC,GAE9C,WAAW,MAAM;AACf,MAAAS,EAAU,CAACK,MAASA,EAAK,OAAO,CAACC,MAAMA,EAAE,OAAOhB,CAAE,CAAC;AAAA,IACrD,GAAGc,CAAO;AAAA,EACZ,GAAG,CAAA,CAAE,GAECG,IAAS,CAACjB,MAAe;AAC7B,IAAAU,EAAU,CAACK,MAASA,EAAK,OAAO,CAACC,MAAMA,EAAE,OAAOhB,CAAE,CAAC;AAAA,EACrD;AAEA,2BACGK,EAAa,UAAb,EAAsB,OAAO,EAAE,MAAAO,KAE7B,UAAA;AAAA,IAAAJ;AAAA,sBAGAU,GAAA,EACC,UAAA,gBAAAd;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,aAAU;AAAA,QACV,eAAY;AAAA,QAEX,YAAO,IAAI,CAAC,MACX,gBAAAA,EAACL,KAAiB,IAAI,EAAE,IAAI,SAAS,EAAE,SAAS,SAASkB,EAAA,GAA7C,EAAE,EAAmD,CAClE;AAAA,MAAA;AAAA,IAAA,EACH,CACF;AAAA,EAAA,GACF;AAEJ;AAEO,SAASE,IAAW;AACzB,QAAMC,IAAMC,EAAWhB,CAAY;AACnC,MAAI,CAACe,EAAK,OAAM,IAAI,MAAM,8CAA8C;AACxE,SAAOA;AACT;"}

package/dist/dist/components/tooltip/Tooltip.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),e=require("react");;/* empty css              */const P=require("../../utils/portal/portal.cjs");function S({label:g,children:R,className:E="",delay:y=200,offset:i=8}){const[o,p]=e.useState(!1),[m,h]=e.useState({top:0,left:0}),[L,x]=e.useState("top"),c=e.useRef(null),l=e.useRef(null),r=e.useRef(null),w=`tooltip-${e.useId()}`,v=()=>{r.current=window.setTimeout(()=>{p(!0)},y)},u=()=>{r.current&&clearTimeout(r.current),p(!1)},n=e.useCallback(()=>{if(!c.current||!l.current)return;const t=c.current.getBoundingClientRect(),a=l.current.getBoundingClientRect(),j=window.scrollX,d=window.scrollY,T=t.left+j+t.width/2;let f=t.top+d-a.height-i,b="top";f<d+8&&(f=t.bottom+d+i,b="bottom"),x(b),h({top:f,left:T})},[i]);return e.useLayoutEffect(()=>{if(o)return n(),window.addEventListener("scroll",n,!0),window.addEventListener("resize",n),()=>{window.removeEventListener("scroll",n,!0),window.removeEventListener("resize",n)}},[o,n]),e.useEffect(()=>{if(!o)return;const t=a=>{a.key==="Escape"&&u()};return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[o]),e.useEffect(()=>()=>{r.current&&clearTimeout(r.current)},[]),s.jsxs(s.Fragment,{children:[s.jsx("span",{ref:c,className:"ui-tooltip-container","aria-describedby":o?w:void 0,onMouseEnter:v,onMouseLeave:u,onFocus:v,onBlur:u,tabIndex:0,children:R}),o&&s.jsx(P.Portal,{children:s.jsx("div",{ref:l,id:w,role:"tooltip","data-placement":L,className:`ui-tooltip-bubble ${E}`,style:{position:"absolute",top:m.top,left:m.left},children:g})})]})}exports.Tooltip=S;
+//# sourceMappingURL=Tooltip.cjs.map

package/dist/dist/components/tooltip/Tooltip.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.cjs","sources":["../../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\r\n  useState,\r\n  useRef,\r\n  useLayoutEffect,\r\n  useEffect,\r\n  useCallback,\r\n  useId,\r\n} from 'react';\r\nimport './Tooltip.css';\r\nimport { Portal } from '../../utils/portal/portal';\r\n\r\ntype Placement = 'top' | 'bottom';\r\n\r\nexport interface TooltipProps {\r\n  label: string;\r\n  children: React.ReactNode;\r\n  className?: string;\r\n  delay?: number;\r\n  offset?: number;\r\n}\r\n\r\nexport function Tooltip({\r\n  label,\r\n  children,\r\n  className = '',\r\n  delay = 200,\r\n  offset = 8,\r\n}: TooltipProps) {\r\n  const [open, setOpen] = useState(false);\r\n  const [coords, setCoords] = useState({ top: 0, left: 0 });\r\n  const [placement, setPlacement] = useState<Placement>('top');\r\n\r\n  const triggerRef = useRef<HTMLSpanElement | null>(null);\r\n  const tooltipRef = useRef<HTMLDivElement | null>(null);\r\nconst timeoutRef = useRef<number | null>(null);\r\n\r\n  const id = `tooltip-${useId()}`;\r\n\r\n  /* ---------------- Visibility ---------------- */\r\n\r\n  const show = () => {\r\n    timeoutRef.current = window.setTimeout(() => {\r\n      setOpen(true);\r\n    }, delay);\r\n  };\r\n\r\n  const hide = () => {\r\n    if (timeoutRef.current) clearTimeout(timeoutRef.current);\r\n    setOpen(false);\r\n  };\r\n\r\n  /* ---------------- Positioning ---------------- */\r\n\r\n  const updatePosition = useCallback(() => {\r\n    if (!triggerRef.current || !tooltipRef.current) return;\r\n\r\n    const triggerRect = triggerRef.current.getBoundingClientRect();\r\n    const tooltipRect = tooltipRef.current.getBoundingClientRect();\r\n\r\n    const scrollX = window.scrollX;\r\n    const scrollY = window.scrollY;\r\n\r\n    const centerX =\r\n      triggerRect.left + scrollX + triggerRect.width / 2;\r\n\r\n    // Try top first\r\n    let top =\r\n      triggerRect.top +\r\n      scrollY -\r\n      tooltipRect.height -\r\n      offset;\r\n\r\n    let nextPlacement: Placement = 'top';\r\n\r\n    // Flip to bottom if clipped\r\n    if (top < scrollY + 8) {\r\n      top =\r\n        triggerRect.bottom +\r\n        scrollY +\r\n        offset;\r\n      nextPlacement = 'bottom';\r\n    }\r\n\r\n    setPlacement(nextPlacement);\r\n    setCoords({ top, left: centerX });\r\n  }, [offset]);\r\n\r\n  /* ---------------- Effects ---------------- */\r\n\r\n  useLayoutEffect(() => {\r\n    if (!open) return;\r\n\r\n    updatePosition();\r\n\r\n    window.addEventListener('scroll', updatePosition, true);\r\n    window.addEventListener('resize', updatePosition);\r\n\r\n    return () => {\r\n      window.removeEventListener('scroll', updatePosition, true);\r\n      window.removeEventListener('resize', updatePosition);\r\n    };\r\n  }, [open, updatePosition]);\r\n\r\n  useEffect(() => {\r\n    if (!open) return;\r\n\r\n    const onKeyDown = (e: KeyboardEvent) => {\r\n      if (e.key === 'Escape') hide();\r\n    };\r\n\r\n    document.addEventListener('keydown', onKeyDown);\r\n    return () => document.removeEventListener('keydown', onKeyDown);\r\n  }, [open]);\r\n\r\n  useEffect(() => {\r\n    return () => {\r\n      if (timeoutRef.current) clearTimeout(timeoutRef.current);\r\n    };\r\n  }, []);\r\n\r\n  /* ---------------- Render ---------------- */\r\n\r\n  return (\r\n    <>\r\n      <span\r\n        ref={triggerRef}\r\n        className=\"ui-tooltip-container\"\r\n        aria-describedby={open ? id : undefined}\r\n        onMouseEnter={show}\r\n        onMouseLeave={hide}\r\n        onFocus={show}\r\n        onBlur={hide}\r\n        tabIndex={0}\r\n      >\r\n        {children}\r\n      </span>\r\n\r\n      {open && (\r\n        <Portal>\r\n          <div\r\n            ref={tooltipRef}\r\n            id={id}\r\n            role=\"tooltip\"\r\n            data-placement={placement}\r\n            className={`ui-tooltip-bubble ${className}`}\r\n            style={{\r\n              position: 'absolute',\r\n              top: coords.top,\r\n              left: coords.left,\r\n            }}\r\n          >\r\n            {label}\r\n          </div>\r\n        </Portal>\r\n      )}\r\n    </>\r\n  );\r\n}\r\n"],"names":["Tooltip","label","children","className","delay","offset","open","setOpen","useState","coords","setCoords","placement","setPlacement","triggerRef","useRef","tooltipRef","timeoutRef","id","useId","show","hide","updatePosition","useCallback","triggerRect","tooltipRect","scrollX","scrollY","centerX","top","nextPlacement","useLayoutEffect","useEffect","onKeyDown","e","jsxs","Fragment","jsx","Portal"],"mappings":"sNAqBO,SAASA,EAAQ,CACtB,MAAAC,EACA,SAAAC,EACA,UAAAC,EAAY,GACZ,MAAAC,EAAQ,IACR,OAAAC,EAAS,CACX,EAAiB,CACf,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAAAA,SAAS,EAAK,EAChC,CAACC,EAAQC,CAAS,EAAIF,EAAAA,SAAS,CAAE,IAAK,EAAG,KAAM,EAAG,EAClD,CAACG,EAAWC,CAAY,EAAIJ,EAAAA,SAAoB,KAAK,EAErDK,EAAaC,EAAAA,OAA+B,IAAI,EAChDC,EAAaD,EAAAA,OAA8B,IAAI,EACjDE,EAAaF,EAAAA,OAAsB,IAAI,EAErCG,EAAK,WAAWC,EAAAA,MAAA,CAAO,GAIvBC,EAAO,IAAM,CACjBH,EAAW,QAAU,OAAO,WAAW,IAAM,CAC3CT,EAAQ,EAAI,CACd,EAAGH,CAAK,CACV,EAEMgB,EAAO,IAAM,CACbJ,EAAW,SAAS,aAAaA,EAAW,OAAO,EACvDT,EAAQ,EAAK,CACf,EAIMc,EAAiBC,EAAAA,YAAY,IAAM,CACvC,GAAI,CAACT,EAAW,SAAW,CAACE,EAAW,QAAS,OAEhD,MAAMQ,EAAcV,EAAW,QAAQ,sBAAA,EACjCW,EAAcT,EAAW,QAAQ,sBAAA,EAEjCU,EAAU,OAAO,QACjBC,EAAU,OAAO,QAEjBC,EACJJ,EAAY,KAAOE,EAAUF,EAAY,MAAQ,EAGnD,IAAIK,EACFL,EAAY,IACZG,EACAF,EAAY,OACZnB,EAEEwB,EAA2B,MAG3BD,EAAMF,EAAU,IAClBE,EACEL,EAAY,OACZG,EACArB,EACFwB,EAAgB,UAGlBjB,EAAaiB,CAAa,EAC1BnB,EAAU,CAAE,IAAAkB,EAAK,KAAMD,CAAA,CAAS,CAClC,EAAG,CAACtB,CAAM,CAAC,EAIXyB,OAAAA,EAAAA,gBAAgB,IAAM,CACpB,GAAKxB,EAEL,OAAAe,EAAA,EAEA,OAAO,iBAAiB,SAAUA,EAAgB,EAAI,EACtD,OAAO,iBAAiB,SAAUA,CAAc,EAEzC,IAAM,CACX,OAAO,oBAAoB,SAAUA,EAAgB,EAAI,EACzD,OAAO,oBAAoB,SAAUA,CAAc,CACrD,CACF,EAAG,CAACf,EAAMe,CAAc,CAAC,EAEzBU,EAAAA,UAAU,IAAM,CACd,GAAI,CAACzB,EAAM,OAEX,MAAM0B,EAAaC,GAAqB,CAClCA,EAAE,MAAQ,UAAUb,EAAA,CAC1B,EAEA,gBAAS,iBAAiB,UAAWY,CAAS,EACvC,IAAM,SAAS,oBAAoB,UAAWA,CAAS,CAChE,EAAG,CAAC1B,CAAI,CAAC,EAETyB,EAAAA,UAAU,IACD,IAAM,CACPf,EAAW,SAAS,aAAaA,EAAW,OAAO,CACzD,EACC,CAAA,CAAE,EAKHkB,EAAAA,KAAAC,WAAA,CACE,SAAA,CAAAC,EAAAA,IAAC,OAAA,CACC,IAAKvB,EACL,UAAU,uBACV,mBAAkBP,EAAOW,EAAK,OAC9B,aAAcE,EACd,aAAcC,EACd,QAASD,EACT,OAAQC,EACR,SAAU,EAET,SAAAlB,CAAA,CAAA,EAGFI,SACE+B,SAAA,CACC,SAAAD,EAAAA,IAAC,MAAA,CACC,IAAKrB,EACL,GAAAE,EACA,KAAK,UACL,iBAAgBN,EAChB,UAAW,qBAAqBR,CAAS,GACzC,MAAO,CACL,SAAU,WACV,IAAKM,EAAO,IACZ,KAAMA,EAAO,IAAA,EAGd,SAAAR,CAAA,CAAA,CACH,CACF,CAAA,EAEJ,CAEJ"}

package/dist/dist/components/tooltip/Tooltip.js

@@ -0,0 +1,73 @@
+import { jsxs as B, Fragment as X, jsx as a } from "react/jsx-runtime";
+import { useState as p, useRef as m, useId as j, useCallback as z, useLayoutEffect as F, useEffect as E } from "react";
+/* empty css            */
+import { Portal as I } from "../../utils/portal/portal.js";
+function D({
+  label: h,
+  children: L,
+  className: R = "",
+  delay: y = 200,
+  offset: r = 8
+}) {
+  const [t, f] = p(!1), [w, x] = p({ top: 0, left: 0 }), [k, C] = p("top"), i = m(null), s = m(null), n = m(null), v = `tooltip-${j()}`, b = () => {
+    n.current = window.setTimeout(() => {
+      f(!0);
+    }, y);
+  }, c = () => {
+    n.current && clearTimeout(n.current), f(!1);
+  }, o = z(() => {
+    if (!i.current || !s.current) return;
+    const e = i.current.getBoundingClientRect(), l = s.current.getBoundingClientRect(), P = window.scrollX, u = window.scrollY, T = e.left + P + e.width / 2;
+    let d = e.top + u - l.height - r, g = "top";
+    d < u + 8 && (d = e.bottom + u + r, g = "bottom"), C(g), x({ top: d, left: T });
+  }, [r]);
+  return F(() => {
+    if (t)
+      return o(), window.addEventListener("scroll", o, !0), window.addEventListener("resize", o), () => {
+        window.removeEventListener("scroll", o, !0), window.removeEventListener("resize", o);
+      };
+  }, [t, o]), E(() => {
+    if (!t) return;
+    const e = (l) => {
+      l.key === "Escape" && c();
+    };
+    return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+  }, [t]), E(() => () => {
+    n.current && clearTimeout(n.current);
+  }, []), /* @__PURE__ */ B(X, { children: [
+    /* @__PURE__ */ a(
+      "span",
+      {
+        ref: i,
+        className: "ui-tooltip-container",
+        "aria-describedby": t ? v : void 0,
+        onMouseEnter: b,
+        onMouseLeave: c,
+        onFocus: b,
+        onBlur: c,
+        tabIndex: 0,
+        children: L
+      }
+    ),
+    t && /* @__PURE__ */ a(I, { children: /* @__PURE__ */ a(
+      "div",
+      {
+        ref: s,
+        id: v,
+        role: "tooltip",
+        "data-placement": k,
+        className: `ui-tooltip-bubble ${R}`,
+        style: {
+          position: "absolute",
+          top: w.top,
+          left: w.left
+        },
+        children: h
+      }
+    ) })
+  ] });
+}
+export {
+  D as Tooltip
+};
+//# sourceMappingURL=Tooltip.js.map

package/dist/dist/components/tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","sources":["../../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\r\n  useState,\r\n  useRef,\r\n  useLayoutEffect,\r\n  useEffect,\r\n  useCallback,\r\n  useId,\r\n} from 'react';\r\nimport './Tooltip.css';\r\nimport { Portal } from '../../utils/portal/portal';\r\n\r\ntype Placement = 'top' | 'bottom';\r\n\r\nexport interface TooltipProps {\r\n  label: string;\r\n  children: React.ReactNode;\r\n  className?: string;\r\n  delay?: number;\r\n  offset?: number;\r\n}\r\n\r\nexport function Tooltip({\r\n  label,\r\n  children,\r\n  className = '',\r\n  delay = 200,\r\n  offset = 8,\r\n}: TooltipProps) {\r\n  const [open, setOpen] = useState(false);\r\n  const [coords, setCoords] = useState({ top: 0, left: 0 });\r\n  const [placement, setPlacement] = useState<Placement>('top');\r\n\r\n  const triggerRef = useRef<HTMLSpanElement | null>(null);\r\n  const tooltipRef = useRef<HTMLDivElement | null>(null);\r\nconst timeoutRef = useRef<number | null>(null);\r\n\r\n  const id = `tooltip-${useId()}`;\r\n\r\n  /* ---------------- Visibility ---------------- */\r\n\r\n  const show = () => {\r\n    timeoutRef.current = window.setTimeout(() => {\r\n      setOpen(true);\r\n    }, delay);\r\n  };\r\n\r\n  const hide = () => {\r\n    if (timeoutRef.current) clearTimeout(timeoutRef.current);\r\n    setOpen(false);\r\n  };\r\n\r\n  /* ---------------- Positioning ---------------- */\r\n\r\n  const updatePosition = useCallback(() => {\r\n    if (!triggerRef.current || !tooltipRef.current) return;\r\n\r\n    const triggerRect = triggerRef.current.getBoundingClientRect();\r\n    const tooltipRect = tooltipRef.current.getBoundingClientRect();\r\n\r\n    const scrollX = window.scrollX;\r\n    const scrollY = window.scrollY;\r\n\r\n    const centerX =\r\n      triggerRect.left + scrollX + triggerRect.width / 2;\r\n\r\n    // Try top first\r\n    let top =\r\n      triggerRect.top +\r\n      scrollY -\r\n      tooltipRect.height -\r\n      offset;\r\n\r\n    let nextPlacement: Placement = 'top';\r\n\r\n    // Flip to bottom if clipped\r\n    if (top < scrollY + 8) {\r\n      top =\r\n        triggerRect.bottom +\r\n        scrollY +\r\n        offset;\r\n      nextPlacement = 'bottom';\r\n    }\r\n\r\n    setPlacement(nextPlacement);\r\n    setCoords({ top, left: centerX });\r\n  }, [offset]);\r\n\r\n  /* ---------------- Effects ---------------- */\r\n\r\n  useLayoutEffect(() => {\r\n    if (!open) return;\r\n\r\n    updatePosition();\r\n\r\n    window.addEventListener('scroll', updatePosition, true);\r\n    window.addEventListener('resize', updatePosition);\r\n\r\n    return () => {\r\n      window.removeEventListener('scroll', updatePosition, true);\r\n      window.removeEventListener('resize', updatePosition);\r\n    };\r\n  }, [open, updatePosition]);\r\n\r\n  useEffect(() => {\r\n    if (!open) return;\r\n\r\n    const onKeyDown = (e: KeyboardEvent) => {\r\n      if (e.key === 'Escape') hide();\r\n    };\r\n\r\n    document.addEventListener('keydown', onKeyDown);\r\n    return () => document.removeEventListener('keydown', onKeyDown);\r\n  }, [open]);\r\n\r\n  useEffect(() => {\r\n    return () => {\r\n      if (timeoutRef.current) clearTimeout(timeoutRef.current);\r\n    };\r\n  }, []);\r\n\r\n  /* ---------------- Render ---------------- */\r\n\r\n  return (\r\n    <>\r\n      <span\r\n        ref={triggerRef}\r\n        className=\"ui-tooltip-container\"\r\n        aria-describedby={open ? id : undefined}\r\n        onMouseEnter={show}\r\n        onMouseLeave={hide}\r\n        onFocus={show}\r\n        onBlur={hide}\r\n        tabIndex={0}\r\n      >\r\n        {children}\r\n      </span>\r\n\r\n      {open && (\r\n        <Portal>\r\n          <div\r\n            ref={tooltipRef}\r\n            id={id}\r\n            role=\"tooltip\"\r\n            data-placement={placement}\r\n            className={`ui-tooltip-bubble ${className}`}\r\n            style={{\r\n              position: 'absolute',\r\n              top: coords.top,\r\n              left: coords.left,\r\n            }}\r\n          >\r\n            {label}\r\n          </div>\r\n        </Portal>\r\n      )}\r\n    </>\r\n  );\r\n}\r\n"],"names":["Tooltip","label","children","className","delay","offset","open","setOpen","useState","coords","setCoords","placement","setPlacement","triggerRef","useRef","tooltipRef","timeoutRef","id","useId","show","hide","updatePosition","useCallback","triggerRect","tooltipRect","scrollX","scrollY","centerX","top","nextPlacement","useLayoutEffect","useEffect","onKeyDown","e","jsxs","Fragment","jsx","Portal"],"mappings":"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"}

package/dist/dist/components/treeview/TreeView.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),x=require("react");;/* empty css               */function j({data:f,selectedId:w,onSelect:h,className:g=""}){const[d,y]=x.useState(new Set),[A,o]=x.useState(null),u=e=>{y(i=>{const r=new Set(i);return r.has(e)?r.delete(e):r.add(e),r})},p=(e,i=[])=>(e.forEach(r=>{i.push(r);const t=d.has(r.id);r.children&&r.children.length>0&&t&&p(r.children,i)}),i),N=(e,i,r)=>{const t=e.key;if(t==="Enter"||t===" "){e.preventDefault(),h&&h(i.id);return}if(t==="ArrowLeft"){e.preventDefault();const n=i.children&&i.children.length>0,s=d.has(i.id);if(n&&s){u(i.id);return}r&&o(r.id);return}if(t==="ArrowRight"){e.preventDefault();const n=i.children&&i.children.length>0,s=d.has(i.id);if(n&&!s){u(i.id);return}if(n&&s){const c=Array.isArray(i.children)&&i.children.length>0?i.children[0]:void 0;c&&o(c.id)}return}if(t==="ArrowUp"||t==="ArrowDown"){e.preventDefault();const n=p(f),s=n.findIndex(m=>m.id===i.id);if(s===-1)return;const c=t==="ArrowUp"?s-1:s+1,l=n[c];l&&o(l.id)}},v=(e,i,r)=>{const t=d.has(e.id),n=e.id===w,s=e.id===A,c=Array.isArray(e.children)&&e.children.length>0;return a.jsxs("div",{children:[a.jsxs("div",{role:"treeitem","aria-expanded":c?t:void 0,tabIndex:s?0:-1,className:["ui-tree-node",n?"selected":"",s?"active":""].filter(Boolean).join(" "),style:{paddingLeft:r*16},onClick:()=>{h&&h(e.id),o(e.id),Array.isArray(e.children)&&e.children.length>0&&u(e.id)},onKeyDown:l=>N(l,e,i),children:[c?a.jsx("span",{className:`ui-tree-arrow ${t?"open":""}`,onClick:l=>{l.stopPropagation(),u(e.id)},children:"▶"}):a.jsx("span",{className:"ui-tree-arrow empty",children:"•"}),e.icon&&a.jsx("span",{className:"ui-tree-icon",children:e.icon}),a.jsx("span",{className:"ui-tree-label",children:e.label})]}),c&&t&&e.children&&a.jsx("div",{role:"group",children:e.children.map(l=>v(l,e,r+1))})]},e.id)};return a.jsx("div",{className:`ui-treeview ${g}`,role:"tree",children:f.map(e=>v(e,void 0,0))})}exports.TreeView=j;
+//# sourceMappingURL=TreeView.cjs.map

package/dist/dist/components/treeview/TreeView.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeView.cjs","sources":["../../../../src/components/treeview/TreeView.tsx"],"sourcesContent":["/**\r\n * TreeView.tsx — FINAL VERSION\r\n * ----------------------------\r\n * Features:\r\n * - Expand/collapse\r\n * - Recursive rendering\r\n * - Arrow key navigation\r\n * - Enter/Space to select\r\n * - ARIA TreeView roles\r\n * - Value controlled OR internal state\r\n */\r\n\r\nimport React, { useState } from 'react';\r\nimport './TreeView.css';\r\n\r\nexport interface TreeNode {\r\n  id: string;\r\n  label: string;\r\n  icon?: React.ReactNode;\r\n  children?: TreeNode[];\r\n}\r\n\r\ninterface TreeViewProps {\r\n  data: TreeNode[];\r\n  selectedId?: string;\r\n  onSelect?: (id: string) => void;\r\n  className?: string;\r\n}\r\n\r\nexport function TreeView({\r\n  data,\r\n  selectedId,\r\n  onSelect,\r\n  className = '',\r\n}: TreeViewProps) {\r\n  const [openNodes, setOpenNodes] = useState<Set<string>>(new Set());\r\n  const [activeNode, setActiveNode] = useState<string | null>(null);\r\n\r\n  const toggleNode = (id: string) => {\r\n    setOpenNodes((prev) => {\r\n      const next = new Set(prev);\r\n      if (next.has(id)) next.delete(id);\r\n      else next.add(id);\r\n      return next;\r\n    });\r\n  };\r\n\r\n  const flatten = (nodes: TreeNode[], acc: TreeNode[] = []): TreeNode[] => {\r\n    nodes.forEach((node) => {\r\n      acc.push(node);\r\n\r\n      const isOpen = openNodes.has(node.id);\r\n      if (node.children && node.children.length > 0 && isOpen) {\r\n        flatten(node.children, acc);\r\n      }\r\n    });\r\n    return acc;\r\n  };\r\n\r\n  const handleKeyDown = (\r\n    e: React.KeyboardEvent,\r\n    node: TreeNode,\r\n    parent: TreeNode | undefined\r\n  ) => {\r\n    const key = e.key;\r\n\r\n    // Select\r\n    if (key === 'Enter' || key === ' ') {\r\n      e.preventDefault();\r\n      if (onSelect) onSelect(node.id);\r\n      return;\r\n    }\r\n\r\n    // Collapse or go to parent\r\n    if (key === 'ArrowLeft') {\r\n      e.preventDefault();\r\n\r\n      const hasChildren = node.children && node.children.length > 0;\r\n      const isOpen = openNodes.has(node.id);\r\n\r\n      if (hasChildren && isOpen) {\r\n        toggleNode(node.id);\r\n        return;\r\n      }\r\n\r\n      if (parent) {\r\n        setActiveNode(parent.id);\r\n      }\r\n      return;\r\n    }\r\n\r\n    // Expand or go to first child\r\n    if (key === 'ArrowRight') {\r\n      e.preventDefault();\r\n\r\n      const hasChildren = node.children && node.children.length > 0;\r\n      const isOpen = openNodes.has(node.id);\r\n\r\n      if (hasChildren && !isOpen) {\r\n        toggleNode(node.id);\r\n        return;\r\n      }\r\n\r\n      if (hasChildren && isOpen) {\r\n        const firstChild =\r\n          Array.isArray(node.children) && node.children.length > 0\r\n            ? node.children[0]\r\n            : undefined;\r\n\r\n        if (firstChild) {\r\n          setActiveNode(firstChild.id);\r\n        }\r\n      }\r\n      return;\r\n    }\r\n\r\n    // Up/Down navigation\r\n    if (key === 'ArrowUp' || key === 'ArrowDown') {\r\n      e.preventDefault();\r\n      const flat = flatten(data);\r\n      const index = flat.findIndex((n) => n.id === node.id);\r\n\r\n      if (index === -1) return;\r\n\r\n      const nextIndex = key === 'ArrowUp' ? index - 1 : index + 1;\r\n      const nextNode = flat[nextIndex];\r\n\r\n      if (nextNode) {\r\n        setActiveNode(nextNode.id);\r\n      }\r\n    }\r\n  };\r\n\r\n  const renderNode = (\r\n    node: TreeNode,\r\n    parent: TreeNode | undefined,\r\n    depth: number\r\n  ) => {\r\n    const isOpen = openNodes.has(node.id);\r\n    const isSelected = node.id === selectedId;\r\n    const isActive = node.id === activeNode;\r\n    const hasChildren =\r\n      Array.isArray(node.children) && node.children.length > 0;\r\n\r\n    return (\r\n      <div key={node.id}>\r\n        <div\r\n          role=\"treeitem\"\r\n          aria-expanded={hasChildren ? isOpen : undefined}\r\n          tabIndex={isActive ? 0 : -1}\r\n          className={[\r\n            'ui-tree-node',\r\n            isSelected ? 'selected' : '',\r\n            isActive ? 'active' : '',\r\n          ]\r\n            .filter(Boolean)\r\n            .join(' ')}\r\n          style={{ paddingLeft: depth * 16 }}\r\n          onClick={() => {\r\n            if (onSelect) onSelect(node.id);\r\n            setActiveNode(node.id);\r\n\r\n            const hasChildren =\r\n              Array.isArray(node.children) && node.children.length > 0;\r\n\r\n            // Clicking node should expand/collapse just like arrow\r\n            if (hasChildren) {\r\n              toggleNode(node.id);\r\n            }\r\n          }}\r\n          onKeyDown={(e) => handleKeyDown(e, node, parent)}\r\n        >\r\n          {/* Arrow */}\r\n          {hasChildren ? (\r\n            <span\r\n              className={`ui-tree-arrow ${isOpen ? 'open' : ''}`}\r\n              onClick={(e) => {\r\n                e.stopPropagation();\r\n                toggleNode(node.id);\r\n              }}\r\n            >\r\n              ▶\r\n            </span>\r\n          ) : (\r\n            <span className=\"ui-tree-arrow empty\">•</span>\r\n          )}\r\n\r\n          {/* Icon */}\r\n          {node.icon && <span className=\"ui-tree-icon\">{node.icon}</span>}\r\n\r\n          <span className=\"ui-tree-label\">{node.label}</span>\r\n        </div>\r\n\r\n        {/* Children */}\r\n        {hasChildren && isOpen && node.children && (\r\n          <div role=\"group\">\r\n            {node.children.map((child) => renderNode(child, node, depth + 1))}\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  };\r\n\r\n  return (\r\n    <div className={`ui-treeview ${className}`} role=\"tree\">\r\n      {data.map((node) => renderNode(node, undefined, 0))}\r\n    </div>\r\n  );\r\n}\r\n"],"names":["TreeView","data","selectedId","onSelect","className","openNodes","setOpenNodes","useState","activeNode","setActiveNode","toggleNode","id","prev","next","flatten","nodes","acc","node","isOpen","handleKeyDown","parent","key","hasChildren","firstChild","flat","index","n","nextIndex","nextNode","renderNode","depth","isSelected","isActive","jsxs","e","jsx","child"],"mappings":"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"}

package/dist/dist/components/treeview/TreeView.js

@@ -0,0 +1,98 @@
+import { jsx as a, jsxs as m } from "react/jsx-runtime";
+import { useState as w } from "react";
+/* empty css             */
+function b({
+  data: p,
+  selectedId: A,
+  onSelect: h,
+  className: N = ""
+}) {
+  const [d, g] = w(/* @__PURE__ */ new Set()), [y, o] = w(null), f = (i) => {
+    g((e) => {
+      const r = new Set(e);
+      return r.has(i) ? r.delete(i) : r.add(i), r;
+    });
+  }, u = (i, e = []) => (i.forEach((r) => {
+    e.push(r);
+    const t = d.has(r.id);
+    r.children && r.children.length > 0 && t && u(r.children, e);
+  }), e), x = (i, e, r) => {
+    const t = i.key;
+    if (t === "Enter" || t === " ") {
+      i.preventDefault(), h && h(e.id);
+      return;
+    }
+    if (t === "ArrowLeft") {
+      i.preventDefault();
+      const s = e.children && e.children.length > 0, n = d.has(e.id);
+      if (s && n) {
+        f(e.id);
+        return;
+      }
+      r && o(r.id);
+      return;
+    }
+    if (t === "ArrowRight") {
+      i.preventDefault();
+      const s = e.children && e.children.length > 0, n = d.has(e.id);
+      if (s && !n) {
+        f(e.id);
+        return;
+      }
+      if (s && n) {
+        const c = Array.isArray(e.children) && e.children.length > 0 ? e.children[0] : void 0;
+        c && o(c.id);
+      }
+      return;
+    }
+    if (t === "ArrowUp" || t === "ArrowDown") {
+      i.preventDefault();
+      const s = u(p), n = s.findIndex((C) => C.id === e.id);
+      if (n === -1) return;
+      const c = t === "ArrowUp" ? n - 1 : n + 1, l = s[c];
+      l && o(l.id);
+    }
+  }, v = (i, e, r) => {
+    const t = d.has(i.id), s = i.id === A, n = i.id === y, c = Array.isArray(i.children) && i.children.length > 0;
+    return /* @__PURE__ */ m("div", { children: [
+      /* @__PURE__ */ m(
+        "div",
+        {
+          role: "treeitem",
+          "aria-expanded": c ? t : void 0,
+          tabIndex: n ? 0 : -1,
+          className: [
+            "ui-tree-node",
+            s ? "selected" : "",
+            n ? "active" : ""
+          ].filter(Boolean).join(" "),
+          style: { paddingLeft: r * 16 },
+          onClick: () => {
+            h && h(i.id), o(i.id), Array.isArray(i.children) && i.children.length > 0 && f(i.id);
+          },
+          onKeyDown: (l) => x(l, i, e),
+          children: [
+            c ? /* @__PURE__ */ a(
+              "span",
+              {
+                className: `ui-tree-arrow ${t ? "open" : ""}`,
+                onClick: (l) => {
+                  l.stopPropagation(), f(i.id);
+                },
+                children: "▶"
+              }
+            ) : /* @__PURE__ */ a("span", { className: "ui-tree-arrow empty", children: "•" }),
+            i.icon && /* @__PURE__ */ a("span", { className: "ui-tree-icon", children: i.icon }),
+            /* @__PURE__ */ a("span", { className: "ui-tree-label", children: i.label })
+          ]
+        }
+      ),
+      c && t && i.children && /* @__PURE__ */ a("div", { role: "group", children: i.children.map((l) => v(l, i, r + 1)) })
+    ] }, i.id);
+  };
+  return /* @__PURE__ */ a("div", { className: `ui-treeview ${N}`, role: "tree", children: p.map((i) => v(i, void 0, 0)) });
+}
+export {
+  b as TreeView
+};
+//# sourceMappingURL=TreeView.js.map

package/dist/dist/components/treeview/TreeView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeView.js","sources":["../../../../src/components/treeview/TreeView.tsx"],"sourcesContent":["/**\r\n * TreeView.tsx — FINAL VERSION\r\n * ----------------------------\r\n * Features:\r\n * - Expand/collapse\r\n * - Recursive rendering\r\n * - Arrow key navigation\r\n * - Enter/Space to select\r\n * - ARIA TreeView roles\r\n * - Value controlled OR internal state\r\n */\r\n\r\nimport React, { useState } from 'react';\r\nimport './TreeView.css';\r\n\r\nexport interface TreeNode {\r\n  id: string;\r\n  label: string;\r\n  icon?: React.ReactNode;\r\n  children?: TreeNode[];\r\n}\r\n\r\ninterface TreeViewProps {\r\n  data: TreeNode[];\r\n  selectedId?: string;\r\n  onSelect?: (id: string) => void;\r\n  className?: string;\r\n}\r\n\r\nexport function TreeView({\r\n  data,\r\n  selectedId,\r\n  onSelect,\r\n  className = '',\r\n}: TreeViewProps) {\r\n  const [openNodes, setOpenNodes] = useState<Set<string>>(new Set());\r\n  const [activeNode, setActiveNode] = useState<string | null>(null);\r\n\r\n  const toggleNode = (id: string) => {\r\n    setOpenNodes((prev) => {\r\n      const next = new Set(prev);\r\n      if (next.has(id)) next.delete(id);\r\n      else next.add(id);\r\n      return next;\r\n    });\r\n  };\r\n\r\n  const flatten = (nodes: TreeNode[], acc: TreeNode[] = []): TreeNode[] => {\r\n    nodes.forEach((node) => {\r\n      acc.push(node);\r\n\r\n      const isOpen = openNodes.has(node.id);\r\n      if (node.children && node.children.length > 0 && isOpen) {\r\n        flatten(node.children, acc);\r\n      }\r\n    });\r\n    return acc;\r\n  };\r\n\r\n  const handleKeyDown = (\r\n    e: React.KeyboardEvent,\r\n    node: TreeNode,\r\n    parent: TreeNode | undefined\r\n  ) => {\r\n    const key = e.key;\r\n\r\n    // Select\r\n    if (key === 'Enter' || key === ' ') {\r\n      e.preventDefault();\r\n      if (onSelect) onSelect(node.id);\r\n      return;\r\n    }\r\n\r\n    // Collapse or go to parent\r\n    if (key === 'ArrowLeft') {\r\n      e.preventDefault();\r\n\r\n      const hasChildren = node.children && node.children.length > 0;\r\n      const isOpen = openNodes.has(node.id);\r\n\r\n      if (hasChildren && isOpen) {\r\n        toggleNode(node.id);\r\n        return;\r\n      }\r\n\r\n      if (parent) {\r\n        setActiveNode(parent.id);\r\n      }\r\n      return;\r\n    }\r\n\r\n    // Expand or go to first child\r\n    if (key === 'ArrowRight') {\r\n      e.preventDefault();\r\n\r\n      const hasChildren = node.children && node.children.length > 0;\r\n      const isOpen = openNodes.has(node.id);\r\n\r\n      if (hasChildren && !isOpen) {\r\n        toggleNode(node.id);\r\n        return;\r\n      }\r\n\r\n      if (hasChildren && isOpen) {\r\n        const firstChild =\r\n          Array.isArray(node.children) && node.children.length > 0\r\n            ? node.children[0]\r\n            : undefined;\r\n\r\n        if (firstChild) {\r\n          setActiveNode(firstChild.id);\r\n        }\r\n      }\r\n      return;\r\n    }\r\n\r\n    // Up/Down navigation\r\n    if (key === 'ArrowUp' || key === 'ArrowDown') {\r\n      e.preventDefault();\r\n      const flat = flatten(data);\r\n      const index = flat.findIndex((n) => n.id === node.id);\r\n\r\n      if (index === -1) return;\r\n\r\n      const nextIndex = key === 'ArrowUp' ? index - 1 : index + 1;\r\n      const nextNode = flat[nextIndex];\r\n\r\n      if (nextNode) {\r\n        setActiveNode(nextNode.id);\r\n      }\r\n    }\r\n  };\r\n\r\n  const renderNode = (\r\n    node: TreeNode,\r\n    parent: TreeNode | undefined,\r\n    depth: number\r\n  ) => {\r\n    const isOpen = openNodes.has(node.id);\r\n    const isSelected = node.id === selectedId;\r\n    const isActive = node.id === activeNode;\r\n    const hasChildren =\r\n      Array.isArray(node.children) && node.children.length > 0;\r\n\r\n    return (\r\n      <div key={node.id}>\r\n        <div\r\n          role=\"treeitem\"\r\n          aria-expanded={hasChildren ? isOpen : undefined}\r\n          tabIndex={isActive ? 0 : -1}\r\n          className={[\r\n            'ui-tree-node',\r\n            isSelected ? 'selected' : '',\r\n            isActive ? 'active' : '',\r\n          ]\r\n            .filter(Boolean)\r\n            .join(' ')}\r\n          style={{ paddingLeft: depth * 16 }}\r\n          onClick={() => {\r\n            if (onSelect) onSelect(node.id);\r\n            setActiveNode(node.id);\r\n\r\n            const hasChildren =\r\n              Array.isArray(node.children) && node.children.length > 0;\r\n\r\n            // Clicking node should expand/collapse just like arrow\r\n            if (hasChildren) {\r\n              toggleNode(node.id);\r\n            }\r\n          }}\r\n          onKeyDown={(e) => handleKeyDown(e, node, parent)}\r\n        >\r\n          {/* Arrow */}\r\n          {hasChildren ? (\r\n            <span\r\n              className={`ui-tree-arrow ${isOpen ? 'open' : ''}`}\r\n              onClick={(e) => {\r\n                e.stopPropagation();\r\n                toggleNode(node.id);\r\n              }}\r\n            >\r\n              ▶\r\n            </span>\r\n          ) : (\r\n            <span className=\"ui-tree-arrow empty\">•</span>\r\n          )}\r\n\r\n          {/* Icon */}\r\n          {node.icon && <span className=\"ui-tree-icon\">{node.icon}</span>}\r\n\r\n          <span className=\"ui-tree-label\">{node.label}</span>\r\n        </div>\r\n\r\n        {/* Children */}\r\n        {hasChildren && isOpen && node.children && (\r\n          <div role=\"group\">\r\n            {node.children.map((child) => renderNode(child, node, depth + 1))}\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  };\r\n\r\n  return (\r\n    <div className={`ui-treeview ${className}`} role=\"tree\">\r\n      {data.map((node) => renderNode(node, undefined, 0))}\r\n    </div>\r\n  );\r\n}\r\n"],"names":["TreeView","data","selectedId","onSelect","className","openNodes","setOpenNodes","useState","activeNode","setActiveNode","toggleNode","id","prev","next","flatten","nodes","acc","node","isOpen","handleKeyDown","e","parent","key","hasChildren","firstChild","flat","index","n","nextIndex","nextNode","renderNode","depth","isSelected","isActive","jsxs","jsx","child"],"mappings":"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"}

package/dist/dist/components/virtuallist/VirtualList.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),n=require("react");;/* empty css                  */function L({items:o,height:a,itemHeight:e=36,renderItem:d,className:v=""}){const s=n.useRef(null),[f,x]=n.useState(0),c=n.useCallback(()=>{s.current&&x(s.current.scrollTop)},[]),i=o.length,p=Math.ceil(a/e)+2,r=Math.max(0,Math.floor(f/e)-1),m=Math.min(i-1,r+p),y=r*e,h=o.slice(r,m+1);return n.useLayoutEffect(()=>{const t=s.current;if(t)return t.addEventListener("scroll",c,{passive:!0}),()=>t.removeEventListener("scroll",c)},[c]),l.jsxs("div",{ref:s,className:`ui-virtual-list ${v}`,style:{height:a},children:[l.jsx("div",{className:"ui-virtual-spacer",style:{height:i*e}}),l.jsx("div",{className:"ui-virtual-items",style:{transform:`translateY(${y}px)`},children:h.map((t,j)=>{const u=r+j;return l.jsx("div",{className:"ui-virtual-row",style:{height:e},children:d(t,u)},u)})})]})}exports.VirtualList=L;
+//# sourceMappingURL=VirtualList.cjs.map

package/dist/dist/components/virtuallist/VirtualList.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"VirtualList.cjs","sources":["../../../../src/components/virtuallist/VirtualList.tsx"],"sourcesContent":["import React, { useRef, useState, useLayoutEffect, useCallback } from 'react';\r\nimport './VirtualList.css';\r\n\r\nexport interface VirtualListProps<T> {\r\n  items: T[];\r\n  /** Height of the viewport container */\r\n  height: number;\r\n  /** Fixed height for each row */\r\n  itemHeight?: number; // default: 36px\r\n  /** Renderer function */\r\n  renderItem: (item: T, index: number) => React.ReactNode;\r\n  /** Optional class */\r\n  className?: string;\r\n}\r\n\r\n/**\r\n * Virtualized List (Fixed Row Height)\r\n * -----------------------------------\r\n * • Ultra-fast\r\n * • Handles 10k+ rows easily\r\n * • Smooth scroll\r\n * • Zero dependencies\r\n * • Precision scrolling\r\n */\r\nexport function VirtualList<T>({\r\n  items,\r\n  height,\r\n  itemHeight = 36,\r\n  renderItem,\r\n  className = '',\r\n}: VirtualListProps<T>) {\r\n  const containerRef = useRef<HTMLDivElement | null>(null);\r\n\r\n  // visible window\r\n  const [scrollTop, setScrollTop] = useState(0);\r\n\r\n  const onScroll = useCallback(() => {\r\n    if (containerRef.current) {\r\n      setScrollTop(containerRef.current.scrollTop);\r\n    }\r\n  }, []);\r\n\r\n  // compute visible range\r\n  const total = items.length;\r\n  const viewCount = Math.ceil(height / itemHeight) + 2; // overscan\r\n  const startIndex = Math.max(0, Math.floor(scrollTop / itemHeight) - 1);\r\n  const endIndex = Math.min(total - 1, startIndex + viewCount);\r\n\r\n  // positioning\r\n  const offsetTop = startIndex * itemHeight;\r\n  const visibleItems = items.slice(startIndex, endIndex + 1);\r\n\r\n  // ensure scroll events update immediately\r\n  useLayoutEffect(() => {\r\n    const el = containerRef.current;\r\n    if (!el) return;\r\n\r\n    el.addEventListener('scroll', onScroll, { passive: true });\r\n    return () => el.removeEventListener('scroll', onScroll);\r\n  }, [onScroll]);\r\n\r\n  return (\r\n    <div\r\n      ref={containerRef}\r\n      className={`ui-virtual-list ${className}`}\r\n      style={{ height }}\r\n    >\r\n      <div\r\n        className=\"ui-virtual-spacer\"\r\n        style={{ height: total * itemHeight }}\r\n      />\r\n\r\n      <div\r\n        className=\"ui-virtual-items\"\r\n        style={{ transform: `translateY(${offsetTop}px)` }}\r\n      >\r\n        {visibleItems.map((item, i) => {\r\n          const index = startIndex + i;\r\n          return (\r\n            <div\r\n              key={index}\r\n              className=\"ui-virtual-row\"\r\n              style={{ height: itemHeight }}\r\n            >\r\n              {renderItem(item, index)}\r\n            </div>\r\n          );\r\n        })}\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n"],"names":["VirtualList","items","height","itemHeight","renderItem","className","containerRef","useRef","scrollTop","setScrollTop","useState","onScroll","useCallback","total","viewCount","startIndex","endIndex","offsetTop","visibleItems","useLayoutEffect","el","jsxs","jsx","item","i","index"],"mappings":"yKAwBO,SAASA,EAAe,CAC7B,MAAAC,EACA,OAAAC,EACA,WAAAC,EAAa,GACb,WAAAC,EACA,UAAAC,EAAY,EACd,EAAwB,CACtB,MAAMC,EAAeC,EAAAA,OAA8B,IAAI,EAGjD,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,CAAC,EAEtCC,EAAWC,EAAAA,YAAY,IAAM,CAC7BN,EAAa,SACfG,EAAaH,EAAa,QAAQ,SAAS,CAE/C,EAAG,CAAA,CAAE,EAGCO,EAAQZ,EAAM,OACda,EAAY,KAAK,KAAKZ,EAASC,CAAU,EAAI,EAC7CY,EAAa,KAAK,IAAI,EAAG,KAAK,MAAMP,EAAYL,CAAU,EAAI,CAAC,EAC/Da,EAAW,KAAK,IAAIH,EAAQ,EAAGE,EAAaD,CAAS,EAGrDG,EAAYF,EAAaZ,EACzBe,EAAejB,EAAM,MAAMc,EAAYC,EAAW,CAAC,EAGzDG,OAAAA,EAAAA,gBAAgB,IAAM,CACpB,MAAMC,EAAKd,EAAa,QACxB,GAAKc,EAEL,OAAAA,EAAG,iBAAiB,SAAUT,EAAU,CAAE,QAAS,GAAM,EAClD,IAAMS,EAAG,oBAAoB,SAAUT,CAAQ,CACxD,EAAG,CAACA,CAAQ,CAAC,EAGXU,EAAAA,KAAC,MAAA,CACC,IAAKf,EACL,UAAW,mBAAmBD,CAAS,GACvC,MAAO,CAAE,OAAAH,CAAA,EAET,SAAA,CAAAoB,EAAAA,IAAC,MAAA,CACC,UAAU,oBACV,MAAO,CAAE,OAAQT,EAAQV,CAAA,CAAW,CAAA,EAGtCmB,EAAAA,IAAC,MAAA,CACC,UAAU,mBACV,MAAO,CAAE,UAAW,cAAcL,CAAS,KAAA,EAE1C,SAAAC,EAAa,IAAI,CAACK,EAAMC,IAAM,CAC7B,MAAMC,EAAQV,EAAaS,EAC3B,OACEF,EAAAA,IAAC,MAAA,CAEC,UAAU,iBACV,MAAO,CAAE,OAAQnB,CAAA,EAEhB,SAAAC,EAAWmB,EAAME,CAAK,CAAA,EAJlBA,CAAA,CAOX,CAAC,CAAA,CAAA,CACH,CAAA,CAAA,CAGN"}