@snacky/ui 0.13.1 → 0.13.3

package/dist/index.d.cts

@@ -72,6 +72,7 @@ interface SearchFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, '
     value: string;
     onChange: (value: string) => void;
     searchIcon?: ReactNode;
+    clearIcon?: ReactNode;
     onClear?: () => void;
 }
 /** Snacky Search Field - compact 40px field with a leading search icon and a clear button once filled. */
@@ -214,9 +215,9 @@ declare function SquareBanner({ imageUrl, alt, onClick, className }: ImageBanner
 /** Snacky Full-width Banner - prominent promotional banner on detail pages. */
 declare function FullWidthBanner({ imageUrl, alt, onClick, className }: ImageBannerProps): react.JSX.Element;
 interface PointBalanceBannerProps {
-    pointsIcon: ReactNode;
+    pointsIcon?: ReactNode;
     points: string;
-    balanceIcon: ReactNode;
+    balanceIcon?: ReactNode;
     balance: string;
     className?: string;
 }

package/dist/index.d.ts

@@ -72,6 +72,7 @@ interface SearchFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, '
     value: string;
     onChange: (value: string) => void;
     searchIcon?: ReactNode;
+    clearIcon?: ReactNode;
     onClear?: () => void;
 }
 /** Snacky Search Field - compact 40px field with a leading search icon and a clear button once filled. */
@@ -214,9 +215,9 @@ declare function SquareBanner({ imageUrl, alt, onClick, className }: ImageBanner
 /** Snacky Full-width Banner - prominent promotional banner on detail pages. */
 declare function FullWidthBanner({ imageUrl, alt, onClick, className }: ImageBannerProps): react.JSX.Element;
 interface PointBalanceBannerProps {
-    pointsIcon: ReactNode;
+    pointsIcon?: ReactNode;
     points: string;
-    balanceIcon: ReactNode;
+    balanceIcon?: ReactNode;
     balance: string;
     className?: string;
 }

package/dist/index.js

@@ -379,9 +379,9 @@ var TextField = forwardRef4(function TextField2({
 // src/components/Input/SearchField.tsx
 import { forwardRef as forwardRef5 } from "react";
 import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
-var SearchField = forwardRef5(function SearchField2({ value, onChange, searchIcon, onClear, className, placeholder = "Search products...", ...rest }, ref) {
+var SearchField = forwardRef5(function SearchField2({ value, onChange, searchIcon, clearIcon, onClear, className, placeholder = "Search products...", ...rest }, ref) {
   return /* @__PURE__ */ jsxs3("div", { className: cx("snacky-search", className), children: [
-    searchIcon && /* @__PURE__ */ jsx6("span", { className: "snacky-search__icon", children: searchIcon }),
+    /* @__PURE__ */ jsx6("span", { className: "snacky-search__icon", children: searchIcon ?? /* @__PURE__ */ jsx6(search, { width: 16, height: 16 }) }),
     /* @__PURE__ */ jsx6(
       "input",
       {
@@ -393,7 +393,16 @@ var SearchField = forwardRef5(function SearchField2({ value, onChange, searchIco
         ...rest
       }
     ),
-    value && onClear && /* @__PURE__ */ jsx6("button", { type: "button", className: "snacky-search__clear", onClick: onClear, "aria-label": "Clear search", children: "\u2715" })
+    value && /* @__PURE__ */ jsx6(
+      "button",
+      {
+        type: "button",
+        className: "snacky-search__clear",
+        onClick: onClear ?? (() => onChange("")),
+        "aria-label": "Clear search",
+        children: clearIcon ?? /* @__PURE__ */ jsx6(closeInput, { width: 16, height: 16 })
+      }
+    )
   ] });
 });
 
@@ -486,7 +495,7 @@ function ChatInput({ value, onChange, onSend, sendIcon, className, placeholder =
 import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
 function AddressResult({ icon: icon3, title, subtitle, onClick, className }) {
   return /* @__PURE__ */ jsxs6("button", { type: "button", className: cx("snacky-address-result", className), onClick, children: [
-    icon3 && /* @__PURE__ */ jsx10("span", { className: "snacky-address-result__icon", children: icon3 }),
+    /* @__PURE__ */ jsx10("span", { className: "snacky-address-result__icon", children: icon3 ?? /* @__PURE__ */ jsx10(address, { width: 20, height: 20 }) }),
     /* @__PURE__ */ jsxs6("span", { children: [
       /* @__PURE__ */ jsx10("p", { className: "snacky-address-result__title", children: title }),
       /* @__PURE__ */ jsx10("p", { className: "snacky-address-result__subtitle", children: subtitle })
@@ -757,7 +766,7 @@ function FullWidthBanner({ imageUrl, alt, onClick, className }) {
 function PointBalanceBanner({ pointsIcon, points: points2, balanceIcon, balance: balance3, className }) {
   return /* @__PURE__ */ jsxs13("div", { className: cx("snacky-banner-point-balance", className), children: [
     /* @__PURE__ */ jsxs13("div", { className: "snacky-banner-point-balance__item", children: [
-      /* @__PURE__ */ jsx20("span", { className: "snacky-banner-point-balance__icon", children: pointsIcon }),
+      /* @__PURE__ */ jsx20("span", { className: "snacky-banner-point-balance__icon", children: pointsIcon ?? /* @__PURE__ */ jsx20(points, { width: 16, height: 16 }) }),
       /* @__PURE__ */ jsxs13("div", { children: [
         /* @__PURE__ */ jsx20("p", { className: "snacky-banner-point-balance__label", children: "Points" }),
         /* @__PURE__ */ jsx20("p", { className: "snacky-banner-point-balance__value", children: points2 })
@@ -765,7 +774,7 @@ function PointBalanceBanner({ pointsIcon, points: points2, balanceIcon, balance:
     ] }),
     /* @__PURE__ */ jsx20("div", { className: "snacky-banner-point-balance__divider" }),
     /* @__PURE__ */ jsxs13("div", { className: "snacky-banner-point-balance__item", children: [
-      /* @__PURE__ */ jsx20("span", { className: "snacky-banner-point-balance__icon", children: balanceIcon }),
+      /* @__PURE__ */ jsx20("span", { className: "snacky-banner-point-balance__icon", children: balanceIcon ?? /* @__PURE__ */ jsx20(balance2, { width: 16, height: 16 }) }),
       /* @__PURE__ */ jsxs13("div", { children: [
         /* @__PURE__ */ jsx20("p", { className: "snacky-banner-point-balance__label", children: "Balance" }),
         /* @__PURE__ */ jsx20("p", { className: "snacky-banner-point-balance__value", children: balance3 })