npm - @coopdigital/react - Versions diffs - 1.3.0 → 1.4.0 - Mend

@coopdigital/react 1.3.0 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (218) hide show

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

@@ -34,7 +34,7 @@ export interface SearchboxProps extends FormHTMLAttributes<HTMLFormElement> {
 export declare const Searchbox: {
     ({ action, children, className, id, label, labelVisible, onSubmit, ref, size, variant, ...props }: SearchboxProps): JSX.Element;
     Button: {
-        ({ children, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+        ({ children, id, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
         config: {
             name: string;
         };

package/dist/components/Searchbox/Searchbox.js CHANGED Viewed

@@ -15,11 +15,6 @@ const componentSlots = {
     SearchboxButton: null,
     SearchboxInput: null,
 };
-const defaultButtonText = React.createElement(SearchIcon, {
-    alt: "Search",
-    stroke: "currentColor",
-    width: 24,
-});
 const Searchbox = ({ action, children, className, id, label, labelVisible = false, onSubmit, ref, size, variant = "solid", ...props }) => {
     const slots = { ...useSlots(componentSlots, children) };
     const [isPending, setIsPending] = useState(false);
@@ -45,7 +40,7 @@ const Searchbox = ({ action, children, className, id, label, labelVisible = fals
         className: clsx("coop-searchbox", borderClass, className),
         "data-size": size !== null && size !== void 0 ? size : undefined,
         "data-variant": variant.length && variant !== "solid" ? variant : undefined,
-        id: uid + "-form",
+        id: uid + "__form",
         onSubmit: onSubmit ? handleSubmit : undefined,
         ...props,
     };
@@ -65,9 +60,10 @@ const Searchbox = ({ action, children, className, id, label, labelVisible = fals
     };
     return (jsxs("form", { ...formProps, ref: ref, children: [label && jsx(Field.Label, { ...labelProps, children: label }), jsxs("div", { className: clsx("coop-searchbox--inner"), children: [jsx(Field, { children: slots.SearchboxInput }), slots.SearchboxButton] })] }));
 };
-const SearchboxButton = ({ children, ...props }) => {
+const SearchboxButton = ({ children, id, ...props }) => {
+    const uid = useId(id);
     const buttonProps = {
-        children: children !== null && children !== void 0 ? children : defaultButtonText,
+        children: children !== null && children !== void 0 ? children : (jsx(SearchIcon, { alt: "Search", id: uid + "__icon", stroke: "currentColor", width: "24" })),
         ...props,
     };
     return jsx(Button, { ...buttonProps });

package/dist/components/icons/AccountCircleFilledIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "account-circle-filled",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const AccountCircleFilledIcon = ({ alt, className, fill, id, ref, ...props }) =>
         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" })] }));
+    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.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "account-circle",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const AccountCircleIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "account-filled",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const AccountFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "account",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const AccountIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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 CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const AddIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "add",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const AddIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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.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" })] }));
+    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.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "apps-filled",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const AppsFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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/AppsIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "apps",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const AppsIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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 CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const ArrowDownIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "arrow-down",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const ArrowDownIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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 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" })] }));
+    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 CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const ArrowLeftIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "arrow-left",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const ArrowLeftIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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.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" })] }));
+    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 CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const ArrowRightIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "arrow-right",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const ArrowRightIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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.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" })] }));
+    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 CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const ArrowUpIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "arrow-up",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const ArrowUpIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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: "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" })] }));
+    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.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "backspace-filled",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const BackspaceFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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/BackspaceIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "backspace",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const BackspaceIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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/BasketFilledIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "basket-filled",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const BasketFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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 CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const BasketIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "basket",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const BasketIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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-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" })] }));
+    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.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "bell-filled",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const BellFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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.js CHANGED Viewed

@@ -5,7 +5,7 @@ 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,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "bell",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const BellIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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" })] }));
+    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/BroomIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const BroomIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "broom",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const BroomIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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 2a4 4 0 0 1 4 4v11h6a2 2 0 0 1 2 2v2h.015l1.449 6.57a2 2 0 0 1-1.718 2.416l-.235.014H4.544l-.24-.014a2 2 0 0 1-1.746-2.222l.043-.236L4 21.76V19a2 2 0 0 1 2-2h6V6a4 4 0 0 1 4-4M4.544 28H9v-2a1 1 0 1 1 2 0v2h4v-2a1 1 0 0 1 2 0v2h4v-2a1 1 0 0 1 2 0v2h4.51l-1.102-5H5.757zM6 21h20v-2H6zM16 4a2 2 0 0 0-2 2v11h4V6a2 2 0 0 0-2-2" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M16 2a4 4 0 0 1 4 4v11h6a2 2 0 0 1 2 2v2h.015l1.449 6.57a2 2 0 0 1-1.718 2.416l-.235.014H4.544l-.24-.014a2 2 0 0 1-1.746-2.222l.043-.236L4 21.76V19a2 2 0 0 1 2-2h6V6a4 4 0 0 1 4-4M4.544 28H9v-2a1 1 0 1 1 2 0v2h4v-2a1 1 0 0 1 2 0v2h4v-2a1 1 0 0 1 2 0v2h4.51l-1.102-5H5.757zM6 21h20v-2H6zM16 4a2 2 0 0 0-2 2v11h4V6a2 2 0 0 0-2-2" })] }));
 };
 export { BroomIcon };

