@fuf-stack/pixels 0.2.5 → 0.3.1

package/dist/chunk-YUOFNPJO.cjs

@@ -0,0 +1,46 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }// src/Popover/Popover.tsx
+var _popover = require('@nextui-org/popover');
+var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
+var _debug = require('debug'); var _debug2 = _interopRequireDefault(_debug);
+var _jsxruntime = require('react/jsx-runtime');
+var debug = _debug2.default.call(void 0, "component:Popover");
+var Popover_default = ({
+  children = null,
+  className = void 0,
+  content,
+  contentTestId = void 0,
+  placement = "top",
+  openControlled = void 0,
+  testId = void 0,
+  title = void 0
+}) => {
+  debug("Popover");
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    _popover.Popover,
+    {
+      placement,
+      radius: "sm",
+      showArrow: true,
+      ...openControlled ? { isOpen: openControlled.open, onOpenChange: openControlled.setOpen } : {},
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _popover.PopoverTrigger, { className: _classnames2.default.call(void 0, className), "data-testid": testId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { children }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _popover.PopoverContent, { "data-testid": contentTestId, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "max-h-[80vh] overflow-y-auto", children: [
+          title && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
+            title,
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "hr", {})
+          ] }),
+          content
+        ] }) })
+      ]
+    }
+  );
+};
+
+// src/Popover/index.ts
+var Popover_default2 = Popover_default;
+
+
+
+
+exports.Popover_default = Popover_default; exports.Popover_default2 = Popover_default2;
+//# sourceMappingURL=chunk-YUOFNPJO.cjs.map

package/dist/chunk-YUOFNPJO.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Popover/Popover.tsx","../src/Popover/index.ts"],"names":["Popover_default"],"mappings":";AAGA,SAAS,SAAS,gBAAgB,sBAAsB;AACxD,OAAO,QAAQ;AACf,OAAO,iBAAiB;AAkDhB,cAKI,YALJ;AAhDR,IAAM,QAAQ,YAAY,mBAAmB;AAwB7C,IAAO,kBAAQ,CAAC;AAAA,EACd,WAAW;AAAA,EACX,YAAY;AAAA,EACZ;AAAA,EACA,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,SAAS;AAAA,EACT,QAAQ;AACV,MAAoB;AAClB,QAAM,SAAS;AAEf,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,QAAO;AAAA,MACP,WAAS;AAAA,MACR,GAAI,iBACD,EAAE,QAAQ,eAAe,MAAM,cAAc,eAAe,QAAQ,IACpE,CAAC;AAAA,MAEL;AAAA,4BAAC,kBAAe,WAAW,GAAG,SAAS,GAAG,eAAa,QAGrD,8BAAC,YAAQ,UAAS,GACpB;AAAA,QACA,oBAAC,kBAAe,eAAa,eAC3B,+BAAC,SAAI,WAAU,gCACZ;AAAA,mBACC,qBAAC,SACE;AAAA;AAAA,YACD,oBAAC,QAAG;AAAA,aACN;AAAA,UAED;AAAA,WACH,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;;;AChEA,IAAOA,mBAAQ","sourcesContent":["import type { PopoverProps as NextPopoverProps } from '@nextui-org/popover';\nimport type { ReactNode } from 'react';\n\nimport { Popover, PopoverContent, PopoverTrigger } from '@nextui-org/popover';\nimport cn from 'classnames';\nimport createDebug from 'debug';\n\nconst debug = createDebug('component:Popover');\n\nexport interface PopoverProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** content of the popover */\n  content: ReactNode;\n  /** HTML data-testid attribute used in e2e tests */\n  contentTestId?: string;\n  /** placement of the popover relative to its trigger reference */\n  placement?: NextPopoverProps['placement'];\n  /** use as controlled component  */\n  openControlled?: { open: boolean; setOpen: (open: boolean) => void };\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** popover title */\n  title?: ReactNode;\n}\n\n/**\n * Popover component based on [NextUI Card](https://nextui.org/docs/components/popover)\n */\nexport default ({\n  children = null,\n  className = undefined,\n  content,\n  contentTestId = undefined,\n  placement = 'top',\n  openControlled = undefined,\n  testId = undefined,\n  title = undefined,\n}: PopoverProps) => {\n  debug('Popover');\n\n  return (\n    <Popover\n      placement={placement}\n      radius=\"sm\"\n      showArrow\n      {...(openControlled\n        ? { isOpen: openControlled.open, onOpenChange: openControlled.setOpen }\n        : {})}\n    >\n      <PopoverTrigger className={cn(className)} data-testid={testId}>\n        {/* NOTE: type and aria properties are injected by PopoverTrigger */}\n        {/* eslint-disable-next-line react/button-has-type */}\n        <button>{children}</button>\n      </PopoverTrigger>\n      <PopoverContent data-testid={contentTestId}>\n        <div className=\"max-h-[80vh] overflow-y-auto\">\n          {title && (\n            <div>\n              {title}\n              <hr />\n            </div>\n          )}\n          {content}\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n};\n","import Popover from './Popover';\n\nexport type { PopoverProps } from './Popover';\n\nexport { Popover };\n\nexport default Popover;\n"]}

