@krrli/cm-designsystem 1.32.1 → 1.32.3

package/dist/components/accessible-button/AccessibleButton.d.ts

@@ -30,3 +30,4 @@ interface AccessibleButtonProps extends BaseAccessibleButtonProps {
  */
 export declare const AccessibleButton: React.FC<AccessibleButtonProps>;
 export {};
+//# sourceMappingURL=AccessibleButton.d.ts.map

package/dist/components/accessible-button/AccessibleButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccessibleButton.d.ts","sourceRoot":"","sources":["../../../src/components/accessible-button/AccessibleButton.tsx"],"names":[],"mappings":"AAYA;;GAEG;AACH,MAAM,WAAW,yBAAyB;IACxC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC;IAE7D;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,UAAU,qBAAsB,SAAQ,yBAAyB;IAC/D;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAoB5D,CAAC"}

package/dist/components/accessible-button/AccessibleButton.js

@@ -1,16 +1,34 @@
 "use client";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import { cn, tv } from "tailwind-variants";
 const accessibleButtonStyles = tv({
-    variants: {
-        isClickable: {
-            true: ["cursor-pointer", "**:cursor-pointer"],
-        },
-    },
+  variants: {
+    isClickable: {
+      true: ["cursor-pointer", "**:cursor-pointer"]
+    }
+  }
 });
-/**
- * A fully accessible button component.
- */
-export const AccessibleButton = ({ className, ariaLabel, onClick, type = "button", ...props }) => {
-    return (_jsx("button", { type: type, className: cn(accessibleButtonStyles({ isClickable: !!onClick }), className), "aria-label": ariaLabel, onClick: onClick, children: props.children }));
+const AccessibleButton = ({
+  className,
+  ariaLabel,
+  onClick,
+  type = "button",
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type,
+      className: cn(
+        accessibleButtonStyles({ isClickable: !!onClick }),
+        className
+      ),
+      "aria-label": ariaLabel,
+      onClick,
+      children: props.children
+    }
+  );
+};
+export {
+  AccessibleButton
 };

package/dist/components/avatar/Avatar.d.ts

@@ -1,5 +1,5 @@
-import { type VariantProps } from "tailwind-variants";
-declare const avatarStyles: import("tailwind-variants").TVReturnType<{
+import { VariantProps } from 'tailwind-variants';
+declare const avatarStyles: import('tailwind-variants').TVReturnType<{
     isClickable: {
         true: {
             base: string[];
@@ -47,7 +47,7 @@ declare const avatarStyles: import("tailwind-variants").TVReturnType<{
     base: string[];
     avatar: string[];
     action: string[];
-}, import("tailwind-variants").TVReturnType<{
+}, import('tailwind-variants').TVReturnType<{
     isClickable: {
         true: {
             base: string[];
@@ -116,3 +116,4 @@ interface AvatarProps extends AvatarVariants {
  */
 export declare const Avatar: React.FC<AvatarProps>;
 export {};
+//# sourceMappingURL=Avatar.d.ts.map

package/dist/components/avatar/Avatar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/Avatar.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAK1D,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAwDhB,CAAC;AAEH,KAAK,cAAc,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AACxD,KAAK,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C;;GAEG;AACH,UAAU,WAAY,SAAQ,cAAc;IAC1C;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,IAAI,EAAE,UAAU,CAAC;IAEjB;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B;;;;;;;OAOG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA6BxC,CAAC"}

package/dist/components/avatar/Avatar.js

@@ -1,72 +1,98 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import * as RadixAvatar from "@radix-ui/react-avatar";
 import { tv } from "tailwind-variants";
-import fallbackImage from "../../assets/fallback.png";
-import { Edit } from "../icons/generated";
-import { RoundButton } from "../round-button/RoundButton";
+import fallbackImage from "../../assets/fallback.png.js";
+import { RoundButton } from "../round-button/RoundButton.js";
+import { Edit } from "../icons/generated/Edit.js";
 const avatarStyles = tv({
-    slots: {
-        base: ["relative", "inline-block"],
-        avatar: [
-            "rounded-full",
-            "transition",
-            "duration-300",
-            "ease-in-out",
-            "min-w-10",
-            "min-h-10",
-            "flex",
-            "items-center",
-            "justify-center",
-        ],
-        action: ["absolute", "bottom-2", "right-2"],
-    },
-    variants: {
-        isClickable: {
-            true: { base: ["**:cursor-pointer"] },
-        },
-        size: {
-            sm: { avatar: ["w-10", "h-10", "hover:scale-105"] },
-            md: {
-                avatar: [
-                    "w-16",
-                    "h-16",
-                    "border",
-                    "border-solid",
-                    "border-slate-100",
-                    "border-6",
-                    "hover:scale-105",
-                ],
-            },
-            lg: {
-                avatar: [
-                    "w-24",
-                    "h-24",
-                    "border",
-                    "border-solid",
-                    "border-slate-100",
-                    "border-6",
-                    "hover:scale-95",
-                ],
-            },
-            xl: {
-                avatar: [
-                    "w-40",
-                    "h-40",
-                    "border",
-                    "border-solid",
-                    "border-slate-100",
-                    "border-6",
-                ],
-            },
-        },
+  slots: {
+    base: ["relative", "inline-block"],
+    avatar: [
+      "rounded-full",
+      "transition",
+      "duration-300",
+      "ease-in-out",
+      "min-w-10",
+      "min-h-10",
+      "flex",
+      "items-center",
+      "justify-center"
+    ],
+    action: ["absolute", "bottom-2", "right-2"]
+  },
+  variants: {
+    isClickable: {
+      true: { base: ["**:cursor-pointer"] }
     },
+    size: {
+      sm: { avatar: ["w-10", "h-10", "hover:scale-105"] },
+      md: {
+        avatar: [
+          "w-16",
+          "h-16",
+          "border",
+          "border-solid",
+          "border-slate-100",
+          "border-6",
+          "hover:scale-105"
+        ]
+      },
+      lg: {
+        avatar: [
+          "w-24",
+          "h-24",
+          "border",
+          "border-solid",
+          "border-slate-100",
+          "border-6",
+          "hover:scale-95"
+        ]
+      },
+      xl: {
+        avatar: [
+          "w-40",
+          "h-40",
+          "border",
+          "border-solid",
+          "border-slate-100",
+          "border-6"
+        ]
+      }
+    }
+  }
 });
-/**
- * A flexible and accessible user avatar component.
- * Built on top of Radix UI’s `Avatar` primitives and styled with Tailwind variants.
- */
-export const Avatar = (props) => {
-    const { base, avatar, action } = avatarStyles(props);
-    return (_jsxs(RadixAvatar.Root, { onClick: props.onAvatarClick, className: base({ isClickable: !!props.onAvatarClick, ...props }), "data-testid": "avatar", children: [_jsx(RadixAvatar.Image, { src: props.src, alt: props.alt, className: avatar(props) }), props.size === "xl" && props.onActionClick && (_jsx("div", { className: action(props), children: _jsx(RoundButton, { intent: "primary", ariaLabel: props.actionAriaLabel ?? "", icon: Edit, onClick: props.onActionClick }) })), _jsx(RadixAvatar.Fallback, { children: _jsx("img", { src: fallbackImage, alt: props.alt, className: avatar(props) }) })] }));
+const Avatar = (props) => {
+  const { base, avatar, action } = avatarStyles(props);
+  return /* @__PURE__ */ jsxs(
+    RadixAvatar.Root,
+    {
+      onClick: props.onAvatarClick,
+      className: base({ isClickable: !!props.onAvatarClick, ...props }),
+      "data-testid": "avatar",
+      children: [
+        /* @__PURE__ */ jsx(
+          RadixAvatar.Image,
+          {
+            src: props.src,
+            alt: props.alt,
+            className: avatar(props)
+          }
+        ),
+        props.size === "xl" && props.onActionClick && /* @__PURE__ */ jsx("div", { className: action(props), children: /* @__PURE__ */ jsx(
+          RoundButton,
+          {
+            intent: "primary",
+            ariaLabel: props.actionAriaLabel ?? "",
+            icon: Edit,
+            onClick: props.onActionClick
+          }
+        ) }),
+        /* @__PURE__ */ jsx(RadixAvatar.Fallback, { children: /* @__PURE__ */ jsx("img", { src: fallbackImage, alt: props.alt, className: avatar(props) }) })
+      ]
+    }
+  );
+};
+export {
+  Avatar
 };

package/dist/components/branding/BrandingGallery.d.ts

@@ -1 +1,2 @@
 export declare const BrandingGallery: React.FC;
+//# sourceMappingURL=BrandingGallery.d.ts.map

package/dist/components/branding/BrandingGallery.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrandingGallery.d.ts","sourceRoot":"","sources":["../../../src/components/branding/BrandingGallery.tsx"],"names":[],"mappings":"AAsGA,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EA+FnC,CAAC"}

package/dist/components/branding/BrandingGallery.js

@@ -1,147 +1,214 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import appIconGradient from "./app-icon-gradient.svg";
-import appIconWhite from "./app-icon-white.svg";
-import hoverLogoDefault from "./hover-logo-default.svg";
-import hoverLogoHovered from "./hover-logo-hovered.svg";
-import logoInlineGradient from "./logo-inline-gradient.svg";
-import logoInlineViolet from "./logo-inline-violet.svg";
-import logoInlineWhite from "./logo-inline-white.svg";
-import logoStackedGradient from "./logo-stacked-gradient.svg";
-import logoStackedViolet from "./logo-stacked-violet.svg";
-import logoStackedWhite from "./logo-stacked-white.svg";
-import superzeichen from "./superzeichen.svg";
+import { jsx, jsxs } from "react/jsx-runtime";
+import appIconGradient from "./app-icon-gradient.svg.js";
+import appIconWhite from "./app-icon-white.svg.js";
+import hoverLogoDefault from "./hover-logo-default.svg.js";
+import hoverLogoHovered from "./hover-logo-hovered.svg.js";
+import logoInlineGradient from "./logo-inline-gradient.svg.js";
+import logoInlineViolet from "./logo-inline-violet.svg.js";
+import logoInlineWhite from "./logo-inline-white.svg.js";
+import logoStackedGradient from "./logo-stacked-gradient.svg.js";
+import logoStackedViolet from "./logo-stacked-violet.svg.js";
+import logoStackedWhite from "./logo-stacked-white.svg.js";
+import superzeichen from "./superzeichen.svg.js";
 const brandingAssets = {
-    "App Icons": [
-        {
-            name: "App Icon Gradient",
-            src: appIconGradient,
-            width: 64,
-            height: 64,
-            filename: "app-icon-gradient.svg",
-        },
-        {
-            name: "App Icon White",
-            src: appIconWhite,
-            width: 64,
-            height: 64,
-            filename: "app-icon-white.svg",
-        },
-    ],
-    Logos: [
-        {
-            name: "Logo Inline Gradient",
-            src: logoInlineGradient,
-            width: 335,
-            height: 64,
-            filename: "logo-inline-gradient.svg",
-        },
-        {
-            name: "Logo Inline Violet",
-            src: logoInlineViolet,
-            width: 335,
-            height: 64,
-            filename: "logo-inline-violet.svg",
-        },
-        {
-            name: "Logo Inline White",
-            src: logoInlineWhite,
-            width: 335,
-            height: 64,
-            filename: "logo-inline-white.svg",
-        },
-        {
-            name: "Logo Stacked Gradient",
-            src: logoStackedGradient,
-            width: 210,
-            height: 80,
-            filename: "logo-stacked-gradient.svg",
-        },
-        {
-            name: "Logo Stacked Violet",
-            src: logoStackedViolet,
-            width: 210,
-            height: 80,
-            filename: "logo-stacked-violet.svg",
-        },
-        {
-            name: "Logo Stacked White",
-            src: logoStackedWhite,
-            width: 210,
-            height: 80,
-            filename: "logo-stacked-white.svg",
-        },
-    ],
-    "Hover Logo": [
-        {
-            name: "Hover Logo Default",
-            src: hoverLogoDefault,
-            width: 64,
-            height: 64,
-            filename: "hover-logo-default.svg",
-        },
-        {
-            name: "Hover Logo Hovered",
-            src: hoverLogoHovered,
-            width: 64,
-            height: 64,
-            filename: "hover-logo-hovered.svg",
-        },
-    ],
-    Superzeichen: [
-        {
-            name: "Superzeichen",
-            src: superzeichen,
-            width: 64,
-            height: 64,
-            filename: "superzeichen.svg",
-        },
-    ],
+  "App Icons": [
+    {
+      name: "App Icon Gradient",
+      src: appIconGradient,
+      width: 64,
+      height: 64,
+      filename: "app-icon-gradient.svg"
+    },
+    {
+      name: "App Icon White",
+      src: appIconWhite,
+      width: 64,
+      height: 64,
+      filename: "app-icon-white.svg"
+    }
+  ],
+  Logos: [
+    {
+      name: "Logo Inline Gradient",
+      src: logoInlineGradient,
+      width: 335,
+      height: 64,
+      filename: "logo-inline-gradient.svg"
+    },
+    {
+      name: "Logo Inline Violet",
+      src: logoInlineViolet,
+      width: 335,
+      height: 64,
+      filename: "logo-inline-violet.svg"
+    },
+    {
+      name: "Logo Inline White",
+      src: logoInlineWhite,
+      width: 335,
+      height: 64,
+      filename: "logo-inline-white.svg"
+    },
+    {
+      name: "Logo Stacked Gradient",
+      src: logoStackedGradient,
+      width: 210,
+      height: 80,
+      filename: "logo-stacked-gradient.svg"
+    },
+    {
+      name: "Logo Stacked Violet",
+      src: logoStackedViolet,
+      width: 210,
+      height: 80,
+      filename: "logo-stacked-violet.svg"
+    },
+    {
+      name: "Logo Stacked White",
+      src: logoStackedWhite,
+      width: 210,
+      height: 80,
+      filename: "logo-stacked-white.svg"
+    }
+  ],
+  "Hover Logo": [
+    {
+      name: "Hover Logo Default",
+      src: hoverLogoDefault,
+      width: 64,
+      height: 64,
+      filename: "hover-logo-default.svg"
+    },
+    {
+      name: "Hover Logo Hovered",
+      src: hoverLogoHovered,
+      width: 64,
+      height: 64,
+      filename: "hover-logo-hovered.svg"
+    }
+  ],
+  Superzeichen: [
+    {
+      name: "Superzeichen",
+      src: superzeichen,
+      width: 64,
+      height: 64,
+      filename: "superzeichen.svg"
+    }
+  ]
+};
+const BrandingGallery = () => /* @__PURE__ */ jsx("div", { children: Object.entries(brandingAssets).map(([category, assets]) => /* @__PURE__ */ jsxs("div", { style: { marginBottom: 48 }, children: [
+  /* @__PURE__ */ jsx(
+    "h2",
+    {
+      style: {
+        fontSize: 20,
+        fontWeight: 600,
+        marginBottom: 24,
+        marginTop: 0
+      },
+      children: category
+    }
+  ),
+  /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fill, minmax(300px, 1fr))",
+        gap: 32,
+        padding: 4
+      },
+      children: assets.map(({ name, src, width, height, filename }) => {
+        const isWhiteVariant = filename.includes("white") || filename.includes("hover");
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              alignItems: "center",
+              border: "1px solid #eee",
+              padding: 24,
+              borderRadius: 8,
+              backgroundColor: "#fafafa",
+              gap: 16
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    minHeight: 120,
+                    width: "100%",
+                    backgroundColor: isWhiteVariant ? "#7c3aed" : "transparent",
+                    borderRadius: 4,
+                    padding: isWhiteVariant ? 16 : 0
+                  },
+                  children: /* @__PURE__ */ jsx(
+                    "img",
+                    {
+                      src,
+                      alt: name,
+                      style: {
+                        maxWidth: "100%",
+                        height: "auto",
+                        objectFit: "contain"
+                      }
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    textAlign: "center",
+                    width: "100%"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx("div", { style: { fontWeight: 600, marginBottom: 8 }, children: name }),
+                    /* @__PURE__ */ jsx(
+                      "code",
+                      {
+                        style: {
+                          fontSize: 11,
+                          color: "#666",
+                          display: "block",
+                          marginBottom: 4
+                        },
+                        children: filename
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      "code",
+                      {
+                        style: {
+                          fontSize: 11,
+                          color: "#666",
+                          display: "block"
+                        },
+                        children: [
+                          width,
+                          " × ",
+                          height
+                        ]
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          },
+          name
+        );
+      })
+    }
+  )
+] }, category)) });
+export {
+  BrandingGallery
 };
-export const BrandingGallery = () => (_jsx("div", { children: Object.entries(brandingAssets).map(([category, assets]) => (_jsxs("div", { style: { marginBottom: 48 }, children: [_jsx("h2", { style: {
-                    fontSize: 20,
-                    fontWeight: 600,
-                    marginBottom: 24,
-                    marginTop: 0,
-                }, children: category }), _jsx("div", { style: {
-                    display: "grid",
-                    gridTemplateColumns: "repeat(auto-fill, minmax(300px, 1fr))",
-                    gap: 32,
-                    padding: 4,
-                }, children: assets.map(({ name, src, width, height, filename }) => {
-                    const isWhiteVariant = filename.includes("white") || filename.includes("hover");
-                    return (_jsxs("div", { style: {
-                            display: "flex",
-                            flexDirection: "column",
-                            alignItems: "center",
-                            border: "1px solid #eee",
-                            padding: 24,
-                            borderRadius: 8,
-                            backgroundColor: "#fafafa",
-                            gap: 16,
-                        }, children: [_jsx("div", { style: {
-                                    display: "flex",
-                                    alignItems: "center",
-                                    justifyContent: "center",
-                                    minHeight: 120,
-                                    width: "100%",
-                                    backgroundColor: isWhiteVariant ? "#7c3aed" : "transparent",
-                                    borderRadius: 4,
-                                    padding: isWhiteVariant ? 16 : 0,
-                                }, children: _jsx("img", { src: src, alt: name, style: {
-                                        maxWidth: "100%",
-                                        height: "auto",
-                                        objectFit: "contain",
-                                    } }) }), _jsxs("div", { style: {
-                                    textAlign: "center",
-                                    width: "100%",
-                                }, children: [_jsx("div", { style: { fontWeight: 600, marginBottom: 8 }, children: name }), _jsx("code", { style: {
-                                            fontSize: 11,
-                                            color: "#666",
-                                            display: "block",
-                                            marginBottom: 4,
-                                        }, children: filename }), _jsxs("code", { style: {
-                                            fontSize: 11,
-                                            color: "#666",
-                                            display: "block",
-                                        }, children: [width, " \u00D7 ", height] })] })] }, name));
-                }) })] }, category))) }));

package/dist/components/branding/app-icon-gradient.svg.js

@@ -0,0 +1,4 @@
+const appIconGradient = "data:image/svg+xml,%3csvg%20width='160'%20height='160'%20viewBox='0%200%20160%20160'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M0%2064C0%2041.5979%200%2030.3968%204.35974%2021.8404C8.19467%2014.3139%2014.3139%208.19467%2021.8404%204.35974C30.3968%200%2041.5979%200%2064%200H96C118.402%200%20129.603%200%20138.16%204.35974C145.686%208.19467%20151.805%2014.3139%20155.64%2021.8404C160%2030.3968%20160%2041.5979%20160%2064V96C160%20118.402%20160%20129.603%20155.64%20138.16C151.805%20145.686%20145.686%20151.805%20138.16%20155.64C129.603%20160%20118.402%20160%2096%20160H64C41.5979%20160%2030.3968%20160%2021.8404%20155.64C14.3139%20151.805%208.19467%20145.686%204.35974%20138.16C0%20129.603%200%20118.402%200%2096V64Z'%20fill='url(%23paint0_linear_437_1102)'/%3e%3cg%20clip-path='url(%23clip0_437_1102)'%3e%3cpath%20d='M86.6667%2090H73.3333C71.4258%2090%2069.7135%2091.0612%2068.8607%2092.7669C68.0078%2094.4694%2068.1901%2096.4779%2069.3327%2097.9981L75.9993%20106.891C76.9531%20108.161%2078.4114%20108.89%2080%20108.89C81.5886%20108.89%2083.0469%20108.161%2084.0007%20106.888L90.6673%2098.0013C91.8099%2096.4779%2091.9922%2094.4694%2091.1393%2092.7669C90.2865%2091.0612%2088.5742%2090%2086.6667%2090Z'%20fill='white'/%3e%3cpath%20d='M116.12%2072.1517C115.235%2069.8159%20114.136%2067.4571%20112.861%2065.1422C117.135%2062.8979%20120%2058.419%20120%2053.3333C120%2045.9798%20114.02%2040%20106.667%2040C101.865%2040%2097.4064%2042.8033%2094.9882%2046.946C90.5688%2044.693%2085.5747%2043.3333%2080%2043.3333C74.4253%2043.3333%2069.4314%2044.6932%2065.0118%2046.946C62.5936%2042.8033%2058.135%2040%2053.3333%2040C45.9798%2040%2040%2045.9798%2040%2053.3333C40%2058.4184%2042.8646%2062.8971%2047.1375%2065.1416C45.8622%2067.4567%2044.7628%2069.8157%2043.877%2072.1517C40.1367%2082.0313%2037.2168%2096.0352%2044.5606%20106.67C50.6673%20115.514%2062.5911%20120%2080%20120C97.4089%20120%20109.333%20115.514%20115.439%20106.67C122.783%2096.0352%20119.86%2082.0313%20116.12%2072.1517ZM109.954%20102.881C105.166%20109.818%2095.0879%20113.333%2080%20113.333C64.9121%20113.333%2054.834%20109.818%2050.0456%20102.881C44.3457%2094.6289%2046.9368%2082.9004%2050.1107%2074.515C51.6634%2070.4199%2060.4004%2050%2080%2050C99.5996%2050%20108.337%2070.4199%20109.889%2074.515C113.063%2082.9004%20115.654%2094.6289%20109.954%20102.881Z'%20fill='white'/%3e%3cpath%20d='M72.1289%2081.2663C75.1367%2076.9889%2075.3971%2075.2864%2074.6452%2072.3437C73.2194%2066.7611%2069.6647%2065.5892%2066.9368%2065.5892C60.1595%2065.5892%2054.873%2074.7363%2054.8079%2079.3099C54.7689%2082.0573%2055.8789%2084.9186%2057.7116%2086.7773C58.9974%2088.0794%2060.5078%2088.7695%2062.0833%2088.7695C66.2923%2088.7695%2069.5247%2084.9772%2072.1289%2081.2663Z'%20fill='white'/%3e%3cpath%20d='M93.0632%2065.5892C90.3353%2065.5892%2086.7806%2066.7611%2085.3548%2072.3438C84.6029%2075.2865%2084.8633%2076.9889%2087.8711%2081.2663C90.4753%2084.9772%2093.7077%2088.7696%2097.9167%2088.7696C99.4922%2088.7696%20101.003%2088.0795%20102.288%2086.7774C104.121%2084.9186%20105.231%2082.0573%20105.192%2079.3132C105.127%2074.7363%2099.8405%2065.5892%2093.0632%2065.5892Z'%20fill='white'/%3e%3c/g%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_437_1102'%20x1='1.19209e-06'%20y1='80'%20x2='160'%20y2='80'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23EC4899'/%3e%3cstop%20offset='1'%20stop-color='%237C3AED'/%3e%3c/linearGradient%3e%3cclipPath%20id='clip0_437_1102'%3e%3crect%20width='80'%20height='80'%20fill='white'%20transform='translate(40%2040)'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e";
+export {
+  appIconGradient as default
+};

package/dist/components/branding/app-icon-white.svg.js

@@ -0,0 +1,4 @@
+const appIconWhite = "data:image/svg+xml,%3csvg%20width='160'%20height='160'%20viewBox='0%200%20160%20160'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M0%2064C0%2041.5979%200%2030.3968%204.35974%2021.8404C8.19467%2014.3139%2014.3139%208.19467%2021.8404%204.35974C30.3968%200%2041.5979%200%2064%200H96C118.402%200%20129.603%200%20138.16%204.35974C145.686%208.19467%20151.805%2014.3139%20155.64%2021.8404C160%2030.3968%20160%2041.5979%20160%2064V96C160%20118.402%20160%20129.603%20155.64%20138.16C151.805%20145.686%20145.686%20151.805%20138.16%20155.64C129.603%20160%20118.402%20160%2096%20160H64C41.5979%20160%2030.3968%20160%2021.8404%20155.64C14.3139%20151.805%208.19467%20145.686%204.35974%20138.16C0%20129.603%200%20118.402%200%2096V64Z'%20fill='white'/%3e%3cg%20clip-path='url(%23clip0_437_1105)'%3e%3cpath%20d='M86.6667%2090H73.3333C71.4258%2090%2069.7135%2091.0612%2068.8607%2092.7669C68.0078%2094.4694%2068.1901%2096.4779%2069.3327%2097.9981L75.9993%20106.891C76.9531%20108.161%2078.4114%20108.89%2080%20108.89C81.5886%20108.89%2083.0469%20108.161%2084.0007%20106.888L90.6673%2098.0013C91.8099%2096.4779%2091.9922%2094.4694%2091.1393%2092.7669C90.2865%2091.0612%2088.5742%2090%2086.6667%2090Z'%20fill='url(%23paint0_linear_437_1105)'/%3e%3cpath%20d='M116.12%2072.1517C115.235%2069.8159%20114.136%2067.4571%20112.861%2065.1422C117.135%2062.8979%20120%2058.419%20120%2053.3333C120%2045.9798%20114.02%2040%20106.667%2040C101.865%2040%2097.4064%2042.8033%2094.9882%2046.946C90.5688%2044.693%2085.5747%2043.3333%2080%2043.3333C74.4253%2043.3333%2069.4314%2044.6932%2065.0118%2046.946C62.5936%2042.8033%2058.135%2040%2053.3333%2040C45.9798%2040%2040%2045.9798%2040%2053.3333C40%2058.4184%2042.8646%2062.8971%2047.1375%2065.1416C45.8622%2067.4567%2044.7628%2069.8157%2043.877%2072.1517C40.1367%2082.0313%2037.2168%2096.0352%2044.5606%20106.67C50.6673%20115.514%2062.5911%20120%2080%20120C97.4089%20120%20109.333%20115.514%20115.439%20106.67C122.783%2096.0352%20119.86%2082.0313%20116.12%2072.1517ZM109.954%20102.881C105.166%20109.818%2095.0879%20113.333%2080%20113.333C64.9121%20113.333%2054.834%20109.818%2050.0456%20102.881C44.3457%2094.6289%2046.9368%2082.9004%2050.1107%2074.515C51.6634%2070.4199%2060.4004%2050%2080%2050C99.5996%2050%20108.337%2070.4199%20109.889%2074.515C113.063%2082.9004%20115.654%2094.6289%20109.954%20102.881Z'%20fill='url(%23paint1_linear_437_1105)'/%3e%3cpath%20d='M72.1289%2081.2663C75.1367%2076.9889%2075.3971%2075.2864%2074.6452%2072.3437C73.2194%2066.7611%2069.6647%2065.5892%2066.9368%2065.5892C60.1595%2065.5892%2054.873%2074.7363%2054.8079%2079.3099C54.7689%2082.0573%2055.8789%2084.9186%2057.7116%2086.7773C58.9974%2088.0794%2060.5078%2088.7695%2062.0833%2088.7695C66.2923%2088.7695%2069.5247%2084.9772%2072.1289%2081.2663Z'%20fill='url(%23paint2_linear_437_1105)'/%3e%3cpath%20d='M93.0632%2065.5892C90.3353%2065.5892%2086.7806%2066.7611%2085.3548%2072.3438C84.6029%2075.2865%2084.8633%2076.9889%2087.8711%2081.2663C90.4753%2084.9772%2093.7077%2088.7696%2097.9167%2088.7696C99.4922%2088.7696%20101.003%2088.0795%20102.288%2086.7774C104.121%2084.9186%20105.231%2082.0573%20105.192%2079.3132C105.127%2074.7363%2099.8405%2065.5892%2093.0632%2065.5892Z'%20fill='url(%23paint3_linear_437_1105)'/%3e%3c/g%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_437_1105'%20x1='40'%20y1='80'%20x2='120'%20y2='80'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23EC4899'/%3e%3cstop%20offset='1'%20stop-color='%237C3AED'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_linear_437_1105'%20x1='40'%20y1='80'%20x2='120'%20y2='80'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23EC4899'/%3e%3cstop%20offset='1'%20stop-color='%237C3AED'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint2_linear_437_1105'%20x1='40'%20y1='80'%20x2='120'%20y2='80'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23EC4899'/%3e%3cstop%20offset='1'%20stop-color='%237C3AED'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint3_linear_437_1105'%20x1='40'%20y1='80'%20x2='120'%20y2='80'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23EC4899'/%3e%3cstop%20offset='1'%20stop-color='%237C3AED'/%3e%3c/linearGradient%3e%3cclipPath%20id='clip0_437_1105'%3e%3crect%20width='80'%20height='80'%20fill='white'%20transform='translate(40%2040)'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e";
+export {
+  appIconWhite as default
+};