package/dist/components/icons/CalendarFilledIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const CalendarFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "calendar-filled",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const CalendarFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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: "M23 2a1 1 0 0 1 1 1v1h2a2 2 0 0 1 2 2v20a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2V3a1 1 0 0 1 2 0v1h12V3a1 1 0 0 1 1-1M9 20a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zm6 0a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zm6 0a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zM9 14a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zm6 0a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zm6 0a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zM6 10h20V6h-2v1a1 1 0 1 1-2 0V6H10v1a1 1 0 0 1-2 0V6H6z" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M23 2a1 1 0 0 1 1 1v1h2a2 2 0 0 1 2 2v20a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2V3a1 1 0 0 1 2 0v1h12V3a1 1 0 0 1 1-1M9 20a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zm6 0a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zm6 0a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zM9 14a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zm6 0a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zm6 0a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1zM6 10h20V6h-2v1a1 1 0 1 1-2 0V6H10v1a1 1 0 0 1-2 0V6H6z" })] }));
 };
 export { CalendarFilledIcon };

package/dist/components/icons/CalendarIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const CalendarIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "calendar",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const CalendarIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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: "M23 2a1 1 0 0 1 1 1v1h2a2 2 0 0 1 2 2v20a2 2 0 0 1-1.796 1.99L26 28H6l-.204-.01a2 2 0 0 1-1.785-1.786L4 26V6a2 2 0 0 1 2-2h2V3a1 1 0 0 1 2 0v1h12V3a1 1 0 0 1 1-1M6 26h20V12H6zm5-6a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm6 0a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm6 0a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm-12-6a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm6 0a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm6 0a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zM6 10h20V6h-2v1a1 1 0 1 1-2 0V6H10v1a1 1 0 0 1-2 0V6H6z" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M23 2a1 1 0 0 1 1 1v1h2a2 2 0 0 1 2 2v20a2 2 0 0 1-1.796 1.99L26 28H6l-.204-.01a2 2 0 0 1-1.785-1.786L4 26V6a2 2 0 0 1 2-2h2V3a1 1 0 0 1 2 0v1h12V3a1 1 0 0 1 1-1M6 26h20V12H6zm5-6a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm6 0a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm6 0a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm-12-6a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm6 0a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zm6 0a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1zM6 10h20V6h-2v1a1 1 0 1 1-2 0V6H10v1a1 1 0 0 1-2 0V6H6z" })] }));
 };
 export { CalendarIcon };

