@fuf-stack/pixels 1.2.5 → 1.3.1

package/dist/Menu/index.cjs

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunkYLJW375Ycjs = require('../chunk-YLJW375Y.cjs');
+var _chunkC43BKEAScjs = require('../chunk-C43BKEAS.cjs');
 require('../chunk-AHEA4IJV.cjs');
 
 
 
-exports.Menu = _chunkYLJW375Ycjs.Menu_default; exports.default = _chunkYLJW375Ycjs.Menu_default2;
+exports.Menu = _chunkC43BKEAScjs.Menu_default; exports.default = _chunkC43BKEAScjs.Menu_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/Menu/index.d.cts

@@ -1,5 +1,5 @@
-import { M as Menu } from '../Menu-CF5f9mfu.cjs';
-export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-CF5f9mfu.cjs';
+import { M as Menu } from '../Menu-DDKcN7N3.cjs';
+export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DDKcN7N3.cjs';
 import 'react/jsx-runtime';
 import 'tailwind-variants';
 import '@fuf-stack/pixel-utils';

package/dist/Menu/index.d.ts

@@ -1,5 +1,5 @@
-import { M as Menu } from '../Menu-CF5f9mfu.js';
-export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-CF5f9mfu.js';
+import { M as Menu } from '../Menu-DDKcN7N3.js';
+export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DDKcN7N3.js';
 import 'react/jsx-runtime';
 import 'tailwind-variants';
 import '@fuf-stack/pixel-utils';

package/dist/Menu/index.js

@@ -1,7 +1,7 @@
 import {
   Menu_default,
   Menu_default2
-} from "../chunk-324TSAWD.js";
+} from "../chunk-3VAWRUPR.js";
 import "../chunk-OAIRL2FN.js";
 export {
   Menu_default as Menu,

package/dist/{Menu-CF5f9mfu.d.cts → Menu-DDKcN7N3.d.cts}

@@ -6,7 +6,7 @@ import { DropdownItemProps, DropdownProps } from '@heroui/dropdown';
 import { ReactNode, Key } from 'react';
 
 /**
- * Menu item type
+ * Menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
  */
 interface MenuItem {
     /** unique identifier */

package/dist/{Menu-CF5f9mfu.d.ts → Menu-DDKcN7N3.d.ts}

@@ -6,7 +6,7 @@ import { DropdownItemProps, DropdownProps } from '@heroui/dropdown';
 import { ReactNode, Key } from 'react';
 
 /**
- * Menu item type
+ * Menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
  */
 interface MenuItem {
     /** unique identifier */

package/dist/Progress/index.cjs

@@ -2,12 +2,12 @@
 
 
 
-var _chunkIY2NXW6Xcjs = require('../chunk-IY2NXW6X.cjs');
-require('../chunk-OLI32URU.cjs');
+var _chunkKM3PZ3GHcjs = require('../chunk-KM3PZ3GH.cjs');
+require('../chunk-7ZIK4LWC.cjs');
 require('../chunk-AHEA4IJV.cjs');
 
 
 
 
-exports.Progress = _chunkIY2NXW6Xcjs.Progress_default; exports.default = _chunkIY2NXW6Xcjs.Progress_default2; exports.progressVariants = _chunkIY2NXW6Xcjs.progressVariants;
+exports.Progress = _chunkKM3PZ3GHcjs.Progress_default; exports.default = _chunkKM3PZ3GHcjs.Progress_default2; exports.progressVariants = _chunkKM3PZ3GHcjs.progressVariants;
 //# sourceMappingURL=index.cjs.map

package/dist/Progress/index.js

@@ -2,8 +2,8 @@ import {
   Progress_default,
   Progress_default2,
   progressVariants
-} from "../chunk-TYY3HIYL.js";
-import "../chunk-B3XKBNXD.js";
+} from "../chunk-EYUII2LV.js";
+import "../chunk-VTSVKRA7.js";
 import "../chunk-OAIRL2FN.js";
 export {
   Progress_default as Progress,

package/dist/ProgressCircular/index.cjs

@@ -2,12 +2,12 @@
 
 
 
-var _chunkAZ7VMRHXcjs = require('../chunk-AZ7VMRHX.cjs');
-require('../chunk-OLI32URU.cjs');
+var _chunkRZGLEDWNcjs = require('../chunk-RZGLEDWN.cjs');
+require('../chunk-7ZIK4LWC.cjs');
 require('../chunk-AHEA4IJV.cjs');
 
 
 
 
-exports.ProgressCircular = _chunkAZ7VMRHXcjs.ProgressCircular_default; exports.default = _chunkAZ7VMRHXcjs.ProgressCircular_default2; exports.progressCircularVariants = _chunkAZ7VMRHXcjs.progressCircularVariants;
+exports.ProgressCircular = _chunkRZGLEDWNcjs.ProgressCircular_default; exports.default = _chunkRZGLEDWNcjs.ProgressCircular_default2; exports.progressCircularVariants = _chunkRZGLEDWNcjs.progressCircularVariants;
 //# sourceMappingURL=index.cjs.map

package/dist/ProgressCircular/index.js

@@ -2,8 +2,8 @@ import {
   ProgressCircular_default,
   ProgressCircular_default2,
   progressCircularVariants
-} from "../chunk-2O3IUQR4.js";
-import "../chunk-B3XKBNXD.js";
+} from "../chunk-FFNMGR72.js";
+import "../chunk-VTSVKRA7.js";
 import "../chunk-OAIRL2FN.js";
 export {
   ProgressCircular_default as ProgressCircular,

package/dist/SearchInput/index.cjs

@@ -0,0 +1,69 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});require('../chunk-AHEA4IJV.cjs');
+
+// src/SearchInput/SearchInput.tsx
+var _fa = require('react-icons/fa');
+var _input = require('@heroui/input');
+var _pixelutils = require('@fuf-stack/pixel-utils');
+var _jsxruntime = require('react/jsx-runtime');
+var inputVariants = _pixelutils.tv.call(void 0, {
+  slots: {
+    /** wrapper around the whole input */
+    base: "",
+    /** clear button */
+    clearButton: "",
+    /** actual input element */
+    input: "",
+    /** inner wrapper (HeroUI inputWrapper slot) */
+    inputWrapper: "bg-content1 group-data-[focus=true]:border-focus"
+  }
+});
+var SearchInput = ({
+  className: _className = void 0,
+  disabled = false,
+  endContent = void 0,
+  onChange,
+  placeholder = void 0,
+  size = void 0,
+  startContent = void 0,
+  testId = void 0,
+  initialValue = void 0
+}) => {
+  const variants = inputVariants();
+  const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, _className, "base");
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _input.Input,
+    {
+      isClearable: true,
+      "data-testid": testId ? _pixelutils.slugify.call(void 0, testId) : void 0,
+      defaultValue: initialValue,
+      endContent,
+      isDisabled: disabled,
+      placeholder,
+      radius: "sm",
+      size,
+      startContent: startContent != null ? startContent : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa.FaSearch, { className: "opacity-50" }),
+      variant: "bordered",
+      classNames: {
+        base: classNames.base,
+        clearButton: classNames.clearButton,
+        input: classNames.input,
+        inputWrapper: classNames.inputWrapper
+      },
+      onChange: (e) => {
+        onChange(e.target.value);
+      },
+      onClear: () => {
+        onChange(null);
+      }
+    }
+  );
+};
+var SearchInput_default = SearchInput;
+
+// src/SearchInput/index.ts
+var SearchInput_default2 = SearchInput_default;
+
+
+
+exports.SearchInput = SearchInput_default; exports.default = SearchInput_default2;
+//# sourceMappingURL=index.cjs.map

