@fuf-stack/pixels 1.8.0 → 1.10.0

package/dist/ScrollShadow/index.js

@@ -1,12 +1,7 @@
-import {
-  ScrollShadow_default
-} from "../chunk-ZLSX6FH3.js";
-import "../chunk-OAIRL2FN.js";
+import ScrollShadow_default from "./ScrollShadow.js";
+//#region src/ScrollShadow/index.ts
+var ScrollShadow_default$1 = ScrollShadow_default;
+//#endregion
+export { ScrollShadow_default as ScrollShadow, ScrollShadow_default$1 as default };
 
-// src/ScrollShadow/index.ts
-var ScrollShadow_default2 = ScrollShadow_default;
-export {
-  ScrollShadow_default as ScrollShadow,
-  ScrollShadow_default2 as default
-};
 //# sourceMappingURL=index.js.map

package/dist/ScrollShadow/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ScrollShadow/index.ts"],"sourcesContent":["import ScrollShadow from './ScrollShadow';\n\nexport type { ScrollShadowProps } from './ScrollShadow';\n\nexport { ScrollShadow };\n\nexport default ScrollShadow;\n"],"mappings":";;;;;;AAMA,IAAOA,wBAAQ;","names":["ScrollShadow_default"]}
+{"version":3,"file":"index.js","names":["ScrollShadow"],"sources":["../../src/ScrollShadow/index.ts"],"sourcesContent":["import ScrollShadow from './ScrollShadow';\n\nexport type { ScrollShadowProps } from './ScrollShadow';\n\nexport { ScrollShadow };\n\nexport default ScrollShadow;\n"],"mappings":";;AAMA,IAAA,yBAAeA"}

package/dist/SearchInput/SearchInput.cjs

@@ -0,0 +1,53 @@
+require("../_virtual/_rolldown/runtime.cjs");
+let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
+let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
+let react_icons_fa = require("react-icons/fa");
+let _heroui_input = require("@heroui/input");
+//#region src/SearchInput/SearchInput.tsx
+const inputVariants = (0, _fuf_stack_pixel_utils.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"
+} });
+/**
+* SearchInput component based on [HeroUI Input](https://www.heroui.com//docs/components/input)
+*/
+const 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 [value, setValue] = (0, react.useState)(initialValue ?? "");
+	const handleChange = (e) => {
+		setValue(e?.target?.value ?? "");
+		onChange(e?.target?.value ?? null);
+	};
+	const classNames = (0, _fuf_stack_pixel_utils.variantsToClassNames)(inputVariants(), _className, "base");
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_input.Input, {
+		isClearable: true,
+		autoComplete: "off",
+		"data-testid": testId ? (0, _fuf_stack_pixel_utils.slugify)(testId) : void 0,
+		endContent,
+		isDisabled: disabled,
+		onChange: handleChange,
+		onClear: handleChange,
+		placeholder,
+		radius: "sm",
+		size,
+		startContent: startContent ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_fa.FaSearch, { className: "opacity-50" }),
+		value,
+		variant: "bordered",
+		classNames: {
+			base: classNames.base,
+			clearButton: classNames.clearButton,
+			input: classNames.input,
+			inputWrapper: classNames.inputWrapper
+		}
+	});
+};
+//#endregion
+exports.default = SearchInput;
+
+//# sourceMappingURL=SearchInput.cjs.map