package/dist/components/icons/CashFilledIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const CashFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "cash-filled",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const CashFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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 6a2 2 0 0 1 2 2v12a2 2 0 0 1-1.796 1.99L28 22h-2v2a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V12a2 2 0 0 1 2-2h2V8a2 2 0 0 1 2-2zm-12.5 7c-.948 0-1.846.287-2.51.933-.668.65-.99 1.554-.99 2.567v.5h-.5a1 1 0 1 0 0 2h.5v2h-.5a1 1 0 1 0 0 2H16a1 1 0 1 0 0-2h-2v-2h1a1 1 0 1 0 0-2h-1v-.5c0-.587.179-.933.385-1.133.21-.205.564-.367 1.115-.367q.19.001.335.026a1 1 0 0 0 .33-1.972A4 4 0 0 0 15.5 13m8.5-3a2 2 0 0 1 2 2v8h2V8H8v2z" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M28 6a2 2 0 0 1 2 2v12a2 2 0 0 1-1.796 1.99L28 22h-2v2a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V12a2 2 0 0 1 2-2h2V8a2 2 0 0 1 2-2zm-12.5 7c-.948 0-1.846.287-2.51.933-.668.65-.99 1.554-.99 2.567v.5h-.5a1 1 0 1 0 0 2h.5v2h-.5a1 1 0 1 0 0 2H16a1 1 0 1 0 0-2h-2v-2h1a1 1 0 1 0 0-2h-1v-.5c0-.587.179-.933.385-1.133.21-.205.564-.367 1.115-.367q.19.001.335.026a1 1 0 0 0 .33-1.972A4 4 0 0 0 15.5 13m8.5-3a2 2 0 0 1 2 2v8h2V8H8v2z" })] }));
 };
 export { CashFilledIcon };

package/dist/components/icons/CashIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const CashIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "cash",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const CashIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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.5 13q.352 0 .665.054a1 1 0 0 1-.33 1.972A2 2 0 0 0 15.5 15c-.551 0-.904.162-1.115.367-.206.2-.385.546-.385 1.133v.5h1a1 1 0 1 1 0 2h-1v2h2a1 1 0 1 1 0 2h-4.5a1 1 0 1 1 0-2h.5v-2h-.5a1 1 0 1 1 0-2h.5v-.5c0-1.013.322-1.918.99-2.567.664-.646 1.562-.933 2.51-.933" }), jsx("path", { clipRule: "evenodd", d: "M28 6a2 2 0 0 1 2 2v12a2 2 0 0 1-1.796 1.99L28 22h-2v2a2 2 0 0 1-1.796 1.99L24 26H4l-.204-.01A2 2 0 0 1 2 24V12a2 2 0 0 1 2-2h2V8a2 2 0 0 1 2-2zM4 24h20V12H4zm4-14h16a2 2 0 0 1 2 2v8h2V8H8z", fillRule: "evenodd" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M15.5 13q.352 0 .665.054a1 1 0 0 1-.33 1.972A2 2 0 0 0 15.5 15c-.551 0-.904.162-1.115.367-.206.2-.385.546-.385 1.133v.5h1a1 1 0 1 1 0 2h-1v2h2a1 1 0 1 1 0 2h-4.5a1 1 0 1 1 0-2h.5v-2h-.5a1 1 0 1 1 0-2h.5v-.5c0-1.013.322-1.918.99-2.567.664-.646 1.562-.933 2.51-.933" }), jsx("path", { clipRule: "evenodd", d: "M28 6a2 2 0 0 1 2 2v12a2 2 0 0 1-1.796 1.99L28 22h-2v2a2 2 0 0 1-1.796 1.99L24 26H4l-.204-.01A2 2 0 0 1 2 24V12a2 2 0 0 1 2-2h2V8a2 2 0 0 1 2-2zM4 24h20V12H4zm4-14h16a2 2 0 0 1 2 2v8h2V8H8z", fillRule: "evenodd" })] }));
 };
 export { CashIcon };

package/dist/components/icons/ChevronDownIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const ChevronDownIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "chevron-down",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const ChevronDownIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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: "M7.707 11.293a1 1 0 1 0-1.414 1.414L14.586 21a2 2 0 0 0 2.828 0l8.293-8.293a1 1 0 1 0-1.414-1.414L16 19.586z" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M7.707 11.293a1 1 0 1 0-1.414 1.414L14.586 21a2 2 0 0 0 2.828 0l8.293-8.293a1 1 0 1 0-1.414-1.414L16 19.586z" })] }));
 };
 export { ChevronDownIcon };

package/dist/components/icons/ChevronLeftIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const ChevronLeftIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "chevron-left",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const ChevronLeftIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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: "M20.707 7.707a1 1 0 1 0-1.414-1.414L11 14.586a2 2 0 0 0 0 2.828l8.293 8.293a1 1 0 1 0 1.414-1.414L12.414 16z" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M20.707 7.707a1 1 0 1 0-1.414-1.414L11 14.586a2 2 0 0 0 0 2.828l8.293 8.293a1 1 0 1 0 1.414-1.414L12.414 16z" })] }));
 };
 export { ChevronLeftIcon };