package/dist/index.cjs

@@ -0,0 +1,102 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkWTKZJFQVcjs = require('./chunk-WTKZJFQV.cjs');
+
+
+var _chunkPI7CBPUScjs = require('./chunk-PI7CBPUS.cjs');
+
+
+var _chunkI76NWOB3cjs = require('./chunk-I76NWOB3.cjs');
+
+
+var _chunkBMKGS5PKcjs = require('./chunk-BMKGS5PK.cjs');
+
+
+var _chunkL5OZDDU7cjs = require('./chunk-L5OZDDU7.cjs');
+
+
+var _chunkSTEC6TAQcjs = require('./chunk-STEC6TAQ.cjs');
+
+
+var _chunkYUOFNPJOcjs = require('./chunk-YUOFNPJO.cjs');
+require('./chunk-JD3BEOSK.cjs');
+
+// src/hooks/useDebounce.ts
+var _react = require('react');
+var useDebounce_default = (value, delay) => {
+  const [debouncedValue, setDebouncedValue] = _react.useState.call(void 0, value);
+  _react.useEffect.call(void 0, 
+    () => {
+      const handler = setTimeout(() => {
+        setDebouncedValue(value);
+      }, delay);
+      return () => {
+        clearTimeout(handler);
+      };
+    },
+    [value, delay]
+    // Only re-call effect if value or delay changes
+  );
+  return debouncedValue;
+};
+
+// src/hooks/useLocalStorage.ts
+
+var useLocalStorage = (key, initialValue) => {
+  const readValue = () => {
+    if (typeof window === "undefined") {
+      return initialValue;
+    }
+    try {
+      const item = window.localStorage.getItem(key);
+      return item ? JSON.parse(item) : initialValue;
+    } catch (error) {
+      console.warn(`Error reading localStorage key \u201C${key}\u201D:`, error);
+      return initialValue;
+    }
+  };
+  const [storedValue, setStoredValue] = _react.useState.call(void 0, readValue);
+  const setValue = (value) => {
+    if (typeof window === "undefined") {
+      console.warn(
+        `Tried setting localStorage key \u201C${key}\u201D even though environment is not a client`
+      );
+    }
+    try {
+      const newValue = value instanceof Function ? value(storedValue) : value;
+      window.localStorage.setItem(key, JSON.stringify(newValue));
+      setStoredValue(newValue);
+      window.dispatchEvent(new Event("local-storage"));
+    } catch (error) {
+      console.warn(`Error setting localStorage key \u201C${key}\u201D:`, error);
+    }
+  };
+  _react.useEffect.call(void 0, () => {
+    setStoredValue(readValue());
+  }, []);
+  _react.useEffect.call(void 0, () => {
+    const handleStorageChange = () => {
+      setStoredValue(readValue());
+    };
+    window.addEventListener("storage", handleStorageChange);
+    window.addEventListener("local-storage", handleStorageChange);
+    return () => {
+      window.removeEventListener("storage", handleStorageChange);
+      window.removeEventListener("local-storage", handleStorageChange);
+    };
+  }, []);
+  return [storedValue, setValue];
+};
+var useLocalStorage_default = useLocalStorage;
+
+
+
+
+
+
+
+
+
+
+exports.Button = _chunkI76NWOB3cjs.Button_default; exports.Card = _chunkWTKZJFQVcjs.Card_default; exports.Json = _chunkPI7CBPUScjs.Json_default; exports.Label = _chunkBMKGS5PKcjs.Label_default; exports.Menu = _chunkL5OZDDU7cjs.Menu_default; exports.Modal = _chunkSTEC6TAQcjs.Modal_default; exports.Popover = _chunkYUOFNPJOcjs.Popover_default; exports.useDebounce = useDebounce_default; exports.useLocalStorage = useLocalStorage_default;
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/useDebounce.ts","../src/hooks/useLocalStorage.ts"],"names":["useEffect","useState"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,WAAW,gBAAgB;AAEpC,IAAO,sBAAQ,CAAQ,OAAc,UAAkB;AAErD,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAC1D;AAAA,IACE,MAAM;AAEJ,YAAM,UAAU,WAAW,MAAM;AAC/B,0BAAkB,KAAK;AAAA,MACzB,GAAG,KAAK;AAIR,aAAO,MAAM;AACX,qBAAa,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,IACA,CAAC,OAAO,KAAK;AAAA;AAAA,EACf;AACA,SAAO;AACT;;;ACnBA,SAAS,aAAAA,YAAW,YAAAC,iBAAgB;AAEpC,IAAM,kBAAkB,CACtB,KACA,iBACqC;AAGrC,QAAM,YAAY,MAAM;AAEtB,QAAI,OAAO,WAAW,aAAa;AACjC,aAAO;AAAA,IACT;AAEA,QAAI;AACF,YAAM,OAAO,OAAO,aAAa,QAAQ,GAAG;AAC5C,aAAO,OAAO,KAAK,MAAM,IAAI,IAAI;AAAA,IACnC,SAAS,OAAO;AACd,cAAQ,KAAK,wCAAmC,GAAG,WAAM,KAAK;AAC9D,aAAO;AAAA,IACT;AAAA,EACF;AAIA,QAAM,CAAC,aAAa,cAAc,IAAIA,UAAY,SAAS;AAI3D,QAAM,WAAwC,CAAC,UAAU;AAEvD,QAAI,OAAO,WAAW,aAAa;AACjC,cAAQ;AAAA,QACN,wCAAmC,GAAG;AAAA,MACxC;AAAA,IACF;AAEA,QAAI;AAEF,YAAM,WAAW,iBAAiB,WAAW,MAAM,WAAW,IAAI;AAGlE,aAAO,aAAa,QAAQ,KAAK,KAAK,UAAU,QAAQ,CAAC;AAGzD,qBAAe,QAAQ;AAGvB,aAAO,cAAc,IAAI,MAAM,eAAe,CAAC;AAAA,IACjD,SAAS,OAAO;AACd,cAAQ,KAAK,wCAAmC,GAAG,WAAM,KAAK;AAAA,IAChE;AAAA,EACF;AAEA,EAAAD,WAAU,MAAM;AACd,mBAAe,UAAU,CAAC;AAAA,EAE5B,GAAG,CAAC,CAAC;AAEL,EAAAA,WAAU,MAAM;AACd,UAAM,sBAAsB,MAAM;AAChC,qBAAe,UAAU,CAAC;AAAA,IAC5B;AAGA,WAAO,iBAAiB,WAAW,mBAAmB;AAGtD,WAAO,iBAAiB,iBAAiB,mBAAmB;AAE5D,WAAO,MAAM;AACX,aAAO,oBAAoB,WAAW,mBAAmB;AACzD,aAAO,oBAAoB,iBAAiB,mBAAmB;AAAA,IACjE;AAAA,EAEF,GAAG,CAAC,CAAC;AAEL,SAAO,CAAC,aAAa,QAAQ;AAC/B;AAEA,IAAO,0BAAQ","sourcesContent":["import { useEffect, useState } from 'react';\n\nexport default <Value>(value: Value, delay: number) => {\n  // State and setters for debounced value\n  const [debouncedValue, setDebouncedValue] = useState(value);\n  useEffect(\n    () => {\n      // Update debounced value after delay\n      const handler = setTimeout(() => {\n        setDebouncedValue(value);\n      }, delay);\n      // Cancel the timeout if value changes (also on delay change or unmount)\n      // This is how we prevent debounced value from updating if value is changed ...\n      // .. within the delay period. Timeout gets cleared and restarted.\n      return () => {\n        clearTimeout(handler);\n      };\n    },\n    [value, delay], // Only re-call effect if value or delay changes\n  );\n  return debouncedValue;\n};\n","import type { Dispatch, SetStateAction } from 'react';\n\nimport { useEffect, useState } from 'react';\n\nconst useLocalStorage = <T>(\n  key: string,\n  initialValue: T | (() => T),\n): [T, Dispatch<SetStateAction<T>>] => {\n  // Get from local storage then\n  // parse stored json or return initialValue\n  const readValue = () => {\n    // Prevent build error \"window is undefined\" but keep keep working\n    if (typeof window === 'undefined') {\n      return initialValue;\n    }\n\n    try {\n      const item = window.localStorage.getItem(key);\n      return item ? JSON.parse(item) : initialValue;\n    } catch (error) {\n      console.warn(`Error reading localStorage key “${key}”:`, error);\n      return initialValue;\n    }\n  };\n\n  // State to store our value\n  // Pass initial state function to useState so logic is only executed once\n  const [storedValue, setStoredValue] = useState<T>(readValue);\n\n  // Return a wrapped version of useState's setter function that ...\n  // ... persists the new value to localStorage.\n  const setValue: Dispatch<SetStateAction<T>> = (value) => {\n    // Prevent build error \"window is undefined\" but keeps working\n    if (typeof window === 'undefined') {\n      console.warn(\n        `Tried setting localStorage key “${key}” even though environment is not a client`,\n      );\n    }\n\n    try {\n      // Allow value to be a function so we have the same API as useState\n      const newValue = value instanceof Function ? value(storedValue) : value;\n\n      // Save to local storage\n      window.localStorage.setItem(key, JSON.stringify(newValue));\n\n      // Save state\n      setStoredValue(newValue);\n\n      // We dispatch a custom event so every useLocalStorage hook are notified\n      window.dispatchEvent(new Event('local-storage'));\n    } catch (error) {\n      console.warn(`Error setting localStorage key “${key}”:`, error);\n    }\n  };\n\n  useEffect(() => {\n    setStoredValue(readValue());\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const handleStorageChange = () => {\n      setStoredValue(readValue());\n    };\n\n    // this only works for other documents, not the current one\n    window.addEventListener('storage', handleStorageChange);\n\n    // this is a custom event, triggered in writeValueToLocalStorage\n    window.addEventListener('local-storage', handleStorageChange);\n\n    return () => {\n      window.removeEventListener('storage', handleStorageChange);\n      window.removeEventListener('local-storage', handleStorageChange);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return [storedValue, setValue];\n};\n\nexport default useLocalStorage;\n"]}