package/dist/SearchInput/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/SearchInput/index.cjs","../../src/SearchInput/SearchInput.tsx","../../src/SearchInput/index.ts"],"names":["SearchInput_default"],"mappings":"AAAA,0GAA8B;AAC9B;AACA;ACCA,oCAAyB;AAEzB,sCAAmC;AAEnC,oDAAkD;AAoEd,+CAAA;AAjE7B,IAAM,cAAA,EAAgB,4BAAA;AAAG,EAC9B,KAAA,EAAO;AAAA;AAAA,IAEL,IAAA,EAAM,EAAA;AAAA;AAAA,IAEN,WAAA,EAAa,EAAA;AAAA;AAAA,IAEb,KAAA,EAAO,EAAA;AAAA;AAAA,IAEP,YAAA,EAAc;AAAA,EAChB;AACF,CAAC,CAAA;AA6BD,IAAM,YAAA,EAAc,CAAC;AAAA,EACnB,SAAA,EAAW,WAAA,EAAa,KAAA,CAAA;AAAA,EACxB,SAAA,EAAW,KAAA;AAAA,EACX,WAAA,EAAa,KAAA,CAAA;AAAA,EACb,QAAA;AAAA,EACA,YAAA,EAAc,KAAA,CAAA;AAAA,EACd,KAAA,EAAO,KAAA,CAAA;AAAA,EACP,aAAA,EAAe,KAAA,CAAA;AAAA,EACf,OAAA,EAAS,KAAA,CAAA;AAAA,EACT,aAAA,EAAe,KAAA;AACjB,CAAA,EAAA,GAAwB;AAEtB,EAAA,MAAM,SAAA,EAAW,aAAA,CAAc,CAAA;AAC/B,EAAA,MAAM,WAAA,EAAa,8CAAA,QAAqB,EAAU,UAAA,EAAY,MAAM,CAAA;AAEpE,EAAA,uBACE,6BAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAW,IAAA;AAAA,MACX,aAAA,EAAa,OAAA,EAAS,iCAAA,MAAc,EAAA,EAAI,KAAA,CAAA;AAAA,MACxC,YAAA,EAAc,YAAA;AAAA,MACd,UAAA;AAAA,MACA,UAAA,EAAY,QAAA;AAAA,MACZ,WAAA;AAAA,MACA,MAAA,EAAO,IAAA;AAAA,MACP,IAAA;AAAA,MACA,YAAA,EAAc,aAAA,GAAA,KAAA,EAAA,aAAA,kBAAgB,6BAAA,YAAC,EAAA,EAAS,SAAA,EAAU,aAAA,CAAa,CAAA;AAAA,MAC/D,OAAA,EAAQ,UAAA;AAAA,MACR,UAAA,EAAY;AAAA,QACV,IAAA,EAAM,UAAA,CAAW,IAAA;AAAA,QACjB,WAAA,EAAa,UAAA,CAAW,WAAA;AAAA,QACxB,KAAA,EAAO,UAAA,CAAW,KAAA;AAAA,QAClB,YAAA,EAAc,UAAA,CAAW;AAAA,MAC3B,CAAA;AAAA,MACA,QAAA,EAAU,CAAC,CAAA,EAAA,GAAM;AACf,QAAA,QAAA,CAAS,CAAA,CAAE,MAAA,CAAO,KAAK,CAAA;AAAA,MACzB,CAAA;AAAA,MACA,OAAA,EAAS,CAAA,EAAA,GAAM;AACb,QAAA,QAAA,CAAS,IAAI,CAAA;AAAA,MACf;AAAA,IAAA;AAAA,EACF,CAAA;AAEJ,CAAA;AAEA,IAAO,oBAAA,EAAQ,WAAA;ADhCf;AACA;AExDA,IAAOA,qBAAAA,EAAQ,mBAAA;AF0Df;AACE;AACA;AACF,kFAAC","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/SearchInput/index.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { FaSearch } from 'react-icons/fa';\n\nimport { Input as HeroInput } from '@heroui/input';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// input variants\nexport const inputVariants = tv({\n  slots: {\n    /** wrapper around the whole input */\n    base: '',\n    /** clear button */\n    clearButton: '',\n    /** actual input element */\n    input: '',\n    /** inner wrapper (HeroUI inputWrapper slot) */\n    inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n  },\n});\n\ntype VariantProps = TVProps<typeof inputVariants>;\ntype ClassName = TVClassName<typeof inputVariants>;\n\nexport interface SearchInputProps extends VariantProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** input field is disabled */\n  disabled?: boolean;\n  /** added content to the end of the input Field. */\n  endContent?: ReactNode;\n  /** optional initial value of the input */\n  initialValue?: string;\n  /** callback that is fired when the value is changed or cleared */\n  onChange: (value: string | null) => void;\n  /** form field placeholder */\n  placeholder?: string;\n  /** size of the input */\n  size?: 'sm' | 'md' | 'lg';\n  /** content added to the start of the input field */\n  startContent?: ReactNode;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * SearchInput component based on [HeroUI Input](https://www.heroui.com//docs/components/input)\n */\nconst SearchInput = ({\n  className: _className = undefined,\n  disabled = false,\n  endContent = undefined,\n  onChange,\n  placeholder = undefined,\n  size = undefined,\n  startContent = undefined,\n  testId = undefined,\n  initialValue = undefined,\n}: SearchInputProps) => {\n  // classNames from slots\n  const variants = inputVariants();\n  const classNames = variantsToClassNames(variants, _className, 'base');\n\n  return (\n    <HeroInput\n      isClearable\n      data-testid={testId ? slugify(testId) : undefined}\n      defaultValue={initialValue}\n      endContent={endContent}\n      isDisabled={disabled}\n      placeholder={placeholder}\n      radius=\"sm\"\n      size={size}\n      startContent={startContent ?? <FaSearch className=\"opacity-50\" />}\n      variant=\"bordered\"\n      classNames={{\n        base: classNames.base,\n        clearButton: classNames.clearButton,\n        input: classNames.input,\n        inputWrapper: classNames.inputWrapper,\n      }}\n      onChange={(e) => {\n        onChange(e.target.value);\n      }}\n      onClear={() => {\n        onChange(null);\n      }}\n    />\n  );\n};\n\nexport default SearchInput;\n","import SearchInput from './SearchInput';\n\nexport type { SearchInputProps } from './SearchInput';\n\nexport { SearchInput };\n\nexport default SearchInput;\n"]}