package/dist/SearchInput/SearchInput.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.cjs","names":["HeroInput","FaSearch"],"sources":["../../src/SearchInput/SearchInput.tsx"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { useState } from 'react';\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  // handle controlled value with initial value\n  const [value, setValue] = useState(initialValue ?? '');\n\n  const handleChange = (e?: ChangeEvent<HTMLInputElement>) => {\n    setValue(e?.target?.value ?? '');\n    onChange(e?.target?.value ?? null);\n  };\n\n  // classNames from slots\n  const variants = inputVariants();\n  const classNames = variantsToClassNames(variants, _className, 'base');\n\n  return (\n    <HeroInput\n      isClearable\n      // disable password manager integrations\n      autoComplete=\"off\"\n      data-testid={testId ? slugify(testId) : undefined}\n      endContent={endContent}\n      isDisabled={disabled}\n      onChange={handleChange}\n      onClear={handleChange}\n      placeholder={placeholder}\n      radius=\"sm\"\n      size={size}\n      startContent={startContent ?? <FaSearch className=\"opacity-50\" />}\n      value={value}\n      variant=\"bordered\"\n      classNames={{\n        base: classNames.base,\n        clearButton: classNames.clearButton,\n        input: classNames.input,\n        inputWrapper: classNames.inputWrapper,\n      }}\n    />\n  );\n};\n\nexport default SearchInput;\n"],"mappings":";;;;;;;AAWA,MAAa,iBAAA,GAAA,uBAAA,IAAmB,EAC9B,OAAO;;CAEL,MAAM;;CAEN,aAAa;;CAEb,OAAO;;CAEP,cAAc;AAChB,EACF,CAAC;;;;AA6BD,MAAM,eAAe,EACnB,WAAW,aAAa,KAAA,GACxB,WAAW,OACX,aAAa,KAAA,GACb,UACA,cAAc,KAAA,GACd,OAAO,KAAA,GACP,eAAe,KAAA,GACf,SAAS,KAAA,GACT,eAAe,KAAA,QACO;CAEtB,MAAM,CAAC,OAAO,aAAA,GAAA,MAAA,UAAqB,gBAAgB,EAAE;CAErD,MAAM,gBAAgB,MAAsC;EAC1D,SAAS,GAAG,QAAQ,SAAS,EAAE;EAC/B,SAAS,GAAG,QAAQ,SAAS,IAAI;CACnC;CAIA,MAAM,cAAA,GAAA,uBAAA,sBADW,cAC8B,GAAG,YAAY,MAAM;CAEpE,OACE,iBAAA,GAAA,kBAAA,KAACA,cAAAA,OAAD;EACE,aAAA;EAEA,cAAa;EACb,eAAa,UAAA,GAAA,uBAAA,SAAiB,MAAM,IAAI,KAAA;EAC5B;EACZ,YAAY;EACZ,UAAU;EACV,SAAS;EACI;EACb,QAAO;EACD;EACN,cAAc,gBAAgB,iBAAA,GAAA,kBAAA,KAACC,eAAAA,UAAD,EAAU,WAAU,aAAc,CAAA;EACzD;EACP,SAAQ;EACR,YAAY;GACV,MAAM,WAAW;GACjB,aAAa,WAAW;GACxB,OAAO,WAAW;GAClB,cAAc,WAAW;EAC3B;CACD,CAAA;AAEL"}

package/dist/SearchInput/SearchInput.d.cts