package/dist/components/icons/ChevronRightIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const ChevronRightIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "chevron-right",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const ChevronRightIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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: "M11.293 24.293a1 1 0 1 0 1.414 1.414L21 17.414a2 2 0 0 0 0-2.828l-8.293-8.293a1 1 0 1 0-1.414 1.414L19.586 16z" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M11.293 24.293a1 1 0 1 0 1.414 1.414L21 17.414a2 2 0 0 0 0-2.828l-8.293-8.293a1 1 0 1 0-1.414 1.414L19.586 16z" })] }));
 };
 export { ChevronRightIcon };

package/dist/components/icons/ChevronUpIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const ChevronUpIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "chevron-up",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const ChevronUpIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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.293 20.707a1 1 0 1 0 1.414-1.414L17.414 11a2 2 0 0 0-2.828 0l-8.293 8.293a1 1 0 1 0 1.414 1.414L16 12.414z" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M24.293 20.707a1 1 0 1 0 1.414-1.414L17.414 11a2 2 0 0 0-2.828 0l-8.293 8.293a1 1 0 1 0 1.414 1.414L16 12.414z" })] }));
 };
 export { ChevronUpIcon };

package/dist/components/icons/CircleBurgerFilledIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const CircleBurgerFilledIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "circle-burger-filled",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const CircleBurgerFilledIcon = ({ alt, className, fill, id, ref, ...props }) =>
         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 2.001c7.732 0 14 6.268 14 14s-6.268 14-14 14-14-6.268-14-14 6.268-14 14-14M11.003 20a1 1 0 1 0 0 2H21a1 1 0 1 0 0-2zm0-4.982a1 1 0 0 0 0 2H21a1 1 0 1 0 0-2zm0-5.018a1 1 0 1 0 0 2H21a1 1 0 1 0 0-2z" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M16 2.001c7.732 0 14 6.268 14 14s-6.268 14-14 14-14-6.268-14-14 6.268-14 14-14M11.003 20a1 1 0 1 0 0 2H21a1 1 0 1 0 0-2zm0-4.982a1 1 0 0 0 0 2H21a1 1 0 1 0 0-2zm0-5.018a1 1 0 1 0 0 2H21a1 1 0 1 0 0-2z" })] }));
 };
 export { CircleBurgerFilledIcon };

package/dist/components/icons/CircleBurgerIcon.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { useId } from '../../hooks/useId.js';
 const CircleBurgerIcon = ({ alt, className, fill, id, ref, ...props }) => {
     const uid = useId(id);
     const componentProps = {
-        "aria-labelledby": alt ? uid + "-title" : undefined,
+        "aria-labelledby": alt ? uid + "__title" : undefined,
         className: clsx("coop-icon", className),
         "data-icon": "circle-burger",
         fill: fill !== null && fill !== void 0 ? fill : "currentColor",
@@ -14,7 +14,7 @@ const CircleBurgerIcon = ({ alt, className, fill, id, ref, ...props }) => {
         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 2.001c7.732 0 14 6.268 14 14s-6.268 14-14 14-14-6.268-14-14 6.268-14 14-14m0 2c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12M21 20a1 1 0 1 1 0 2h-9.997a1 1 0 1 1 0-2zm0-4.982a1 1 0 0 1 0 2h-9.997a1 1 0 1 1 0-2zM21 10a1 1 0 1 1 0 2h-9.997a1 1 0 1 1 0-2z" })] }));
+    return (jsxs("svg", { ...componentProps, ref: ref, children: [alt ? jsx("title", { id: uid + "__title", children: alt }) : null, jsx("path", { d: "M16 2.001c7.732 0 14 6.268 14 14s-6.268 14-14 14-14-6.268-14-14 6.268-14 14-14m0 2c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12M21 20a1 1 0 1 1 0 2h-9.997a1 1 0 1 1 0-2zm0-4.982a1 1 0 0 1 0 2h-9.997a1 1 0 1 1 0-2zM21 10a1 1 0 1 1 0 2h-9.997a1 1 0 1 1 0-2z" })] }));
 };
 export { CircleBurgerIcon };