@coopdigital/react 0.54.0 → 0.55.0

package/dist/components/Button/Button.js

@@ -32,7 +32,7 @@ const Button = ({ as, children, className, href, isDisabled = false, isFullWidth
         onClick: onClick ? handleClick : undefined,
         ...props,
     };
-    const finalChildren = isPending || isLoading ? (jsxs(Fragment, { children: [loadingText, jsx(LoadingIcon, {})] })) : (children);
+    const finalChildren = isPending || isLoading ? (jsxs(Fragment, { children: [loadingText, jsx(LoadingIcon, { stroke: "currentColor", strokeWidth: "1px" })] })) : (children);
     return React__default.createElement(element, { ...componentProps, ref }, finalChildren);
 };
 

package/dist/components/DatePicker/DatePicker.d.ts

@@ -26,11 +26,12 @@ export interface DatePickerProps extends Omit<InputHTMLAttributes<HTMLInputEleme
     error?: boolean;
     /** **(Optional)** Specify the Date Picker id. Will be auto-generated if not set. */
     id?: string;
-    /** **(Optional)** Specify the initial month view for the picker.
+    /** **(Optional)** Specify the initial month view for the picker. Combine with `initialSelected` to pre-select a date.
      *
      * Default: today.
      */
     initialDate?: Date | DateRange;
+    /** **(Optional)** Specify whether the initial date should be pre-selected. */
     initialSelected?: boolean;
     /** **(Optional)** Specify the picker mode. */
     mode?: Mode;

package/dist/components/DatePicker/DatePicker.js

@@ -5,7 +5,8 @@ import clsx from 'clsx';
 import { useMemo, useReducer, useCallback } from 'react';
 import { useId } from '../../hooks/useId.js';
 import { Button } from '../Button/Button.js';
-import { CloseIcon } from '../icons/CloseIcon.js';
+import { CalendarIcon } from '../icons/CalendarIcon.js';
+import { CrossIcon } from '../icons/CrossIcon.js';
 import { TickIcon } from '../icons/TickIcon.js';
 import { Popover } from '../Popover/Popover.js';
 import { TextInput } from '../TextInput/TextInput.js';
@@ -116,9 +117,9 @@ const DatePicker = ({ className, closeOnSelect = true, dateFormat = "dd/MM/yyyy"
                 return lowerCaseDateFormat;
         }
     };