package/dist/index.d.cts

@@ -0,0 +1,21 @@
+import { Dispatch, SetStateAction } from 'react';
+export { B as Button, a as ButtonProps } from './Button-B0H0w1eR.cjs';
+export { C as Card, a as CardProps } from './Card-Cl_I4L8G.cjs';
+export { J as Json, a as JsonProps } from './Json-ClGDcbcp.cjs';
+export { L as Label, a as LabelProps } from './Label-DzZDW95M.cjs';
+export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-CG5mVVnv.cjs';
+export { M as Modal, a as ModalProps } from './Modal-CSxNe0bS.cjs';
+export { _ as Popover, P as PopoverProps } from './Popover-DbTTk7_N.cjs';
+export { a as TooltipProps } from './Tooltip-D0yEMBnv.cjs';
+import 'react/jsx-runtime';
+import '@nextui-org/button';
+import 'tailwind-variants/dist/config.js';
+import 'tailwind-variants';
+import '@nextui-org/chip';
+import '@nextui-org/popover';
+
+declare const _default: <Value>(value: Value, delay: number) => Value;
+
+declare const useLocalStorage: <T>(key: string, initialValue: T | (() => T)) => [T, Dispatch<SetStateAction<T>>];
+
+export { _default as useDebounce, useLocalStorage };