@@ -0,0 +1,86 @@
+import { TVClassName, TVProps } from "@fuf-stack/pixel-utils";
+import { ReactNode } from "react";
+
+//#region src/SearchInput/SearchInput.d.ts
+declare const inputVariants: import("tailwind-variants").TVReturnType<{
+  [key: string]: {
+    [key: string]: import("tailwind-merge").ClassNameValue | {
+      base?: import("tailwind-merge").ClassNameValue;
+      clearButton?: import("tailwind-merge").ClassNameValue;
+      input?: import("tailwind-merge").ClassNameValue;
+      inputWrapper?: import("tailwind-merge").ClassNameValue;
+    };
+  };
+} | {
+  [x: string]: {
+    [x: string]: import("tailwind-merge").ClassNameValue | {
+      base?: import("tailwind-merge").ClassNameValue;
+      clearButton?: import("tailwind-merge").ClassNameValue;
+      input?: import("tailwind-merge").ClassNameValue;
+      inputWrapper?: import("tailwind-merge").ClassNameValue;
+    };
+  };
+} | {}, {
+  /** 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]: import("tailwind-merge").ClassNameValue | {
+      base?: import("tailwind-merge").ClassNameValue;
+      clearButton?: import("tailwind-merge").ClassNameValue;
+      input?: import("tailwind-merge").ClassNameValue;
+      inputWrapper?: import("tailwind-merge").ClassNameValue;
+    };
+  };
+} | {}, {
+  /** wrapper around the whole input */base: string; /** clear button */
+  clearButton: string; /** actual input element */
+  input: string; /** inner wrapper (HeroUI inputWrapper slot) */
+  inputWrapper: string;
+}, import("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) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { SearchInput, SearchInputProps };
+//# sourceMappingURL=SearchInput.d.cts.map

package/dist/SearchInput/SearchInput.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.d.cts","names":[],"sources":["../../src/SearchInput/SearchInput.tsx"],"mappings":";;;;cAWa,aAAA,8BAAa,YAAA;EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAarB,YAAA,GAAe,OAAO,QAAQ,aAAA;AAAA,KAC9B,SAAA,GAAY,WAAW,QAAQ,aAAA;AAAA,UAEnB,gBAAA,SAAyB,YAAA;EAHtB;EAKlB,SAAA,GAAY,SAAA;EAJT;EAMH,QAAA;;EAEA,UAAA,GAAa,SAAA;EARkC;EAU/C,YAAA;EARgC;EAUhC,QAAA,GAAW,KAAA;EARC;EAUZ,WAAA;EAIe;EAFf,IAAA;EAdoD;EAgBpD,YAAA,GAAe,SAAA;EAhByB;EAkBxC,MAAA;AAAA;;;;cAMI,WAAA;EAAe,SAAA,EAAA,UAAA;EAAA,QAAA;EAAA,UAAA;EAAA,QAAA;EAAA,WAAA;EAAA,IAAA;EAAA,YAAA;EAAA,MAAA;EAAA;AAAA,GAUlB,gBAAA,iCAAgB,GAAA,CAAA,OAAA"}

package/dist/SearchInput/SearchInput.d.ts

@@ -0,0 +1,86 @@
+import { TVClassName, TVProps } from "@fuf-stack/pixel-utils";
+import { ReactNode } from "react";
+
+//#region src/SearchInput/SearchInput.d.ts
+declare const inputVariants: import("tailwind-variants").TVReturnType<{
+  [key: string]: {
+    [key: string]: import("tailwind-merge").ClassNameValue | {
+      base?: import("tailwind-merge").ClassNameValue;
+      clearButton?: import("tailwind-merge").ClassNameValue;
+      input?: import("tailwind-merge").ClassNameValue;
+      inputWrapper?: import("tailwind-merge").ClassNameValue;
+    };
+  };
+} | {
+  [x: string]: {
+    [x: string]: import("tailwind-merge").ClassNameValue | {
+      base?: import("tailwind-merge").ClassNameValue;
+      clearButton?: import("tailwind-merge").ClassNameValue;
+      input?: import("tailwind-merge").ClassNameValue;
+      inputWrapper?: import("tailwind-merge").ClassNameValue;
+    };
+  };
+} | {}, {
+  /** 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]: import("tailwind-merge").ClassNameValue | {
+      base?: import("tailwind-merge").ClassNameValue;
+      clearButton?: import("tailwind-merge").ClassNameValue;
+      input?: import("tailwind-merge").ClassNameValue;
+      inputWrapper?: import("tailwind-merge").ClassNameValue;
+    };
+  };
+} | {}, {
+  /** wrapper around the whole input */base: string; /** clear button */
+  clearButton: string; /** actual input element */
+  input: string; /** inner wrapper (HeroUI inputWrapper slot) */
+  inputWrapper: string;
+}, import("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) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { SearchInput, SearchInputProps };
+//# sourceMappingURL=SearchInput.d.ts.map

package/dist/SearchInput/SearchInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.d.ts","names":[],"sources":["../../src/SearchInput/SearchInput.tsx"],"mappings":";;;;cAWa,aAAA,8BAAa,YAAA;EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAarB,YAAA,GAAe,OAAO,QAAQ,aAAA;AAAA,KAC9B,SAAA,GAAY,WAAW,QAAQ,aAAA;AAAA,UAEnB,gBAAA,SAAyB,YAAA;EAHtB;EAKlB,SAAA,GAAY,SAAA;EAJT;EAMH,QAAA;;EAEA,UAAA,GAAa,SAAA;EARkC;EAU/C,YAAA;EARgC;EAUhC,QAAA,GAAW,KAAA;EARC;EAUZ,WAAA;EAIe;EAFf,IAAA;EAdoD;EAgBpD,YAAA,GAAe,SAAA;EAhByB;EAkBxC,MAAA;AAAA;;;;cAMI,WAAA;EAAe,SAAA,EAAA,UAAA;EAAA,QAAA;EAAA,UAAA;EAAA,QAAA;EAAA,WAAA;EAAA,IAAA;EAAA,YAAA;EAAA,MAAA;EAAA;AAAA,GAUlB,gBAAA,iCAAgB,GAAA,CAAA,OAAA"}

package/dist/SearchInput/SearchInput.js

@@ -0,0 +1,52 @@
+import { slugify, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
+import { jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { FaSearch } from "react-icons/fa";
+import { Input } from "@heroui/input";
+//#region src/SearchInput/SearchInput.tsx
+const 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"
+} });
+/**
+* SearchInput component based on [HeroUI Input](https://www.heroui.com//docs/components/input)
+*/
+const 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 [value, setValue] = useState(initialValue ?? "");
+	const handleChange = (e) => {
+		setValue(e?.target?.value ?? "");
+		onChange(e?.target?.value ?? null);
+	};
+	const classNames = variantsToClassNames(inputVariants(), _className, "base");
+	return /* @__PURE__ */ jsx(Input, {
+		isClearable: true,
+		autoComplete: "off",
+		"data-testid": testId ? slugify(testId) : void 0,
+		endContent,
+		isDisabled: disabled,
+		onChange: handleChange,
+		onClear: handleChange,
+		placeholder,
+		radius: "sm",
+		size,
+		startContent: startContent ?? /* @__PURE__ */ jsx(FaSearch, { className: "opacity-50" }),
+		value,
+		variant: "bordered",
+		classNames: {
+			base: classNames.base,
+			clearButton: classNames.clearButton,
+			input: classNames.input,
+			inputWrapper: classNames.inputWrapper
+		}
+	});
+};
+//#endregion
+export { SearchInput as default };
+
+//# sourceMappingURL=SearchInput.js.map