-    return (jsxs("div", { ...componentProps, children: [jsxs(Popover, { onOpenChange: setOpen, open: state.open, children: [jsxs(Popover.Anchor, { className: "coop-datepicker-inner", children: [jsx(TextInput, { autoComplete: "off", className: "coop-datepicker-input", disabled: disabled, id: uid + componentConfig.fieldSuffix, 
-                                //maxLength={dateFormat.length}
-                                name: name + componentConfig.fieldSuffix, onChange: updateFromInput, placeholder: getPlaceholder(), ref: ref, required: required, size: size, value: (_f = (_e = state === null || state === void 0 ? void 0 : state[mode]) === null || _e === void 0 ? void 0 : _e.input) !== null && _f !== void 0 ? _f : "" }), jsx(Popover.Trigger, { asChild: true, children: jsx(Button, { className: "coop-datepicker-button", disabled: disabled, size: size, children: "Select" }) })] }), jsxs(Popover.Content, { "aria-label": "Date picker", className: "coop-datepicker-calendar", collisionPadding: 16, sideOffset: 4, children: [jsx(Calendar
+    return (jsxs("div", { ...componentProps, children: [jsxs(Popover, { onOpenChange: setOpen, open: state.open, children: [jsx(Popover.Anchor, { className: "coop-datepicker-inner", children: jsx(TextInput, { autoComplete: "off", className: "coop-datepicker-input", disabled: disabled, id: uid + componentConfig.fieldSuffix, 
+                            //maxLength={dateFormat.length}
+                            name: name + componentConfig.fieldSuffix, onChange: updateFromInput, placeholder: getPlaceholder(), ref: ref, required: required, size: size, suffix: jsx(Popover.Trigger, { "aria-label": "Choose date", className: "coop-datepicker-trigger", children: jsx(CalendarIcon, { width: 24 }) }), suffixInline: true, value: (_f = (_e = state === null || state === void 0 ? void 0 : state[mode]) === null || _e === void 0 ? void 0 : _e.input) !== null && _f !== void 0 ? _f : "" }) }), jsxs(Popover.Content, { "aria-label": "Date picker", className: "coop-datepicker-calendar bg-white", collisionPadding: 16, sideOffset: 4, children: [jsx(Calendar
                             // jsx-ally throws here because we set autoFocus, but this
                             // is not a standard element. Daypicker uses this value to
                             // focus the day rather than the nav when it renders.
@@ -130,7 +131,7 @@ const DatePicker = ({ className, closeOnSelect = true, dateFormat = "dd/MM/yyyy"
                                 // eslint-disable-next-line jsx-a11y/no-autofocus
                                 autoFocus: true, captionLayout: "dropdown", 
                                 //defaultMonth={defaultMonth}
-                                disabled: disabledDates, endMonth: endDate, month: state.view, onMonthChange: setView, onSelect: updateValues, startMonth: startDate, ...calendarProps[mode] }), jsxs("div", { className: "coop-datepicker-actions", children: [jsxs(Button, { "aria-label": "Cancel", className: "bg-tint-grey", onClick: resetState, size: "sm", children: ["Clear ", jsx(CloseIcon, { stroke: "black", strokeWidth: 1 })] }), jsx(Popover.Close, { asChild: true, children: jsxs(Button, { "aria-label": "Accept", size: "sm", children: ["OK ", jsx(TickIcon, { stroke: "white", strokeWidth: 1 })] }) })] })] })] }), jsx("div", { "aria-live": "assertive", className: "sr-only coop-datepicker-status", role: "status", children: (_g = state.message) !== null && _g !== void 0 ? _g : footerMessage[mode] }), mode === "single" && jsx("input", { ...valueProps, value: (_j = (_h = state.single) === null || _h === void 0 ? void 0 : _h.field) !== null && _j !== void 0 ? _j : "" }), mode === "multiple" && jsx("input", { ...valueProps, value: (_l = (_k = state.multiple) === null || _k === void 0 ? void 0 : _k.field) !== null && _l !== void 0 ? _l : "" }), mode === "range" && (jsxs(Fragment, { children: [jsx("input", { ...baseValueProps, id: `${uid}_start`, name: `${name}_start`, value: (_p = (_o = (_m = state.range) === null || _m === void 0 ? void 0 : _m.field) === null || _o === void 0 ? void 0 : _o.from) !== null && _p !== void 0 ? _p : "" }), jsx("input", { ...baseValueProps, id: `${uid}_end`, name: `${name}_end`, value: (_s = (_r = (_q = state.range) === null || _q === void 0 ? void 0 : _q.field) === null || _r === void 0 ? void 0 : _r.to) !== null && _s !== void 0 ? _s : "" })] }))] }));
+                                disabled: disabledDates, endMonth: endDate, month: state.view, onMonthChange: setView, onSelect: updateValues, startMonth: startDate, ...calendarProps[mode] }), jsxs("div", { className: "coop-datepicker-actions", children: [jsxs(Button, { "aria-label": "Cancel", className: "bg-tint-grey", onClick: resetState, size: "sm", children: ["Clear ", jsx(CrossIcon, { stroke: "black", strokeWidth: 1 })] }), jsx(Popover.Close, { asChild: true, children: jsxs(Button, { "aria-label": "Accept", size: "sm", children: ["OK ", jsx(TickIcon, { stroke: "white", strokeWidth: 1 })] }) })] })] })] }), jsx("div", { "aria-live": "assertive", className: "sr-only coop-datepicker-status", role: "status", children: (_g = state.message) !== null && _g !== void 0 ? _g : footerMessage[mode] }), mode === "single" && jsx("input", { ...valueProps, value: (_j = (_h = state.single) === null || _h === void 0 ? void 0 : _h.field) !== null && _j !== void 0 ? _j : "" }), mode === "multiple" && jsx("input", { ...valueProps, value: (_l = (_k = state.multiple) === null || _k === void 0 ? void 0 : _k.field) !== null && _l !== void 0 ? _l : "" }), mode === "range" && (jsxs(Fragment, { children: [jsx("input", { ...baseValueProps, id: `${uid}_start`, name: `${name}_start`, value: (_p = (_o = (_m = state.range) === null || _m === void 0 ? void 0 : _m.field) === null || _o === void 0 ? void 0 : _o.from) !== null && _p !== void 0 ? _p : "" }), jsx("input", { ...baseValueProps, id: `${uid}_end`, name: `${name}_end`, value: (_s = (_r = (_q = state.range) === null || _q === void 0 ? void 0 : _q.field) === null || _r === void 0 ? void 0 : _r.to) !== null && _s !== void 0 ? _s : "" })] }))] }));
 };
 DatePicker.config = componentConfig;
 

package/dist/components/Expandable/Expandable.js