package/dist/index.d.ts

@@ -0,0 +1,21 @@
+import { Dispatch, SetStateAction } from 'react';
+export { B as Button, a as ButtonProps } from './Button-B0H0w1eR.js';
+export { C as Card, a as CardProps } from './Card-Cl_I4L8G.js';
+export { J as Json, a as JsonProps } from './Json-ClGDcbcp.js';
+export { L as Label, a as LabelProps } from './Label-DzZDW95M.js';
+export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-CG5mVVnv.js';
+export { M as Modal, a as ModalProps } from './Modal-CSxNe0bS.js';
+export { _ as Popover, P as PopoverProps } from './Popover-DbTTk7_N.js';
+export { a as TooltipProps } from './Tooltip-D0yEMBnv.js';
+import 'react/jsx-runtime';
+import '@nextui-org/button';
+import 'tailwind-variants/dist/config.js';
+import 'tailwind-variants';
+import '@nextui-org/chip';
+import '@nextui-org/popover';
+
+declare const _default: <Value>(value: Value, delay: number) => Value;
+
+declare const useLocalStorage: <T>(key: string, initialValue: T | (() => T)) => [T, Dispatch<SetStateAction<T>>];
+
+export { _default as useDebounce, useLocalStorage };

package/dist/{hooks/useLocalStorage.js → index.js}

@@ -1,5 +1,47 @@
-// src/hooks/useLocalStorage.ts
+import {
+  Card_default
+} from "./chunk-VQ5Q33MY.js";
+import {
+  Json_default
+} from "./chunk-7ERBBFDC.js";
+import {
+  Button_default
+} from "./chunk-2UJJIIMU.js";
+import {
+  Label_default
+} from "./chunk-S2WOGSQV.js";
+import {
+  Menu_default
+} from "./chunk-VZW4TVTX.js";
+import {
+  Modal_default
+} from "./chunk-MBQA3LPM.js";
+import {
+  Popover_default
+} from "./chunk-V2C3KFMP.js";
+import "./chunk-J47IOXCU.js";
+
+// src/hooks/useDebounce.ts
 import { useEffect, useState } from "react";