package/dist/SearchInput/SearchInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.js","names":["HeroInput"],"sources":["../../src/SearchInput/SearchInput.tsx"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { useState } from 'react';\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  // handle controlled value with initial value\n  const [value, setValue] = useState(initialValue ?? '');\n\n  const handleChange = (e?: ChangeEvent<HTMLInputElement>) => {\n    setValue(e?.target?.value ?? '');\n    onChange(e?.target?.value ?? null);\n  };\n\n  // classNames from slots\n  const variants = inputVariants();\n  const classNames = variantsToClassNames(variants, _className, 'base');\n\n  return (\n    <HeroInput\n      isClearable\n      // disable password manager integrations\n      autoComplete=\"off\"\n      data-testid={testId ? slugify(testId) : undefined}\n      endContent={endContent}\n      isDisabled={disabled}\n      onChange={handleChange}\n      onClear={handleChange}\n      placeholder={placeholder}\n      radius=\"sm\"\n      size={size}\n      startContent={startContent ?? <FaSearch className=\"opacity-50\" />}\n      value={value}\n      variant=\"bordered\"\n      classNames={{\n        base: classNames.base,\n        clearButton: classNames.clearButton,\n        input: classNames.input,\n        inputWrapper: classNames.inputWrapper,\n      }}\n    />\n  );\n};\n\nexport default SearchInput;\n"],"mappings":";;;;;;AAWA,MAAa,gBAAgB,GAAG,EAC9B,OAAO;;CAEL,MAAM;;CAEN,aAAa;;CAEb,OAAO;;CAEP,cAAc;AAChB,EACF,CAAC;;;;AA6BD,MAAM,eAAe,EACnB,WAAW,aAAa,KAAA,GACxB,WAAW,OACX,aAAa,KAAA,GACb,UACA,cAAc,KAAA,GACd,OAAO,KAAA,GACP,eAAe,KAAA,GACf,SAAS,KAAA,GACT,eAAe,KAAA,QACO;CAEtB,MAAM,CAAC,OAAO,YAAY,SAAS,gBAAgB,EAAE;CAErD,MAAM,gBAAgB,MAAsC;EAC1D,SAAS,GAAG,QAAQ,SAAS,EAAE;EAC/B,SAAS,GAAG,QAAQ,SAAS,IAAI;CACnC;CAIA,MAAM,aAAa,qBADF,cAC8B,GAAG,YAAY,MAAM;CAEpE,OACE,oBAACA,OAAD;EACE,aAAA;EAEA,cAAa;EACb,eAAa,SAAS,QAAQ,MAAM,IAAI,KAAA;EAC5B;EACZ,YAAY;EACZ,UAAU;EACV,SAAS;EACI;EACb,QAAO;EACD;EACN,cAAc,gBAAgB,oBAAC,UAAD,EAAU,WAAU,aAAc,CAAA;EACzD;EACP,SAAQ;EACR,YAAY;GACV,MAAM,WAAW;GACjB,aAAa,WAAW;GACxB,OAAO,WAAW;GAClB,cAAc,WAAW;EAC3B;CACD,CAAA;AAEL"}