@@ -21,7 +21,7 @@ const Expandable = ({ children, className, ref, ...props }) => {
     return (jsxs("details", { ...componentProps, ref: ref, children: [slots.ExpandableSummary, slots.ExpandableContent] }));
 };
 const ExpandableSummary = ({ children, className, ...props }) => {
-    return (jsxs("summary", { ...props, className: className, children: [children, jsx(ChevronDownIcon, { className: "coop-expandable--icon", stroke: "currentColor", strokeWidth: 2, width: "12" })] }));
+    return (jsxs("summary", { ...props, className: className, children: [children, jsx(ChevronDownIcon, { className: "coop-expandable--icon", width: "20" })] }));
 };
 const ExpandableContent = ({ children, className, ...props }) => {
     return (jsx("div", { className: clsx("coop-expandable--content", className), ...props, children: children }));

package/dist/components/Searchbox/Searchbox.d.ts

@@ -21,7 +21,7 @@ export interface SearchboxProps extends FormHTMLAttributes<HTMLFormElement> {
     /** **(Optional)** Specify the TextInput name, also used as the URL search parameter. Defaults to `query`. */
     name?: string;
     /** **(Optional)** Callback to run when the form is submitted. If this is an async function, it will be awaited and the Searchbox will be in a pending state until the promise is resolved. */
-    onSubmit?: React.FormEventHandler<HTMLElement> | undefined;
+    onSubmit?: React.SubmitEventHandler<HTMLElement> | undefined;
     /** **(Optional)** Specify the TextInput placeholder text Do not use in place of a form label. */
     placeholder?: string;
     /** **(Optional)** Specify a custom React ref for this component. */

package/dist/components/Searchbox/Searchbox.js

@@ -18,7 +18,7 @@ const componentSlots = {
 const defaultButtonText = React__default.createElement(SearchIcon, {
     alt: "Search",
     stroke: "currentColor",
-    strokeWidth: 2,
+    width: 24,
 });
 const Searchbox = ({ action, children, className, id, label, labelVisible = false, onSubmit, ref, size = "md", variant = "solid", ...props }) => {
     const slots = useSlots(componentSlots, children);

package/dist/components/TextInput/TextInput.d.ts

@@ -15,17 +15,21 @@ export interface TextInputProps extends Omit<InputHTMLAttributes<HTMLInputElemen
     placeholder?: string;
     /** **(Optional)** Specify the prefix. It can be any valid JSX or string. */
     prefix?: React.ReactNode;
+    /** **(Optional)** Specify whether the prefix should be rendered inside the input. */
+    prefixInline?: boolean;
     /** **(Optional)** Specify a custom React ref for this component. */
     ref?: Ref<HTMLInputElement>;
     /** **(Optional)** Specify the TextInput size. */
     size?: StandardSizes;
     /** **(Optional)** Specify the suffix. It can be any valid JSX or string. */
     suffix?: React.ReactNode;
+    /** **(Optional)** Specify whether the suffix should be rendered inside the input. */
+    suffixInline?: boolean;
     /** **(Optional)** Specify the TextInput type. */
     type?: "text" | "email" | "number" | "password" | "search" | "tel" | "url" | "date" | "datetime-local" | "week" | "month" | "time";
 }
 export declare const TextInput: {
-    ({ "aria-placeholder": ariaPlaceholder, className, disabled, error, id, name, placeholder, prefix, ref, size, suffix, type, ...props }: TextInputProps): JSX.Element;
+    ({ "aria-placeholder": ariaPlaceholder, className, disabled, error, id, name, placeholder, prefix, prefixInline, ref, size, suffix, suffixInline, type, ...props }: TextInputProps): JSX.Element;
     config: {
         isField: true;
     };

package/dist/components/TextInput/TextInput.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useId } from '../../hooks/useId.js';
 
-const TextInput = ({ "aria-placeholder": ariaPlaceholder, className, disabled, error = false, id, name, placeholder, prefix, ref, size = "md", suffix, type = "text", ...props }) => {
+const TextInput = ({ "aria-placeholder": ariaPlaceholder, className, disabled, error = false, id, name, placeholder, prefix, prefixInline = false, ref, size = "md", suffix, suffixInline = false, type = "text", ...props }) => {
     var _a;
     const uid = useId(id);
     const componentProps = {
@@ -17,8 +17,14 @@ const TextInput = ({ "aria-placeholder": ariaPlaceholder, className, disabled, e
         type,
         ...props,
     };
+    const prefixProps = prefix
+        ? { className: "coop-text-input--prefix", "data-inline": prefixInline || undefined }
+        : {};
+    const suffixProps = suffix
+        ? { className: "coop-text-input--suffix", "data-inline": suffixInline || undefined }
+        : {};
     //const formItemProps = { "aria-disabled": disabled ? true : undefined }
-    return (jsxs("div", { className: "coop-text-input-wrapper", children: [prefix && jsx("span", { className: "coop-text-input--prefix", children: prefix }), jsx("input", { ...componentProps, ref: ref }), suffix && jsx("span", { className: "coop-text-input--suffix", children: suffix })] }));
+    return (jsxs("div", { className: "coop-text-input-wrapper", children: [prefix && jsx("span", { ...prefixProps, children: prefix }), jsx("input", { ...componentProps, ref: ref }), suffix && jsx("span", { ...suffixProps, children: suffix })] }));
 };
 TextInput.config = {
     isField: true,

package/dist/components/icons/AccountCircleFilledIcon.d.ts

@@ -0,0 +1,6 @@
+import { type SVGProps } from "react";
+interface IconProps extends SVGProps<SVGSVGElement> {
+    alt?: string;
+}
+export declare const AccountCircleFilledIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/icons/AccountCircleFilledIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const AccountCircleFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "account-circle-filled",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M16 2c7.732 0 14 6.268 14 14 0 6.34-4.216 11.695-9.997 13.417l-.034.012-.029.008a14 14 0 0 1-3.453.553l-.037.002h-.022q-.211.007-.424.007L16 30 16 29.999V30q-.216 0-.432-.008h-.017l-.042-.003c-1.19-.04-2.34-.229-3.437-.549l-.035-.01-.075-.023a14 14 0 0 1-1.96-.755l-.06-.027-.011-.006C5.238 26.36 2 21.557 2 16 2 8.268 8.268 2 16 2m0 2C9.373 4 4 9.373 4 16a11.95 11.95 0 0 0 2.256 6.997 12.03 12.03 0 0 1 5.92-4.374 6 6 0 1 1 7.648 0 12.03 12.03 0 0 1 5.918 4.374A11.95 11.95 0 0 0 28 16c0-6.627-5.373-12-12-12" })] }));
+};
+
+export { AccountCircleFilledIcon };

package/dist/components/icons/AccountCircleIcon.d.ts

@@ -0,0 +1,6 @@
+import { type SVGProps } from "react";
+interface IconProps extends SVGProps<SVGSVGElement> {
+    alt?: string;
+}
+export declare const AccountCircleIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/icons/AccountCircleIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const AccountCircleIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "account-circle",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M16 2c7.732 0 14 6.268 14 14 0 6.378-4.265 11.758-10.099 13.447l-.03.01q-.447.127-.904.227l-.038.007q-.126.027-.251.051l-.099.02a14 14 0 0 1-.558.091l-.09.013a13 13 0 0 1-.559.067l-.203.017-.115.01q-.153.011-.306.02l-.033.001a14 14 0 0 1-1.43 0q-.018 0-.034-.002l-.306-.019-.115-.01q-.102-.007-.203-.017l-.225-.025-.087-.01-.245-.03-.093-.014-.236-.037-.1-.016a15 15 0 0 1-.57-.109l-.039-.008a14 14 0 0 1-.903-.227l-.032-.01C6.264 27.757 2 22.377 2 16 2 8.268 8.268 2 16 2m.001 18a9.99 9.99 0 0 0-8.397 4.57A11.95 11.95 0 0 0 16 28c3.27 0 6.23-1.31 8.393-3.43A9.99 9.99 0 0 0 16 20M16 4C9.373 4 4 9.373 4 16a11.95 11.95 0 0 0 2.256 6.997 12.03 12.03 0 0 1 5.92-4.374 6 6 0 1 1 7.648 0 12.03 12.03 0 0 1 5.918 4.374A11.95 11.95 0 0 0 28 16c0-6.627-5.373-12-12-12m0 6a4 4 0 1 0 0 8 4 4 0 0 0 0-8" })] }));
+};
+
+export { AccountCircleIcon };

package/dist/components/icons/AccountFilledIcon.d.ts

@@ -0,0 +1,6 @@
+import { type SVGProps } from "react";
+interface IconProps extends SVGProps<SVGSVGElement> {
+    alt?: string;
+}
+export declare const AccountFilledIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/icons/AccountFilledIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const AccountFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "account-filled",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M16 2a7 7 0 0 1 4.055 12.703l.075.027a12.03 12.03 0 0 1 7.514 8.36q.063.252.115.51-.117.18-.24.357a14.05 14.05 0 0 1-7.11 5.334A13.9 13.9 0 0 1 16 30c-4.93 0-9.266-2.55-11.76-6.401a12.02 12.02 0 0 1 7.63-8.87l.074-.026A7 7 0 0 1 16 2" })] }));
+};
+
+export { AccountFilledIcon };

package/dist/components/icons/AccountIcon.d.ts

@@ -0,0 +1,6 @@
+import { type SVGProps } from "react";
+interface IconProps extends SVGProps<SVGSVGElement> {
+    alt?: string;
+}
+export declare const AccountIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/icons/AccountIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const AccountIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "account",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M16 2a7 7 0 0 1 4.055 12.703 12.03 12.03 0 0 1 7.565 8.304l.04.157q.054.216.099.435-.108.166-.22.329l-.075.105-.155.218-.097.13a14 14 0 0 1-.493.623l-.088.101A13.97 13.97 0 0 1 16 30a13.97 13.97 0 0 1-10.565-4.817l-.156-.18q-.085-.103-.169-.207l-.069-.085a13 13 0 0 1-.255-.331l-.097-.13-.155-.218-.074-.105a14 14 0 0 1-.22-.328q.045-.22.098-.436l.04-.157q.041-.165.089-.328.038-.128.078-.254l.066-.21a12 12 0 0 1 .128-.363 12.03 12.03 0 0 1 7.205-7.148A7 7 0 0 1 16 2m0 14c-4.55 0-8.387 3.04-9.598 7.2A11.98 11.98 0 0 0 16 28c3.926 0 7.407-1.887 9.596-4.802C24.385 19.04 20.55 16 16 16m0-12a5 5 0 1 0 0 10 5 5 0 0 0 0-10" })] }));
+};
+
+export { AccountIcon };

package/dist/components/icons/AddIcon.js

@@ -8,13 +8,13 @@ const AddIcon = ({ alt, className, fill, id, ref, ...props }) => {
         "aria-labelledby": alt ? uid + "-title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "add",
-        fill: fill !== null && fill !== void 0 ? fill : "none",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
         id: uid,
         role: alt ? "img" : undefined,
         viewBox: "0 0 32 32",
         ...props,
     };
-    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M24.7 16.72a1 1 0 0 1-.7.28H8a1 1 0 1 1 0-2h16a1 1 0 0 1 1 1 1 1 0 0 1-.3.72", fill: fill !== null && fill !== void 0 ? fill : "currentColor" }), jsx("path", { d: "M16.72 24.7a1 1 0 0 1-.72.3 1 1 0 0 1-1-1V8a1 1 0 0 1 2 0v16a1 1 0 0 1-.28.7", fill: fill !== null && fill !== void 0 ? fill : "currentColor" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M15.957 4a1 1 0 0 1 1 1v10H27a1 1 0 1 1 0 2H16.957v10a1 1 0 0 1-2 0V17H5a1 1 0 1 1 0-2h9.957V5a1 1 0 0 1 1-1" })] }));
 };
 
 export { AddIcon };