package/dist/SearchInput/index.d.cts

@@ -0,0 +1,88 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as tailwind_variants from 'tailwind-variants';
+import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
+import { ReactNode } from 'react';
+
+declare const inputVariants: tailwind_variants.TVReturnType<{
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            base?: tailwind_variants.ClassValue;
+            clearButton?: tailwind_variants.ClassValue;
+            input?: tailwind_variants.ClassValue;
+            inputWrapper?: tailwind_variants.ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: tailwind_variants.ClassValue | {
+            base?: tailwind_variants.ClassValue;
+            clearButton?: tailwind_variants.ClassValue;
+            input?: tailwind_variants.ClassValue;
+            inputWrapper?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    /** wrapper around the whole input */
+    base: string;
+    /** clear button */
+    clearButton: string;
+    /** actual input element */
+    input: string;
+    /** inner wrapper (HeroUI inputWrapper slot) */
+    inputWrapper: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            base?: tailwind_variants.ClassValue;
+            clearButton?: tailwind_variants.ClassValue;
+            input?: tailwind_variants.ClassValue;
+            inputWrapper?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    /** wrapper around the whole input */
+    base: string;
+    /** clear button */
+    clearButton: string;
+    /** actual input element */
+    input: string;
+    /** inner wrapper (HeroUI inputWrapper slot) */
+    inputWrapper: string;
+}, tailwind_variants.TVReturnType<unknown, {
+    /** wrapper around the whole input */
+    base: string;
+    /** clear button */
+    clearButton: string;
+    /** actual input element */
+    input: string;
+    /** inner wrapper (HeroUI inputWrapper slot) */
+    inputWrapper: string;
+}, undefined, unknown, unknown, undefined>>;
+type VariantProps = TVProps<typeof inputVariants>;
+type ClassName = TVClassName<typeof inputVariants>;
+interface SearchInputProps extends VariantProps {
+    /** CSS class name */
+    className?: ClassName;
+    /** input field is disabled */
+    disabled?: boolean;
+    /** added content to the end of the input Field. */
+    endContent?: ReactNode;
+    /** optional initial value of the input */
+    initialValue?: string;
+    /** callback that is fired when the value is changed or cleared */
+    onChange: (value: string | null) => void;
+    /** form field placeholder */
+    placeholder?: string;
+    /** size of the input */
+    size?: 'sm' | 'md' | 'lg';
+    /** content added to the start of the input field */
+    startContent?: ReactNode;
+    /** HTML data-testid attribute used in e2e tests */
+    testId?: string;
+}
+/**
+ * SearchInput component based on [HeroUI Input](https://www.heroui.com//docs/components/input)
+ */
+declare const SearchInput: ({ className: _className, disabled, endContent, onChange, placeholder, size, startContent, testId, initialValue, }: SearchInputProps) => react_jsx_runtime.JSX.Element;
+
+export { SearchInput, type SearchInputProps, SearchInput as default };

package/dist/SearchInput/index.d.ts

@@ -0,0 +1,88 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as tailwind_variants from 'tailwind-variants';
+import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
+import { ReactNode } from 'react';
+
+declare const inputVariants: tailwind_variants.TVReturnType<{
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            base?: tailwind_variants.ClassValue;
+            clearButton?: tailwind_variants.ClassValue;
+            input?: tailwind_variants.ClassValue;
+            inputWrapper?: tailwind_variants.ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: tailwind_variants.ClassValue | {
+            base?: tailwind_variants.ClassValue;
+            clearButton?: tailwind_variants.ClassValue;
+            input?: tailwind_variants.ClassValue;
+            inputWrapper?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    /** wrapper around the whole input */
+    base: string;
+    /** clear button */
+    clearButton: string;
+    /** actual input element */
+    input: string;
+    /** inner wrapper (HeroUI inputWrapper slot) */
+    inputWrapper: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            base?: tailwind_variants.ClassValue;
+            clearButton?: tailwind_variants.ClassValue;
+            input?: tailwind_variants.ClassValue;
+            inputWrapper?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    /** wrapper around the whole input */
+    base: string;
+    /** clear button */
+    clearButton: string;
+    /** actual input element */
+    input: string;
+    /** inner wrapper (HeroUI inputWrapper slot) */
+    inputWrapper: string;
+}, tailwind_variants.TVReturnType<unknown, {
+    /** wrapper around the whole input */
+    base: string;
+    /** clear button */
+    clearButton: string;
+    /** actual input element */
+    input: string;
+    /** inner wrapper (HeroUI inputWrapper slot) */
+    inputWrapper: string;
+}, undefined, unknown, unknown, undefined>>;
+type VariantProps = TVProps<typeof inputVariants>;
+type ClassName = TVClassName<typeof inputVariants>;
+interface SearchInputProps extends VariantProps {
+    /** CSS class name */
+    className?: ClassName;
+    /** input field is disabled */
+    disabled?: boolean;
+    /** added content to the end of the input Field. */
+    endContent?: ReactNode;
+    /** optional initial value of the input */
+    initialValue?: string;
+    /** callback that is fired when the value is changed or cleared */
+    onChange: (value: string | null) => void;
+    /** form field placeholder */
+    placeholder?: string;
+    /** size of the input */
+    size?: 'sm' | 'md' | 'lg';
+    /** content added to the start of the input field */
+    startContent?: ReactNode;
+    /** HTML data-testid attribute used in e2e tests */
+    testId?: string;
+}
+/**
+ * SearchInput component based on [HeroUI Input](https://www.heroui.com//docs/components/input)
+ */
+declare const SearchInput: ({ className: _className, disabled, endContent, onChange, placeholder, size, startContent, testId, initialValue, }: SearchInputProps) => react_jsx_runtime.JSX.Element;
+
+export { SearchInput, type SearchInputProps, SearchInput as default };

package/dist/SearchInput/index.js

@@ -0,0 +1,69 @@
+import "../chunk-OAIRL2FN.js";
+
+// src/SearchInput/SearchInput.tsx
+import { FaSearch } from "react-icons/fa";
+import { Input as HeroInput } from "@heroui/input";
+import { slugify, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
+import { jsx } from "react/jsx-runtime";
+var inputVariants = tv({
+  slots: {
+    /** wrapper around the whole input */
+    base: "",
+    /** clear button */
+    clearButton: "",
+    /** actual input element */
+    input: "",
+    /** inner wrapper (HeroUI inputWrapper slot) */
+    inputWrapper: "bg-content1 group-data-[focus=true]:border-focus"
+  }
+});
+var SearchInput = ({
+  className: _className = void 0,
+  disabled = false,
+  endContent = void 0,
+  onChange,
+  placeholder = void 0,
+  size = void 0,
+  startContent = void 0,
+  testId = void 0,
+  initialValue = void 0
+}) => {
+  const variants = inputVariants();
+  const classNames = variantsToClassNames(variants, _className, "base");
+  return /* @__PURE__ */ jsx(
+    HeroInput,
+    {
+      isClearable: true,
+      "data-testid": testId ? slugify(testId) : void 0,
+      defaultValue: initialValue,
+      endContent,
+      isDisabled: disabled,
+      placeholder,
+      radius: "sm",
+      size,
+      startContent: startContent != null ? startContent : /* @__PURE__ */ jsx(FaSearch, { className: "opacity-50" }),
+      variant: "bordered",
+      classNames: {
+        base: classNames.base,
+        clearButton: classNames.clearButton,
+        input: classNames.input,
+        inputWrapper: classNames.inputWrapper
+      },
+      onChange: (e) => {
+        onChange(e.target.value);
+      },
+      onClear: () => {
+        onChange(null);
+      }
+    }
+  );
+};
+var SearchInput_default = SearchInput;
+
+// src/SearchInput/index.ts
+var SearchInput_default2 = SearchInput_default;
+export {
+  SearchInput_default as SearchInput,
+  SearchInput_default2 as default
+};
+//# sourceMappingURL=index.js.map

package/dist/SearchInput/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/SearchInput/SearchInput.tsx","../../src/SearchInput/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { FaSearch } from 'react-icons/fa';\n\nimport { Input as HeroInput } from '@heroui/input';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// input variants\nexport const inputVariants = tv({\n  slots: {\n    /** wrapper around the whole input */\n    base: '',\n    /** clear button */\n    clearButton: '',\n    /** actual input element */\n    input: '',\n    /** inner wrapper (HeroUI inputWrapper slot) */\n    inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n  },\n});\n\ntype VariantProps = TVProps<typeof inputVariants>;\ntype ClassName = TVClassName<typeof inputVariants>;\n\nexport interface SearchInputProps extends VariantProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** input field is disabled */\n  disabled?: boolean;\n  /** added content to the end of the input Field. */\n  endContent?: ReactNode;\n  /** optional initial value of the input */\n  initialValue?: string;\n  /** callback that is fired when the value is changed or cleared */\n  onChange: (value: string | null) => void;\n  /** form field placeholder */\n  placeholder?: string;\n  /** size of the input */\n  size?: 'sm' | 'md' | 'lg';\n  /** content added to the start of the input field */\n  startContent?: ReactNode;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * SearchInput component based on [HeroUI Input](https://www.heroui.com//docs/components/input)\n */\nconst SearchInput = ({\n  className: _className = undefined,\n  disabled = false,\n  endContent = undefined,\n  onChange,\n  placeholder = undefined,\n  size = undefined,\n  startContent = undefined,\n  testId = undefined,\n  initialValue = undefined,\n}: SearchInputProps) => {\n  // classNames from slots\n  const variants = inputVariants();\n  const classNames = variantsToClassNames(variants, _className, 'base');\n\n  return (\n    <HeroInput\n      isClearable\n      data-testid={testId ? slugify(testId) : undefined}\n      defaultValue={initialValue}\n      endContent={endContent}\n      isDisabled={disabled}\n      placeholder={placeholder}\n      radius=\"sm\"\n      size={size}\n      startContent={startContent ?? <FaSearch className=\"opacity-50\" />}\n      variant=\"bordered\"\n      classNames={{\n        base: classNames.base,\n        clearButton: classNames.clearButton,\n        input: classNames.input,\n        inputWrapper: classNames.inputWrapper,\n      }}\n      onChange={(e) => {\n        onChange(e.target.value);\n      }}\n      onClear={() => {\n        onChange(null);\n      }}\n    />\n  );\n};\n\nexport default SearchInput;\n","import SearchInput from './SearchInput';\n\nexport type { SearchInputProps } from './SearchInput';\n\nexport { SearchInput };\n\nexport default SearchInput;\n"],"mappings":";;;AAGA,SAAS,gBAAgB;AAEzB,SAAS,SAAS,iBAAiB;AAEnC,SAAS,SAAS,IAAI,4BAA4B;AAoEd;AAjE7B,IAAM,gBAAgB,GAAG;AAAA,EAC9B,OAAO;AAAA;AAAA,IAEL,MAAM;AAAA;AAAA,IAEN,aAAa;AAAA;AAAA,IAEb,OAAO;AAAA;AAAA,IAEP,cAAc;AAAA,EAChB;AACF,CAAC;AA6BD,IAAM,cAAc,CAAC;AAAA,EACnB,WAAW,aAAa;AAAA,EACxB,WAAW;AAAA,EACX,aAAa;AAAA,EACb;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,eAAe;AAAA,EACf,SAAS;AAAA,EACT,eAAe;AACjB,MAAwB;AAEtB,QAAM,WAAW,cAAc;AAC/B,QAAM,aAAa,qBAAqB,UAAU,YAAY,MAAM;AAEpE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAW;AAAA,MACX,eAAa,SAAS,QAAQ,MAAM,IAAI;AAAA,MACxC,cAAc;AAAA,MACd;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,MACA,QAAO;AAAA,MACP;AAAA,MACA,cAAc,sCAAgB,oBAAC,YAAS,WAAU,cAAa;AAAA,MAC/D,SAAQ;AAAA,MACR,YAAY;AAAA,QACV,MAAM,WAAW;AAAA,QACjB,aAAa,WAAW;AAAA,QACxB,OAAO,WAAW;AAAA,QAClB,cAAc,WAAW;AAAA,MAC3B;AAAA,MACA,UAAU,CAAC,MAAM;AACf,iBAAS,EAAE,OAAO,KAAK;AAAA,MACzB;AAAA,MACA,SAAS,MAAM;AACb,iBAAS,IAAI;AAAA,MACf;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,sBAAQ;;;ACvFf,IAAOA,uBAAQ;","names":["SearchInput_default"]}

package/dist/{chunk-324TSAWD.js → chunk-3VAWRUPR.js}

@@ -1,10 +1,10 @@
 import {
+  __objRest,
   __spreadProps,
   __spreadValues
 } from "./chunk-OAIRL2FN.js";
 
 // src/Menu/Menu.tsx
-import { FaEllipsisVertical } from "react-icons/fa6";
 import { Button } from "@heroui/button";
 import {
   Dropdown as HeroDropdown,
@@ -14,25 +14,71 @@ import {
   DropdownTrigger as HeroDropdownTrigger
 } from "@heroui/dropdown";
 import { cn, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
-import { jsx, jsxs } from "react/jsx-runtime";
+
+// src/Menu/VerticalDotsIcon.tsx
+import { jsx } from "react/jsx-runtime";
+var VerticalDotsIcon = (_a) => {
+  var _b = _a, {
+    size = 24,
+    width,
+    height
+  } = _b, props = __objRest(_b, [
+    "size",
+    "width",
+    "height"
+  ]);
+  return /* @__PURE__ */ jsx(
+    "svg",
+    __spreadProps(__spreadValues({
+      "aria-hidden": "true",
+      fill: "none",
+      focusable: "false",
+      height: size != null ? size : height,
+      role: "presentation",
+      viewBox: "0 0 24 24",
+      width: size != null ? size : width
+    }, props), {
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M12 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 12c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z",
+          fill: "currentColor"
+        }
+      )
+    })
+  );
+};
+var VerticalDotsIcon_default = VerticalDotsIcon;
+
+// src/Menu/Menu.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
 var menuVariants = tv({
   slots: {
     item: "",
     trigger: ""
   }
 });
+var isMenuSection = (item) => {
+  return "items" in item;
+};
 var getDisabledKeys = (items) => {
-  return items.map((item) => {
-    return typeof (item == null ? void 0 : item.items) === "undefined" ? item : item.items;
-  }).flat().filter((item) => {
-    return Object.hasOwn(item, "disabled") && item.disabled === true;
+  const flatItems = items.reduce((acc, item) => {
+    if (isMenuSection(item)) {
+      acc.push(...item.items);
+    } else {
+      acc.push(item);
+    }
+    return acc;
+  }, []);
+  return flatItems.filter((item) => {
+    return item.disabled === true;
   }).map((item) => {
     return item.key;
   });
 };
 var renderMenuItem = (item, itemClassName) => {
   var _a;
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx2(
     HeroDropdownItem,
     {
       className: cn(itemClassName, item.className),
@@ -58,20 +104,22 @@ var Menu = ({
 }) => {
   const variants = menuVariants();
   const className = variantsToClassNames(variants, _className, "trigger");
-  let triggerButton = /* @__PURE__ */ jsx("button", { className: className.trigger, type: "button", children });
+  let triggerButton = /* @__PURE__ */ jsx2("button", { className: className.trigger, type: "button", children });
   if (!children) {
-    triggerButton = /* @__PURE__ */ jsx(
+    triggerButton = /* @__PURE__ */ jsx2(
       Button,
       __spreadProps(__spreadValues({
-        className: cn("min-w-0", className.trigger),
+        isIconOnly: true,
+        className: cn("outline-divider min-w-0 outline", className.trigger),
+        radius: "full",
         size: "sm",
-        variant: "flat"
+        variant: "light"
       }, triggerButtonProps), {
-        children: /* @__PURE__ */ jsx(FaEllipsisVertical, {})
+        children: /* @__PURE__ */ jsx2(VerticalDotsIcon_default, {})
       })
     );
   } else if (triggerButtonProps) {
-    triggerButton = /* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({ className: className.trigger }, triggerButtonProps), { children }));
+    triggerButton = /* @__PURE__ */ jsx2(Button, __spreadProps(__spreadValues({ className: className.trigger }, triggerButtonProps), { children }));
   }
   return /* @__PURE__ */ jsxs(
     HeroDropdown,
@@ -80,8 +128,8 @@ var Menu = ({
       isDisabled,
       placement,
       children: [
-        /* @__PURE__ */ jsx(HeroDropdownTrigger, { "data-testid": testId, children: triggerButton }),
-        /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx2(HeroDropdownTrigger, { "data-testid": testId, children: triggerButton }),
+        /* @__PURE__ */ jsx2(
           HeroDropdownMenu,
           {
             disabledKeys: getDisabledKeys(items),
@@ -89,7 +137,7 @@ var Menu = ({
             onAction,
             children: (item) => {
               if ("items" in item) {
-                return /* @__PURE__ */ jsx(
+                return /* @__PURE__ */ jsx2(
                   HeroDropdownSection,
                   {
                     items: item.items,
@@ -118,4 +166,4 @@ export {
   Menu_default,
   Menu_default2
 };
-//# sourceMappingURL=chunk-324TSAWD.js.map
+//# sourceMappingURL=chunk-3VAWRUPR.js.map

package/dist/chunk-3VAWRUPR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Menu/Menu.tsx","../src/Menu/VerticalDotsIcon.tsx","../src/Menu/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ButtonProps } from '@heroui/button';\nimport type {\n  DropdownItemProps as HeroDropdownItemProps,\n  DropdownProps as HeroDropdownProps,\n  DropdownSectionProps as HeroDropdownSectionProps,\n} from '@heroui/dropdown';\nimport type { Key, ReactNode } from 'react';\n\nimport { Button } from '@heroui/button';\nimport {\n  Dropdown as HeroDropdown,\n  DropdownItem as HeroDropdownItem,\n  DropdownMenu as HeroDropdownMenu,\n  DropdownSection as HeroDropdownSection,\n  DropdownTrigger as HeroDropdownTrigger,\n} from '@heroui/dropdown';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport VerticalDotsIcon from './VerticalDotsIcon';\n\n/**\n * Menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: HeroDropdownItemProps['onPress'];\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\n// menu styling variants\nexport const menuVariants = tv({\n  slots: {\n    item: '',\n    trigger: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof menuVariants>;\ntype ClassName = TVClassName<typeof menuVariants>;\n\nexport interface MenuProps extends VariantProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: ClassName;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** placement of the menu */\n  placement?: HeroDropdownProps['placement'];\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */\n  triggerButtonProps?: Pick<\n    ButtonProps,\n    | 'aria-label'\n    | 'className'\n    | 'color'\n    | 'disableAnimation'\n    | 'disableRipple'\n    | 'disabled'\n    | 'size'\n    | 'variant'\n  >;\n}\n\n// type guard for MenuSection\nconst isMenuSection = (item: MenuSection | MenuItem): item is MenuSection => {\n  return 'items' in item;\n};\n\n// returns String[] of disabled items/keys\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]): string[] => {\n  const flatItems = items.reduce<MenuItem[]>((acc, item) => {\n    if (isMenuSection(item)) {\n      acc.push(...item.items);\n    } else {\n      acc.push(item);\n    }\n    return acc;\n  }, []);\n  return flatItems\n    .filter((item) => {\n      return item.disabled === true;\n    })\n    .map((item) => {\n      return item.key;\n    });\n};\n\nconst renderMenuItem = (item: MenuItem, itemClassName?: string) => {\n  return (\n    <HeroDropdownItem\n      key={item.key}\n      className={cn(itemClassName, item.className)}\n      data-testid={item.testId ?? item.key}\n      description={item.description}\n      onPress={item.onClick}\n      startContent={item.icon}\n    >\n      {item.label}\n    </HeroDropdownItem>\n  );\n};\n\n/**\n * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)\n */\nconst Menu = ({\n  ariaLabel = undefined,\n  children = null,\n  className: _className = undefined,\n  isDisabled = false,\n  items,\n  onAction = undefined,\n  placement = undefined,\n  testId = undefined,\n  triggerButtonProps = undefined,\n}: MenuProps) => {\n  // className from slots\n  const variants = menuVariants();\n  const className = variantsToClassNames(variants, _className, 'trigger');\n\n  // determine trigger button variant\n  let triggerButton = (\n    <button className={className.trigger} type=\"button\">\n      {children}\n    </button>\n  );\n  if (!children) {\n    //  default to ellipsis icon when no children are provided\n    triggerButton = (\n      <Button\n        isIconOnly\n        className={cn('outline-divider min-w-0 outline', className.trigger)}\n        radius=\"full\"\n        size=\"sm\"\n        variant=\"light\"\n        {...triggerButtonProps}\n      >\n        <VerticalDotsIcon />\n      </Button>\n    );\n  } else if (triggerButtonProps) {\n    // use provided triggerButtonProps with hero button\n    triggerButton = (\n      <Button className={className.trigger} {...triggerButtonProps}>\n        {children}\n      </Button>\n    );\n  }\n\n  return (\n    <HeroDropdown\n      aria-label={ariaLabel}\n      isDisabled={isDisabled}\n      placement={placement}\n    >\n      <HeroDropdownTrigger data-testid={testId}>\n        {/* NOTE: type and aria properties are injected by HeroDropdownTrigger */}\n        {triggerButton}\n      </HeroDropdownTrigger>\n      <HeroDropdownMenu\n        disabledKeys={getDisabledKeys(items)}\n        items={items}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <HeroDropdownSection\n                key={item.key}\n                items={item.items}\n                title={item.label as HeroDropdownSectionProps['title']}\n              >\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem, className.item);\n                }}\n              </HeroDropdownSection>\n            );\n          }\n          return renderMenuItem(item, className.item);\n        }}\n      </HeroDropdownMenu>\n    </HeroDropdown>\n  );\n};\n\nexport default Menu;\n","import type { SVGProps } from 'react';\n\n// Default Icon for Menu button\nconst VerticalDotsIcon = ({\n  size = 24,\n  width,\n  height,\n  ...props\n}: SVGProps<SVGSVGElement> & { size?: number }) => {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      fill=\"none\"\n      focusable=\"false\"\n      height={size ?? height}\n      role=\"presentation\"\n      viewBox=\"0 0 24 24\"\n      width={size ?? width}\n      {...props}\n    >\n      <path\n        d=\"M12 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 12c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  );\n};\n\nexport default VerticalDotsIcon;\n","import Menu from './Menu';\n\nexport type { MenuProps, MenuItem, MenuSection } from './Menu';\n\nexport { Menu };\n\nexport default Menu;\n"],"mappings":"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","names":["jsx","Menu_default"]}

package/dist/{chunk-OLI32URU.cjs → chunk-7ZIK4LWC.cjs}

@@ -80,4 +80,4 @@ var useLocalStorage = (key, initialValue) => {
 
 
 exports.useDebounce = useDebounce; exports.useIsInitialRenderCycle = useIsInitialRenderCycle; exports.useLocalStorage = useLocalStorage;
-//# sourceMappingURL=chunk-OLI32URU.cjs.map
+//# sourceMappingURL=chunk-7ZIK4LWC.cjs.map

package/dist/chunk-7ZIK4LWC.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-7ZIK4LWC.cjs","../src/hooks/useDebounce.ts","../src/hooks/useIsInitialRenderCycle.ts","../src/hooks/useLocalStorage.ts"],"names":["useEffect","useState"],"mappings":"AAAA;ACEA,8BAAoC;AAE7B,IAAM,YAAA,EAAc,CAAQ,KAAA,EAAc,KAAA,EAAA,GAAkB;AAEjE,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,EAAA,EAAI,6BAAA,KAAc,CAAA;AAC1D,EAAA,8BAAA;AAAA,IACE,CAAA,EAAA,GAAM;AAEJ,MAAA,MAAM,QAAA,EAAU,UAAA,CAAW,CAAA,EAAA,GAAM;AAC/B,QAAA,iBAAA,CAAkB,KAAK,CAAA;AAAA,MACzB,CAAA,EAAG,KAAK,CAAA;AAIR,MAAA,OAAO,CAAA,EAAA,GAAM;AACX,QAAA,YAAA,CAAa,OAAO,CAAA;AAAA,MACtB,CAAA;AAAA,IACF,CAAA;AAAA,IACA,CAAC,KAAA,EAAO,KAAK;AAAA;AAAA,EACf,CAAA;AACA,EAAA,OAAO,cAAA;AACT,CAAA;ADLA;AACA;AEjBA;AAOO,IAAM,wBAAA,EAA0B,CAAA,EAAA,GAAe;AAEpD,EAAA,MAAM,gBAAA,EAAkB,2BAAA,IAAW,CAAA;AAGnC,EAAAA,8BAAAA,CAAU,EAAA,GAAM;AAEd,IAAA,eAAA,CAAgB,QAAA,EAAU,KAAA;AAAA,EAG5B,CAAA,EAAG,CAAC,CAAC,CAAA;AAEL,EAAA,OAAO,eAAA,CAAgB,OAAA;AACzB,CAAA;AFMA;AACA;AGzBA;AAEO,IAAM,gBAAA,EAAkB,CAC7B,GAAA,EACA,YAAA,EAAA,GACqC;AAGrC,EAAA,MAAM,UAAA,EAAY,CAAA,EAAA,GAAM;AAEtB,IAAA,GAAA,CAAI,OAAO,OAAA,IAAW,WAAA,EAAa;AACjC,MAAA,OAAO,YAAA;AAAA,IACT;AAEA,IAAA,IAAI;AACF,MAAA,MAAM,KAAA,EAAO,MAAA,CAAO,YAAA,CAAa,OAAA,CAAQ,GAAG,CAAA;AAC5C,MAAA,OAAO,KAAA,EAAO,IAAA,CAAK,KAAA,CAAM,IAAI,EAAA,EAAI,YAAA;AAAA,IACnC,EAAA,MAAA,CAAS,KAAA,EAAO;AACd,MAAA,OAAA,CAAQ,IAAA,CAAK,CAAA,qCAAA,EAAmC,GAAG,CAAA,OAAA,CAAA,EAAM,KAAK,CAAA;AAC9D,MAAA,OAAO,YAAA;AAAA,IACT;AAAA,EACF,CAAA;AAIA,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,EAAA,EAAIC,6BAAAA,SAAqB,CAAA;AAI3D,EAAA,MAAM,SAAA,EAAwC,CAAC,KAAA,EAAA,GAAU;AAEvD,IAAA,GAAA,CAAI,OAAO,OAAA,IAAW,WAAA,EAAa;AACjC,MAAA,OAAA,CAAQ,IAAA;AAAA,QACN,CAAA,qCAAA,EAAmC,GAAG,CAAA,8CAAA;AAAA,MACxC,CAAA;AAAA,IACF;AAEA,IAAA,IAAI;AAEF,MAAA,MAAM,SAAA,EAAW,MAAA,WAAiB,SAAA,EAAW,KAAA,CAAM,WAAW,EAAA,EAAI,KAAA;AAGlE,MAAA,MAAA,CAAO,YAAA,CAAa,OAAA,CAAQ,GAAA,EAAK,IAAA,CAAK,SAAA,CAAU,QAAQ,CAAC,CAAA;AAGzD,MAAA,cAAA,CAAe,QAAQ,CAAA;AAGvB,MAAA,MAAA,CAAO,aAAA,CAAc,IAAI,KAAA,CAAM,eAAe,CAAC,CAAA;AAAA,IACjD,EAAA,MAAA,CAAS,KAAA,EAAO;AACd,MAAA,OAAA,CAAQ,IAAA,CAAK,CAAA,qCAAA,EAAmC,GAAG,CAAA,OAAA,CAAA,EAAM,KAAK,CAAA;AAAA,IAChE;AAAA,EACF,CAAA;AAEA,EAAAD,8BAAAA,CAAU,EAAA,GAAM;AACd,IAAA,cAAA,CAAe,SAAA,CAAU,CAAC,CAAA;AAAA,EAE5B,CAAA,EAAG,CAAC,CAAC,CAAA;AAEL,EAAAA,8BAAAA,CAAU,EAAA,GAAM;AACd,IAAA,MAAM,oBAAA,EAAsB,CAAA,EAAA,GAAM;AAChC,MAAA,cAAA,CAAe,SAAA,CAAU,CAAC,CAAA;AAAA,IAC5B,CAAA;AAGA,IAAA,MAAA,CAAO,gBAAA,CAAiB,SAAA,EAAW,mBAAmB,CAAA;AAGtD,IAAA,MAAA,CAAO,gBAAA,CAAiB,eAAA,EAAiB,mBAAmB,CAAA;AAE5D,IAAA,OAAO,CAAA,EAAA,GAAM;AACX,MAAA,MAAA,CAAO,mBAAA,CAAoB,SAAA,EAAW,mBAAmB,CAAA;AACzD,MAAA,MAAA,CAAO,mBAAA,CAAoB,eAAA,EAAiB,mBAAmB,CAAA;AAAA,IACjE,CAAA;AAAA,EAEF,CAAA,EAAG,CAAC,CAAC,CAAA;AAEL,EAAA,OAAO,CAAC,WAAA,EAAa,QAAQ,CAAA;AAC/B,CAAA;AHNA;AACA;AACE;AACA;AACA;AACF,wIAAC","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-7ZIK4LWC.cjs","sourcesContent":[null,"/* eslint-disable import-x/prefer-default-export */\n\nimport { useEffect, useState } from 'react';\n\nexport const useDebounce = <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","/* eslint-disable import/prefer-default-export */\n\nimport { useEffect, useRef } from 'react';\n\n/**\n * A hook that returns true on initial render and false afterward.\n *\n * @returns {boolean} - True on initial render, false afterward\n */\nexport const useIsInitialRenderCycle = (): boolean => {\n  // Use ref to avoid re-renders\n  const isInitialRender = useRef(true);\n\n  // Update ref after first render\n  useEffect(() => {\n    // Set to false after component mounts\n    isInitialRender.current = false;\n\n    // No cleanup needed for this effect\n  }, []);\n\n  return isInitialRender.current;\n};\n","/* eslint-disable import/prefer-default-export */\n\nimport type { Dispatch, SetStateAction } from 'react';\n\nimport { useEffect, useState } from 'react';\n\nexport const 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"]}