package/dist/SearchInput/index.cjs

@@ -1,73 +1,12 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});require('../chunk-AHEA4IJV.cjs');
-
-// src/SearchInput/SearchInput.tsx
-var _react = require('react');
-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"
-  }
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
 });
-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 [value, setValue] = _react.useState.call(void 0, initialValue != null ? initialValue : "");
-  const handleChange = (e) => {
-    var _a, _b, _c, _d;
-    setValue((_b = (_a = e == null ? void 0 : e.target) == null ? void 0 : _a.value) != null ? _b : "");
-    onChange((_d = (_c = e == null ? void 0 : e.target) == null ? void 0 : _c.value) != null ? _d : null);
-  };
-  const variants = inputVariants();
-  const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, _className, "base");
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _input.Input,
-    {
-      isClearable: true,
-      autoComplete: "off",
-      "data-testid": testId ? _pixelutils.slugify.call(void 0, testId) : void 0,
-      endContent,
-      isDisabled: disabled,
-      onChange: handleChange,
-      onClear: handleChange,
-      placeholder,
-      radius: "sm",
-      size,
-      startContent: startContent != null ? startContent : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa.FaSearch, { className: "opacity-50" }),
-      value,
-      variant: "bordered",
-      classNames: {
-        base: classNames.base,
-        clearButton: classNames.clearButton,
-        input: classNames.input,
-        inputWrapper: classNames.inputWrapper
-      }
-    }
-  );
-};
-var SearchInput_default = SearchInput;
-
-// src/SearchInput/index.ts
-var SearchInput_default2 = SearchInput_default;
-
-
+const require_SearchInput = require("./SearchInput.cjs");
+//#region src/SearchInput/index.ts
+var SearchInput_default = require_SearchInput.default;
+//#endregion
+exports.SearchInput = require_SearchInput.default;
+exports.default = SearchInput_default;
 
-exports.SearchInput = SearchInput_default; exports.default = SearchInput_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/SearchInput/index.cjs.map

@@ -1 +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":"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","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 { ChangeEvent, ReactNode } from 'react';\n\nimport { useState } from 'react';\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  // handle controlled value with initial value\n  const [value, setValue] = useState(initialValue ?? '');\n\n  const handleChange = (e?: ChangeEvent<HTMLInputElement>) => {\n    setValue(e?.target?.value ?? '');\n    onChange(e?.target?.value ?? null);\n  };\n\n  // classNames from slots\n  const variants = inputVariants();\n  const classNames = variantsToClassNames(variants, _className, 'base');\n\n  return (\n    <HeroInput\n      isClearable\n      // disable password manager integrations\n      autoComplete=\"off\"\n      data-testid={testId ? slugify(testId) : undefined}\n      endContent={endContent}\n      isDisabled={disabled}\n      onChange={handleChange}\n      onClear={handleChange}\n      placeholder={placeholder}\n      radius=\"sm\"\n      size={size}\n      startContent={startContent ?? <FaSearch className=\"opacity-50\" />}\n      value={value}\n      variant=\"bordered\"\n      classNames={{\n        base: classNames.base,\n        clearButton: classNames.clearButton,\n        input: classNames.input,\n        inputWrapper: classNames.inputWrapper,\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"]}
+{"version":3,"file":"index.cjs","names":["SearchInput"],"sources":["../../src/SearchInput/index.ts"],"sourcesContent":["import SearchInput from './SearchInput';\n\nexport type { SearchInputProps } from './SearchInput';\n\nexport { SearchInput };\n\nexport default SearchInput;\n"],"mappings":";;;;;;AAMA,IAAA,sBAAeA,oBAAAA"}

package/dist/SearchInput/index.d.cts

@@ -1,88 +1,2 @@
-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 };
+import { SearchInput, SearchInputProps } from "./SearchInput.cjs";
+export { SearchInput, SearchInput as default, type SearchInputProps };

package/dist/SearchInput/index.d.ts

@@ -1,88 +1,2 @@
-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 };
+import { SearchInput, SearchInputProps } from "./SearchInput.js";
+export { SearchInput, SearchInput as default, type SearchInputProps };