package/dist/components/icons/AppsFilledIcon.d.ts

@@ -0,0 +1,6 @@
+import { type SVGProps } from "react";
+interface IconProps extends SVGProps<SVGSVGElement> {
+    alt?: string;
+}
+export declare const AppsFilledIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/icons/AppsFilledIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const AppsFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "apps-filled",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M13 17a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2zm13.204.01A2 2 0 0 1 28 19v7l-.01.204a2 2 0 0 1-1.786 1.785L26 28h-7a2 2 0 0 1-1.99-1.796L17 26v-7a2 2 0 0 1 2-2h7zM19 26h7v-7h-7zM13 4a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2zm13 0a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2h-7a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z" })] }));
+};
+
+export { AppsFilledIcon };

package/dist/components/icons/{CoopIcon.d.ts → AppsIcon.d.ts}

@@ -2,5 +2,5 @@ import { type SVGProps } from "react";
 interface IconProps extends SVGProps<SVGSVGElement> {
     alt?: string;
 }
-export declare const CoopIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AppsIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/icons/AppsIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const AppsIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "apps",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M13.204 17.01A2 2 0 0 1 15 19v7l-.01.204a2 2 0 0 1-1.786 1.785L13 28H6a2 2 0 0 1-1.99-1.796L4 26v-7a2 2 0 0 1 2-2h7zM26 17a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2h-7a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2zM6 26h7v-7H6zm7.204-21.99A2 2 0 0 1 15 6v7l-.01.204a2 2 0 0 1-1.786 1.785L13 15H6a2 2 0 0 1-1.99-1.796L4 13V6a2 2 0 0 1 2-2h7zm13 0A2 2 0 0 1 28 6v7l-.01.204a2 2 0 0 1-1.786 1.785L26 15h-7a2 2 0 0 1-1.99-1.796L17 13V6a2 2 0 0 1 2-2h7zM6 13h7V6H6zm13 0h7V6h-7z" })] }));
+};
+
+export { AppsIcon };