+var useDebounce_default = (value, delay) => {
+  const [debouncedValue, setDebouncedValue] = useState(value);
+  useEffect(
+    () => {
+      const handler = setTimeout(() => {
+        setDebouncedValue(value);
+      }, delay);
+      return () => {
+        clearTimeout(handler);
+      };
+    },
+    [value, delay]
+    // Only re-call effect if value or delay changes
+  );
+  return debouncedValue;
+};
+
+// src/hooks/useLocalStorage.ts
+import { useEffect as useEffect2, useState as useState2 } from "react";
 var useLocalStorage = (key, initialValue) => {
   const readValue = () => {
     if (typeof window === "undefined") {
@@ -13,7 +55,7 @@ var useLocalStorage = (key, initialValue) => {
       return initialValue;
     }
   };
-  const [storedValue, setStoredValue] = useState(readValue);
+  const [storedValue, setStoredValue] = useState2(readValue);
   const setValue = (value) => {
     if (typeof window === "undefined") {
       console.warn(
@@ -29,10 +71,10 @@ var useLocalStorage = (key, initialValue) => {
       console.warn(`Error setting localStorage key \u201C${key}\u201D:`, error);
     }
   };
-  useEffect(() => {
+  useEffect2(() => {
     setStoredValue(readValue());
   }, []);
-  useEffect(() => {
+  useEffect2(() => {
     const handleStorageChange = () => {
       setStoredValue(readValue());
     };
@@ -47,6 +89,14 @@ var useLocalStorage = (key, initialValue) => {
 };
 var useLocalStorage_default = useLocalStorage;
 export {
-  useLocalStorage_default as default
+  Button_default as Button,
+  Card_default as Card,
+  Json_default as Json,
+  Label_default as Label,
+  Menu_default as Menu,
+  Modal_default as Modal,
+  Popover_default as Popover,
+  useDebounce_default as useDebounce,
+  useLocalStorage_default as useLocalStorage
 };
-//# sourceMappingURL=useLocalStorage.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/useDebounce.ts","../src/hooks/useLocalStorage.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport default <Value>(value: Value, delay: number) => {\n  // State and setters for debounced value\n  const [debouncedValue, setDebouncedValue] = useState(value);\n  useEffect(\n    () => {\n      // Update debounced value after delay\n      const handler = setTimeout(() => {\n        setDebouncedValue(value);\n      }, delay);\n      // Cancel the timeout if value changes (also on delay change or unmount)\n      // This is how we prevent debounced value from updating if value is changed ...\n      // .. within the delay period. Timeout gets cleared and restarted.\n      return () => {\n        clearTimeout(handler);\n      };\n    },\n    [value, delay], // Only re-call effect if value or delay changes\n  );\n  return debouncedValue;\n};\n","import type { Dispatch, SetStateAction } from 'react';\n\nimport { useEffect, useState } from 'react';\n\nconst useLocalStorage = <T>(\n  key: string,\n  initialValue: T | (() => T),\n): [T, Dispatch<SetStateAction<T>>] => {\n  // Get from local storage then\n  // parse stored json or return initialValue\n  const readValue = () => {\n    // Prevent build error \"window is undefined\" but keep keep working\n    if (typeof window === 'undefined') {\n      return initialValue;\n    }\n\n    try {\n      const item = window.localStorage.getItem(key);\n      return item ? JSON.parse(item) : initialValue;\n    } catch (error) {\n      console.warn(`Error reading localStorage key “${key}”:`, error);\n      return initialValue;\n    }\n  };\n\n  // State to store our value\n  // Pass initial state function to useState so logic is only executed once\n  const [storedValue, setStoredValue] = useState<T>(readValue);\n\n  // Return a wrapped version of useState's setter function that ...\n  // ... persists the new value to localStorage.\n  const setValue: Dispatch<SetStateAction<T>> = (value) => {\n    // Prevent build error \"window is undefined\" but keeps working\n    if (typeof window === 'undefined') {\n      console.warn(\n        `Tried setting localStorage key “${key}” even though environment is not a client`,\n      );\n    }\n\n    try {\n      // Allow value to be a function so we have the same API as useState\n      const newValue = value instanceof Function ? value(storedValue) : value;\n\n      // Save to local storage\n      window.localStorage.setItem(key, JSON.stringify(newValue));\n\n      // Save state\n      setStoredValue(newValue);\n\n      // We dispatch a custom event so every useLocalStorage hook are notified\n      window.dispatchEvent(new Event('local-storage'));\n    } catch (error) {\n      console.warn(`Error setting localStorage key “${key}”:`, error);\n    }\n  };\n\n  useEffect(() => {\n    setStoredValue(readValue());\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const handleStorageChange = () => {\n      setStoredValue(readValue());\n    };\n\n    // this only works for other documents, not the current one\n    window.addEventListener('storage', handleStorageChange);\n\n    // this is a custom event, triggered in writeValueToLocalStorage\n    window.addEventListener('local-storage', handleStorageChange);\n\n    return () => {\n      window.removeEventListener('storage', handleStorageChange);\n      window.removeEventListener('local-storage', handleStorageChange);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return [storedValue, setValue];\n};\n\nexport default useLocalStorage;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,WAAW,gBAAgB;AAEpC,IAAO,sBAAQ,CAAQ,OAAc,UAAkB;AAErD,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAC1D;AAAA,IACE,MAAM;AAEJ,YAAM,UAAU,WAAW,MAAM;AAC/B,0BAAkB,KAAK;AAAA,MACzB,GAAG,KAAK;AAIR,aAAO,MAAM;AACX,qBAAa,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,IACA,CAAC,OAAO,KAAK;AAAA;AAAA,EACf;AACA,SAAO;AACT;;;ACnBA,SAAS,aAAAA,YAAW,YAAAC,iBAAgB;AAEpC,IAAM,kBAAkB,CACtB,KACA,iBACqC;AAGrC,QAAM,YAAY,MAAM;AAEtB,QAAI,OAAO,WAAW,aAAa;AACjC,aAAO;AAAA,IACT;AAEA,QAAI;AACF,YAAM,OAAO,OAAO,aAAa,QAAQ,GAAG;AAC5C,aAAO,OAAO,KAAK,MAAM,IAAI,IAAI;AAAA,IACnC,SAAS,OAAO;AACd,cAAQ,KAAK,wCAAmC,GAAG,WAAM,KAAK;AAC9D,aAAO;AAAA,IACT;AAAA,EACF;AAIA,QAAM,CAAC,aAAa,cAAc,IAAIA,UAAY,SAAS;AAI3D,QAAM,WAAwC,CAAC,UAAU;AAEvD,QAAI,OAAO,WAAW,aAAa;AACjC,cAAQ;AAAA,QACN,wCAAmC,GAAG;AAAA,MACxC;AAAA,IACF;AAEA,QAAI;AAEF,YAAM,WAAW,iBAAiB,WAAW,MAAM,WAAW,IAAI;AAGlE,aAAO,aAAa,QAAQ,KAAK,KAAK,UAAU,QAAQ,CAAC;AAGzD,qBAAe,QAAQ;AAGvB,aAAO,cAAc,IAAI,MAAM,eAAe,CAAC;AAAA,IACjD,SAAS,OAAO;AACd,cAAQ,KAAK,wCAAmC,GAAG,WAAM,KAAK;AAAA,IAChE;AAAA,EACF;AAEA,EAAAD,WAAU,MAAM;AACd,mBAAe,UAAU,CAAC;AAAA,EAE5B,GAAG,CAAC,CAAC;AAEL,EAAAA,WAAU,MAAM;AACd,UAAM,sBAAsB,MAAM;AAChC,qBAAe,UAAU,CAAC;AAAA,IAC5B;AAGA,WAAO,iBAAiB,WAAW,mBAAmB;AAGtD,WAAO,iBAAiB,iBAAiB,mBAAmB;AAE5D,WAAO,MAAM;AACX,aAAO,oBAAoB,WAAW,mBAAmB;AACzD,aAAO,oBAAoB,iBAAiB,mBAAmB;AAAA,IACjE;AAAA,EAEF,GAAG,CAAC,CAAC;AAEL,SAAO,CAAC,aAAa,QAAQ;AAC/B;AAEA,IAAO,0BAAQ;","names":["useEffect","useState"]}

package/package.json

@@ -2,16 +2,57 @@
   "name": "@fuf-stack/pixels",
   "description": "fuf react component library",
   "author": "Hannes Tiede",
-  "version": "0.2.5",
+  "version": "0.3.1",
   "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.cjs",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
   "exports": {
-    "./": "./dist/"
-  },
-  "typesVersions": {
-    "*": {
-      "*": [
-        "./dist/*"
-      ]
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs",
+      "types": "./dist/index.d.ts"
+    },
+    "./Button": {
+      "import": "./dist/Button/index.js",
+      "require": "./dist/Button/index.cjs",
+      "types": "./dist/Button/index.d.ts"
+    },
+    "./Card": {
+      "import": "./dist/Card/index.js",
+      "require": "./dist/Card/index.cjs",
+      "types": "./dist/Card/index.d.ts"
+    },
+    "./Json": {
+      "import": "./dist/Json/index.js",
+      "require": "./dist/Json/index.cjs",
+      "types": "./dist/Json/index.d.ts"
+    },
+    "./Label": {
+      "import": "./dist/Label/index.js",
+      "require": "./dist/Label/index.cjs",
+      "types": "./dist/Label/index.d.ts"
+    },
+    "./Menu": {
+      "import": "./dist/Menu/index.js",
+      "require": "./dist/Menu/index.cjs",
+      "types": "./dist/Menu/index.d.ts"
+    },
+    "./Modal": {
+      "import": "./dist/Modal/index.js",
+      "require": "./dist/Modal/index.cjs",
+      "types": "./dist/Modal/index.d.ts"
+    },
+    "./Popover": {
+      "import": "./dist/Popover/index.js",
+      "require": "./dist/Popover/index.cjs",
+      "types": "./dist/Popover/index.d.ts"
+    },
+    "./Tooltip": {
+      "import": "./dist/Tooltip/index.js",
+      "require": "./dist/Tooltip/index.cjs",
+      "types": "./dist/Tooltip/index.d.ts"
     }
   },
   "files": [
@@ -57,11 +98,13 @@
     "@types/debug": "4.1.12",
     "@types/react": "18.2.69",
     "@types/react-dom": "18.2.22",
-    "storybook-config": "0.0.1",
-    "tailwind-config": "0.0.1"
+    "@repo/storybook-config": "0.0.1",
+    "@repo/tailwind-config": "0.0.1",
+    "@repo/tsup-config": "0.0.1",
+    "@repo/vite-config": "0.0.1"
   },
   "scripts": {
-    "build": "rm -rf ./dist && tsup",
+    "build": "tsup --config node_modules/@repo/tsup-config/config.ts",
     "test": "vitest ./src"
   }
 }

package/dist/Button/Button.cjs

@@ -1,113 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Button/Button.tsx
-var Button_exports = {};
-__export(Button_exports, {
-  default: () => Button_default
-});
-module.exports = __toCommonJS(Button_exports);
-var import_button = require("@nextui-org/button");
-var import_classnames = __toESM(require("classnames"), 1);
-
-// src/Button/subcomponents/LoadingSpinner.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
-var LoadingSpinner_default = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-  "svg",
-  {
-    className: "animate-spin h-5 w-5 text-current",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "circle",
-        {
-          className: "opacity-25",
-          cx: "12",
-          cy: "12",
-          r: "10",
-          stroke: "currentColor",
-          strokeWidth: "4"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "path",
-        {
-          className: "opacity-75",
-          d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z",
-          fill: "currentColor"
-        }
-      )
-    ]
-  }
-);
-
-// src/Button/Button.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var Button = ({
-  ariaLabel = void 0,
-  children = void 0,
-  className = void 0,
-  color = "default",
-  disabled = false,
-  icon = void 0,
-  loading = false,
-  onClick = void 0,
-  size = void 0,
-  testId = void 0,
-  type = void 0,
-  variant = "solid",
-  ...passthrouhProps
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-    import_button.Button,
-    {
-      "aria-label": ariaLabel,
-      className: (0, import_classnames.default)(className),
-      color,
-      "data-testid": testId,
-      isDisabled: disabled,
-      isIconOnly: !!(icon && !children),
-      isLoading: loading,
-      onPress: onClick,
-      size,
-      spinner: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LoadingSpinner_default, {}),
-      type,
-      variant,
-      ...passthrouhProps,
-      children: [
-        icon,
-        children
-      ]
-    }
-  );
-};
-var Button_default = Button;
-//# sourceMappingURL=Button.cjs.map

package/dist/Button/Button.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Button/Button.tsx","../../src/Button/subcomponents/LoadingSpinner.tsx"],"sourcesContent":["import type { ButtonProps as NextButtonProps } from '@nextui-org/button';\nimport type { ReactNode } from 'react';\n\nimport { Button as NextButton } from '@nextui-org/button';\nimport cn from 'classnames';\n\nimport LoadingSpinner from './subcomponents/LoadingSpinner';\n\nexport interface ButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** next ui button color  */\n  color?: NextButtonProps['color'];\n  /** disables function of the button. */\n  disabled?: boolean;\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** optional icon */\n  icon?: ReactNode;\n  /** on click event */\n  onClick?: NextButtonProps['onPress'];\n  /** 3 size options */\n  size?: NextButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** sets the button type. */\n  type?: 'button' | 'submit' | 'reset' | undefined;\n  /** next ui button variants */\n  variant?: NextButtonProps['variant'];\n}\n\n/**\n * Button component based on [NextUI Button](https://nextui.org/docs/components/button)\n */\nconst Button = ({\n  ariaLabel = undefined,\n  children = undefined,\n  className = undefined,\n  color = 'default',\n  disabled = false,\n  icon = undefined,\n  loading = false,\n  onClick = undefined,\n  size = undefined,\n  testId = undefined,\n  type = undefined,\n  variant = 'solid',\n  ...passthrouhProps\n}: ButtonProps) => {\n  return (\n    <NextButton\n      aria-label={ariaLabel}\n      className={cn(className)}\n      color={color}\n      data-testid={testId}\n      isDisabled={disabled}\n      isIconOnly={!!(icon && !children)}\n      isLoading={loading}\n      onPress={onClick}\n      size={size}\n      spinner={<LoadingSpinner />}\n      type={type}\n      variant={variant}\n      {...passthrouhProps}\n    >\n      {icon}\n      {children}\n    </NextButton>\n  );\n};\n\nexport default Button;\n","/**\n * svg loading spinner for button\n * @see https://nextui.org/docs/components/button#loading\n * */\nexport default () => (\n  <svg\n    className=\"animate-spin h-5 w-5 text-current\"\n    fill=\"none\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <circle\n      className=\"opacity-25\"\n      cx=\"12\"\n      cy=\"12\"\n      r=\"10\"\n      stroke=\"currentColor\"\n      strokeWidth=\"4\"\n    />\n    <path\n      className=\"opacity-75\"\n      d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,oBAAqC;AACrC,wBAAe;;;ACCb;AADF,IAAO,yBAAQ,MACb;AAAA,EAAC;AAAA;AAAA,IACC,WAAU;AAAA,IACV,MAAK;AAAA,IACL,SAAQ;AAAA,IACR,OAAM;AAAA,IAEN;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAG;AAAA,UACH,IAAG;AAAA,UACH,GAAE;AAAA,UACF,QAAO;AAAA,UACP,aAAY;AAAA;AAAA,MACd;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA;AAAA;AACF;;;AD8BE,IAAAA,sBAAA;AAhBJ,IAAM,SAAS,CAAC;AAAA,EACd,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,OAAO;AAAA,EACP,UAAU;AAAA,EACV,GAAG;AACL,MAAmB;AACjB,SACE;AAAA,IAAC,cAAAC;AAAA,IAAA;AAAA,MACC,cAAY;AAAA,MACZ,eAAW,kBAAAC,SAAG,SAAS;AAAA,MACvB;AAAA,MACA,eAAa;AAAA,MACb,YAAY;AAAA,MACZ,YAAY,CAAC,EAAE,QAAQ,CAAC;AAAA,MACxB,WAAW;AAAA,MACX,SAAS;AAAA,MACT;AAAA,MACA,SAAS,6CAAC,0BAAe;AAAA,MACzB;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,QACA;AAAA;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,iBAAQ;","names":["import_jsx_runtime","NextButton","cn"]}

package/dist/Button/Button.js

@@ -1,8 +0,0 @@
-import {
-  Button_default
-} from "../chunk-6QVKZ4AT.js";
-import "../chunk-ZFEVTQWW.js";
-export {
-  Button_default as default
-};
-//# sourceMappingURL=Button.js.map

package/dist/Button/Button.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/Button/subcomponents/LoadingSpinner.cjs

@@ -1,57 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Button/subcomponents/LoadingSpinner.tsx
-var LoadingSpinner_exports = {};
-__export(LoadingSpinner_exports, {
-  default: () => LoadingSpinner_default
-});
-module.exports = __toCommonJS(LoadingSpinner_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
-var LoadingSpinner_default = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-  "svg",
-  {
-    className: "animate-spin h-5 w-5 text-current",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "circle",
-        {
-          className: "opacity-25",
-          cx: "12",
-          cy: "12",
-          r: "10",
-          stroke: "currentColor",
-          strokeWidth: "4"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "path",
-        {
-          className: "opacity-75",
-          d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z",
-          fill: "currentColor"
-        }
-      )
-    ]
-  }
-);
-//# sourceMappingURL=LoadingSpinner.cjs.map

package/dist/Button/subcomponents/LoadingSpinner.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/Button/subcomponents/LoadingSpinner.tsx"],"sourcesContent":["/**\n * svg loading spinner for button\n * @see https://nextui.org/docs/components/button#loading\n * */\nexport default () => (\n  <svg\n    className=\"animate-spin h-5 w-5 text-current\"\n    fill=\"none\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <circle\n      className=\"opacity-25\"\n      cx=\"12\"\n      cy=\"12\"\n      r=\"10\"\n      stroke=\"currentColor\"\n      strokeWidth=\"4\"\n    />\n    <path\n      className=\"opacity-75\"\n      d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKE;AADF,IAAO,yBAAQ,MACb;AAAA,EAAC;AAAA;AAAA,IACC,WAAU;AAAA,IACV,MAAK;AAAA,IACL,SAAQ;AAAA,IACR,OAAM;AAAA,IAEN;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAG;AAAA,UACH,IAAG;AAAA,UACH,GAAE;AAAA,UACF,QAAO;AAAA,UACP,aAAY;AAAA;AAAA,MACd;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA;AAAA;AACF;","names":[]}

package/dist/Button/subcomponents/LoadingSpinner.d.cts

@@ -1,9 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-
-/**
- * svg loading spinner for button
- * @see https://nextui.org/docs/components/button#loading
- * */
-declare const _default: () => react_jsx_runtime.JSX.Element;
-
-export { _default as default };

package/dist/Button/subcomponents/LoadingSpinner.d.ts

@@ -1,9 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-
-/**
- * svg loading spinner for button
- * @see https://nextui.org/docs/components/button#loading
- * */
-declare const _default: () => react_jsx_runtime.JSX.Element;
-
-export { _default as default };

package/dist/Button/subcomponents/LoadingSpinner.js

@@ -1,7 +0,0 @@
-import {
-  LoadingSpinner_default
-} from "../../chunk-ZFEVTQWW.js";
-export {
-  LoadingSpinner_default as default
-};
-//# sourceMappingURL=LoadingSpinner.js.map

package/dist/Button/subcomponents/LoadingSpinner.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}