package/dist/components/icons/ArrowDownIcon.js

@@ -8,13 +8,13 @@ const ArrowDownIcon = ({ alt, className, fill, id, ref, ...props }) => {
         "aria-labelledby": alt ? uid + "-title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "arrow-down",
-        fill: fill !== null && fill !== void 0 ? fill : "none",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
         id: uid,
         role: alt ? "img" : undefined,
         viewBox: "0 0 32 32",
         ...props,
     };
-    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M15 28.66V3a1 1 0 0 1 2 0v25.66a1 1 0 0 1-2 0", fill: fill !== null && fill !== void 0 ? fill : "currentColor" }), jsx("path", { d: "M3 17a1 1 0 0 1 .29-.71 1 1 0 0 1 1.42 0L16 27.58l11.29-11.29a1 1 0 0 1 1.42 0 1 1 0 0 1 0 1.41l-12 12a1 1 0 0 1-1.41 0l-12-12A1 1 0 0 1 3 17", fill: fill !== null && fill !== void 0 ? fill : "currentColor" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M16 2a1 1 0 0 1 1 1v23.586l10.293-10.293a1 1 0 1 1 1.414 1.414L17.414 29a2 2 0 0 1-2.828 0L3.293 17.707a1 1 0 1 1 1.414-1.414L15 26.586V3a1 1 0 0 1 1-1" })] }));
 };
 
 export { ArrowDownIcon };

package/dist/components/icons/ArrowLeftIcon.js

@@ -8,13 +8,13 @@ const ArrowLeftIcon = ({ alt, className, fill, id, ref, ...props }) => {
         "aria-labelledby": alt ? uid + "-title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "arrow-left",
-        fill: fill !== null && fill !== void 0 ? fill : "none",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
         id: uid,
         role: alt ? "img" : undefined,
         viewBox: "0 0 32 32",
         ...props,
     };
-    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M3.34 17H29a1 1 0 0 0 0-2H3.34a1 1 0 0 0 0 2", fill: fill !== null && fill !== void 0 ? fill : "currentColor" }), jsx("path", { d: "M15 29a1 1 0 0 0 .71-.29 1 1 0 0 0 0-1.42L5.12 16.71a1 1 0 0 1 0-1.42L15.71 4.71a1 1 0 0 0 0-1.42 1 1 0 0 0-1.41 0l-12 12a1 1 0 0 0 0 1.42l12 12a1 1 0 0 0 .7.29", fill: fill !== null && fill !== void 0 ? fill : "currentColor" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M15.707 28.707a1 1 0 0 1-1.414 0L3 17.414a2 2 0 0 1 0-2.828L14.293 3.293a1 1 0 1 1 1.414 1.414L5.414 15H29a1 1 0 1 1 0 2H5.414l10.293 10.293a1 1 0 0 1 0 1.414" })] }));
 };
 
 export { ArrowLeftIcon };

package/dist/components/icons/ArrowRightIcon.js

@@ -8,13 +8,13 @@ const ArrowRightIcon = ({ alt, className, fill, id, ref, ...props }) => {
         "aria-labelledby": alt ? uid + "-title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "arrow-right",
-        fill: fill !== null && fill !== void 0 ? fill : "none",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
         id: uid,
         role: alt ? "img" : undefined,
         viewBox: "0 0 32 32",
         ...props,
     };
-    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M28.7 15H3a1 1 0 0 0 0 2h25.7a1 1 0 0 0 0-2", fill: fill !== null && fill !== void 0 ? fill : "currentColor" }), jsx("path", { d: "M17 3a1 1 0 0 0-.7.3 1 1 0 0 0 0 1.4l10.6 10.6a1 1 0 0 1 0 1.4L16.3 27.3a1 1 0 0 0 0 1.4 1 1 0 0 0 1.4 0l12-12a1 1 0 0 0 0-1.4l-12-12A1 1 0 0 0 17 3", fill: fill !== null && fill !== void 0 ? fill : "currentColor" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M16.293 3.293a1 1 0 0 1 1.414 0L29 14.586a2 2 0 0 1 0 2.828L17.707 28.707a1 1 0 1 1-1.414-1.414L26.586 17H3a1 1 0 1 1 0-2h23.586L16.293 4.707a1 1 0 0 1 0-1.414" })] }));
 };
 
 export { ArrowRightIcon };

package/dist/components/icons/ArrowUpIcon.js

@@ -8,13 +8,13 @@ const ArrowUpIcon = ({ alt, className, fill, id, ref, ...props }) => {
         "aria-labelledby": alt ? uid + "-title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "arrow-up",
-        fill: fill !== null && fill !== void 0 ? fill : "none",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
         id: uid,
         role: alt ? "img" : undefined,
         viewBox: "0 0 32 32",
         ...props,
     };
-    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M17 3.34V29a1 1 0 0 1-2 0V3.34a1 1 0 0 1 2 0", fill: fill !== null && fill !== void 0 ? fill : "currentColor" }), jsx("path", { d: "M29 15a1 1 0 0 1-.29.71 1 1 0 0 1-1.42 0L16 4.42 4.71 15.71a1 1 0 0 1-1.42 0 1 1 0 0 1 0-1.41l12-12a1 1 0 0 1 1.41 0l12 12a1 1 0 0 1 .3.7", fill: fill !== null && fill !== void 0 ? fill : "currentColor" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M14.586 3a2 2 0 0 1 2.829 0l11.308 11.309a1 1 0 0 1-1.415 1.414L17 5.413V29a1 1 0 0 1-2 0V5.414L4.692 15.723a1 1 0 0 1-1.414-1.415z" })] }));
 };
 
 export { ArrowUpIcon };

package/dist/components/icons/BackspaceFilledIcon.d.ts

@@ -0,0 +1,6 @@
+import { type SVGProps } from "react";
+interface IconProps extends SVGProps<SVGSVGElement> {
+    alt?: string;
+}
+export declare const BackspaceFilledIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/icons/BackspaceFilledIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const BackspaceFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "backspace-filled",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M27.992 6a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H11.945a2 2 0 0 1-1.415-.586l-7.999-8a2 2 0 0 1 0-2.828l8-8A2 2 0 0 1 11.944 6zm-4.285 5.293a1 1 0 0 0-1.414 0L19 14.586l-3.293-3.293a1 1 0 1 0-1.414 1.414L17.586 16l-3.293 3.293a1 1 0 1 0 1.414 1.414L19 17.414l3.293 3.293a1 1 0 0 0 1.414-1.414L20.414 16l3.293-3.293a1 1 0 0 0 0-1.414" })] }));
+};
+
+export { BackspaceFilledIcon };

package/dist/components/icons/{AvatarAltIcon.d.ts → BackspaceIcon.d.ts}

@@ -2,5 +2,5 @@ import { type SVGProps } from "react";
 interface IconProps extends SVGProps<SVGSVGElement> {
     alt?: string;
 }
-export declare const AvatarAltIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BackspaceIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/icons/BackspaceIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const BackspaceIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "backspace",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M27.991 6a2 2 0 0 1 2 2v16l-.01.204A2 2 0 0 1 27.991 26H11.944l-.198-.01a2 2 0 0 1-1.217-.576l-7.998-8a2 2 0 0 1-.137-2.677l.137-.151 7.998-8c.328-.328.76-.53 1.217-.576l.198-.01zM3.945 16l8 8H27.99V8H11.944zm18.348-4.707a1 1 0 0 1 1.414 1.414L20.414 16l3.293 3.293a1 1 0 1 1-1.414 1.414L19 17.414l-3.293 3.293a1 1 0 0 1-1.414-1.414L17.586 16l-3.293-3.293a1 1 0 1 1 1.414-1.414L19 14.586z" })] }));
+};
+
+export { BackspaceIcon };

package/dist/components/icons/{CoopLocationIcon.d.ts → BasketFilledIcon.d.ts}

@@ -2,5 +2,5 @@ import { type SVGProps } from "react";
 interface IconProps extends SVGProps<SVGSVGElement> {
     alt?: string;
 }
-export declare const CoopLocationIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BasketFilledIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/icons/BasketFilledIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const BasketFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "basket-filled",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M19.293 5.293a1 1 0 0 1 1.414 0L26.414 11H28a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-.308l-1.431 9.304A2 2 0 0 1 24.284 28H7.716a2 2 0 0 1-1.977-1.696L4.308 17H4a2 2 0 0 1-2-2v-2a2 2 0 0 1 2-2h1.586l5.707-5.707a1 1 0 1 1 1.414 1.414L8.414 11h15.172l-4.293-4.293a1 1 0 0 1 0-1.414M16 19a1 1 0 0 0-1 1v3a1 1 0 0 0 2 0v-3a1 1 0 0 0-1-1m-4.514.836a1 1 0 0 0-1.972.328l.5 3a1 1 0 0 0 1.972-.328zm10.178-.822a1 1 0 0 0-1.15.822l-.5 3a1 1 0 0 0 1.972.328l.5-3a1 1 0 0 0-.822-1.15" })] }));
+};
+
+export { BasketFilledIcon };

package/dist/components/icons/BasketIcon.js

@@ -8,13 +8,13 @@ const BasketIcon = ({ alt, className, fill, id, ref, ...props }) => {
         "aria-labelledby": alt ? uid + "-title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "basket",
-        fill: fill !== null && fill !== void 0 ? fill : "none",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
         id: uid,
         role: alt ? "img" : undefined,
         viewBox: "0 0 32 32",
         ...props,
     };
-    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M16.07 26a1 1 0 0 0 1-1v-4.08a1 1 0 1 0-2 0V25a1 1 0 0 0 1 1M21.5 26h.17a1 1 0 0 0 1-.85l.68-4.07a1 1 0 0 0-.82-1.18 1 1 0 0 0-1.16.84l-.67 4.07a1 1 0 0 0 .8 1.19M10.43 26h.17a1 1 0 0 0 .82-1.18l-.68-4.07a1 1 0 0 0-1.15-.84 1 1 0 0 0-.82 1.18l.67 4.07a1 1 0 0 0 .99.84", fill: fill !== null && fill !== void 0 ? fill : "currentColor" }), jsx("path", { d: "M31 10.7h-3.11l-8.25-8.4a1 1 0 0 0-1.41 0 1 1 0 0 0 0 1.44l6.83 7H6.85l6.8-6.93a1 1 0 0 0 0-1.44 1 1 0 0 0-1.42 0l-8.14 8.25a1 1 0 0 0 0 .08H1a1 1 0 0 0-1 1v5.1a1 1 0 0 0 1 1h1.23l1.88 11.36a1 1 0 0 0 1 .84H27a1 1 0 0 0 1-.84l1.88-11.34H31a1 1 0 0 0 1-1v-5.1a1 1 0 0 0-1-1.02M26.15 28H5.94L4.28 18h23.53ZM30 15.79H2v-3.06h28Z", fill: fill !== null && fill !== void 0 ? fill : "currentColor" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M19.293 5.293a1 1 0 0 1 1.414 0L26.414 11H28a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-.308l-1.431 9.304a2 2 0 0 1-1.793 1.687l-.184.009H7.716a2 2 0 0 1-1.94-1.516l-.037-.18L4.308 17H4a2 2 0 0 1-2-2v-2a2 2 0 0 1 2-2h1.586l5.707-5.707a1 1 0 1 1 1.414 1.414L8.414 11h15.172l-4.293-4.293a1 1 0 0 1 0-1.414M7.716 26h16.568l1.385-9H6.33zM16 19a1 1 0 0 1 1 1v3a1 1 0 0 1-2 0v-3a1 1 0 0 1 1-1m-5.664.014a1 1 0 0 1 1.15.822l.5 3a1 1 0 0 1-1.972.328l-.5-3a1 1 0 0 1 .822-1.15m10.178.822a1 1 0 0 1 1.972.328l-.5 3a1 1 0 0 1-1.972-.328zM4 15h24v-2H4z" })] }));
 };
 
 export { BasketIcon };

package/dist/components/icons/BellFilledIcon.d.ts

@@ -0,0 +1,6 @@
+import { type SVGProps } from "react";
+interface IconProps extends SVGProps<SVGSVGElement> {
+    alt?: string;
+}
+export declare const BellFilledIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/icons/BellFilledIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const BellFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "bell-filled",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M27 26a1 1 0 0 0 0-2H5a1 1 0 1 0 0 2zM19 27a3 3 0 1 1-6 0zM13 5a3 3 0 1 1 6 0z" }), jsx("path", { d: "M16 5a9 9 0 0 1 9 9v11H7V14l.012-.463A9 9 0 0 1 16 5Z", strokeWidth: "2" })] }));
+};
+
+export { BellFilledIcon };

package/dist/components/icons/BellIcon.d.ts

@@ -0,0 +1,6 @@
+import { type SVGProps } from "react";
+interface IconProps extends SVGProps<SVGSVGElement> {
+    alt?: string;
+}
+export declare const BellIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/icons/BellIcon.js

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useId } from '../../hooks/useId.js';
+
+const BellIcon = ({ alt, className, fill, id, ref, ...props }) => {
+    const uid = useId(id);
+    const componentProps = {
+        "aria-labelledby": alt ? uid + "-title" : undefined,
+        className: clsx("coop-icon", className),
+        "data-icon": "bell",
+        fill: fill !== null && fill !== void 0 ? fill : "currentColor",
+        id: uid,
+        role: alt ? "img" : undefined,
+        viewBox: "0 0 32 32",
+        ...props,
+    };
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "-title", children: alt }) : null, jsx("path", { d: "M19 26.999a3 3 0 0 1-6 0zM16 2a3 3 0 0 1 2.946 2.441C23.031 5.7 26 9.503 26 14v10h1a1 1 0 1 1 0 2H5a1 1 0 0 1 0-2h1V14c0-4.497 2.968-8.3 7.052-9.559A3 3 0 0 1 16 2m0 4a8 8 0 0 0-8 8v10h16V14a8 8 0 0 0-8-8" })] }));
+};
+
+export { BellIcon };

package/dist/components/icons/{CloseIcon.d.ts → BroomIcon.d.ts}

@@ -2,5 +2,5 @@ import { type SVGProps } from "react";
 interface IconProps extends SVGProps<SVGSVGElement> {
     alt?: string;
 }
-export declare const CloseIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BroomIcon: ({ alt, className, fill, id, ref, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
 export {};