@ixo/ui 0.0.1

package/dist/index-BT_QWzeu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-BT_QWzeu.js","sources":["../src/components/SodaCard/components/MainAction/index.tsx"],"sourcesContent":["import { ReactElement } from \"react\";\n\nimport { ActionButton } from \"../ActionButton\";\nimport { IconCmp } from \"../../../../types/IconCmp\";\n\nexport type Props = {\n  title: string;\n  icon: IconCmp;\n  description?: string;\n  onClick: () => void;\n};\n\nexport default function MainAction({ title, description, onClick, icon: Icon }: Props): ReactElement {\n  return (\n    <div\n      css={({ bg, radius }) => ({\n        display: \"flex\",\n        flexDirection: \"row\",\n        backgroundColor: bg.cardHighlight,\n        borderRadius: radius.medium\n      })}\n      data-x=\"vania\"\n    >\n      <div\n        css={({ spacing }) => ({\n          display: \"flex\",\n          alignItems: \"center\",\n          justifyContent: \"center\",\n          paddingLeft: spacing,\n          paddingRight: spacing\n        })}\n      >\n        <Icon color=\"primary\" />\n      </div>\n      <div\n        css={({ bg, radius }) => ({\n          width: \"100%\",\n          backgroundColor: bg.card,\n          borderRadius: radius.medium\n        })}\n      >\n        <ActionButton\n          onClick={onClick}\n          left={{\n            title,\n            description\n          }}\n        />\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAYA,SAAwB,WAAW,EAAE,OAAO,aAAa,SAAS,MAAM,QAA6B;AACnG,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK,CAAC,EAAE,IAAI,cAAc;AAAA,QACxB,SAAS;AAAA,QACT,eAAe;AAAA,QACf,iBAAiB,GAAG;AAAA,QACpB,cAAc,OAAO;AAAA,MAAA;AAAA,MAEvB,UAAO;AAAA,MAEP,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK,CAAC,EAAE,eAAe;AAAA,cACrB,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,gBAAgB;AAAA,cAChB,aAAa;AAAA,cACb,cAAc;AAAA,YAAA;AAAA,YAGhB,UAAA,oBAAC,MAAA,EAAK,OAAM,UAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,QAExB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK,CAAC,EAAE,IAAI,cAAc;AAAA,cACxB,OAAO;AAAA,cACP,iBAAiB,GAAG;AAAA,cACpB,cAAc,OAAO;AAAA,YAAA;AAAA,YAGvB,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC;AAAA,gBACA,MAAM;AAAA,kBACJ;AAAA,kBACA;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/index-BUyivmx_.cjs

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const export_components = require("./components-CZzxFRC3.cjs");
+function MainAction({ title, description, onClick, icon: Icon }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      css: ({ bg, radius }) => ({
+        display: "flex",
+        flexDirection: "row",
+        backgroundColor: bg.cardHighlight,
+        borderRadius: radius.medium
+      }),
+      "data-x": "vania",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            css: ({ spacing }) => ({
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              paddingLeft: spacing,
+              paddingRight: spacing
+            }),
+            children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { color: "primary" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            css: ({ bg, radius }) => ({
+              width: "100%",
+              backgroundColor: bg.card,
+              borderRadius: radius.medium
+            }),
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              export_components.ActionButton,
+              {
+                onClick,
+                left: {
+                  title,
+                  description
+                }
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+exports.default = MainAction;
+//# sourceMappingURL=index-BUyivmx_.cjs.map

package/dist/index-BUyivmx_.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-BUyivmx_.cjs","sources":["../src/components/SodaCard/components/MainAction/index.tsx"],"sourcesContent":["import { ReactElement } from \"react\";\n\nimport { ActionButton } from \"../ActionButton\";\nimport { IconCmp } from \"../../../../types/IconCmp\";\n\nexport type Props = {\n  title: string;\n  icon: IconCmp;\n  description?: string;\n  onClick: () => void;\n};\n\nexport default function MainAction({ title, description, onClick, icon: Icon }: Props): ReactElement {\n  return (\n    <div\n      css={({ bg, radius }) => ({\n        display: \"flex\",\n        flexDirection: \"row\",\n        backgroundColor: bg.cardHighlight,\n        borderRadius: radius.medium\n      })}\n      data-x=\"vania\"\n    >\n      <div\n        css={({ spacing }) => ({\n          display: \"flex\",\n          alignItems: \"center\",\n          justifyContent: \"center\",\n          paddingLeft: spacing,\n          paddingRight: spacing\n        })}\n      >\n        <Icon color=\"primary\" />\n      </div>\n      <div\n        css={({ bg, radius }) => ({\n          width: \"100%\",\n          backgroundColor: bg.card,\n          borderRadius: radius.medium\n        })}\n      >\n        <ActionButton\n          onClick={onClick}\n          left={{\n            title,\n            description\n          }}\n        />\n      </div>\n    </div>\n  );\n}\n"],"names":["jsxs","jsx","ActionButton"],"mappings":";;;;AAYA,SAAwB,WAAW,EAAE,OAAO,aAAa,SAAS,MAAM,QAA6B;AACnG,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK,CAAC,EAAE,IAAI,cAAc;AAAA,QACxB,SAAS;AAAA,QACT,eAAe;AAAA,QACf,iBAAiB,GAAG;AAAA,QACpB,cAAc,OAAO;AAAA,MAAA;AAAA,MAEvB,UAAO;AAAA,MAEP,UAAA;AAAA,QAAAC,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK,CAAC,EAAE,eAAe;AAAA,cACrB,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,gBAAgB;AAAA,cAChB,aAAa;AAAA,cACb,cAAc;AAAA,YAAA;AAAA,YAGhB,UAAAA,2BAAAA,IAAC,MAAA,EAAK,OAAM,UAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,QAExBA,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK,CAAC,EAAE,IAAI,cAAc;AAAA,cACxB,OAAO;AAAA,cACP,iBAAiB,GAAG;AAAA,cACpB,cAAc,OAAO;AAAA,YAAA;AAAA,YAGvB,UAAAA,2BAAAA;AAAAA,cAACC,kBAAAA;AAAAA,cAAA;AAAA,gBACC;AAAA,gBACA,MAAM;AAAA,kBACJ;AAAA,kBACA;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;;"}

package/dist/index-BYyVXK0P.cjs

@@ -0,0 +1,167 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const export_components = require("./components-CZzxFRC3.cjs");
+function Assets({ items, summary }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "ul",
+    {
+      css: ({ font, text, fontSize, spacing, bg, radius }) => ({
+        margin: 0,
+        paddingTop: spacing * 2,
+        paddingLeft: spacing * 2,
+        paddingRight: spacing * 2,
+        listStyle: "none",
+        fontFamily: font.main,
+        color: text.secondary,
+        fontSize: fontSize.s,
+        backgroundColor: bg.card,
+        borderBottomLeftRadius: radius.medium,
+        borderBottomRightRadius: radius.medium,
+        overflow: "hidden"
+      }),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("li", { css: { display: "flex", justifyContent: "space-between" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { css: ({ spacing }) => ({ paddingLeft: spacing }), children: "Claim" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { css: ({ spacing }) => ({ paddingRight: spacing }), children: "Reward" })
+        ] }),
+        items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
+          "li",
+          {
+            css: ({ spacing }) => ({
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+              marginBottom: spacing / 2,
+              padding: spacing
+            }),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { css: { display: "flex", alignItems: "center" }, children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "span",
+                  {
+                    css: ({ text, fontSize }) => ({
+                      color: text.main,
+                      fontSize: fontSize.regular
+                    }),
+                    children: "12"
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "span",
+                  {
+                    css: ({ spacing, radius, fontSize, semantic }) => {
+                      const color = {
+                        approved: semantic.success,
+                        disputed: semantic.warning,
+                        rejected: semantic.error
+                      }[item.status];
+                      const backgroundColor = {
+                        approved: semantic.successTransparent,
+                        disputed: semantic.warningTransparent,
+                        rejected: semantic.errorTransparent
+                      }[item.status];
+                      return {
+                        marginLeft: spacing,
+                        borderRadius: radius.medium,
+                        paddingLeft: spacing,
+                        paddingRight: spacing,
+                        paddingTop: spacing / 2,
+                        paddingBottom: spacing / 2,
+                        fontSize: fontSize.xs,
+                        backgroundColor,
+                        color
+                      };
+                    },
+                    children: "Approved"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "div",
+                {
+                  css: {
+                    display: "flex",
+                    flexDirection: "column",
+                    alignItems: "flex-end"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "span",
+                      {
+                        css: ({ text, fontSize }) => ({
+                          color: text.main,
+                          fontSize: fontSize.regular
+                        }),
+                        children: "100 IXO"
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "span",
+                      {
+                        css: ({ text, fontSize }) => ({
+                          color: text.secondary,
+                          fontSize: fontSize.xs
+                        }),
+                        children: "$200.12"
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          },
+          item.id
+        )),
+        summary ? /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            onClick: summary.onClick,
+            css: ({ bg, spacing, radius }) => ({
+              display: "flex",
+              width: "100%",
+              border: "none",
+              justifyContent: "space-between",
+              alignItems: "center",
+              backgroundColor: bg.cardHighlight,
+              padding: spacing,
+              borderRadius: radius.small,
+              cursor: "pointer",
+              marginBottom: spacing * 2
+            }),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "div",
+                {
+                  css: {
+                    display: "flex",
+                    flexDirection: "column",
+                    alignItems: "start"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(export_components.Typography.Text, { color: "text", size: "regular", children: summary.title }),
+                    summary.description ? /* @__PURE__ */ jsxRuntime.jsx(export_components.Typography.Text, { color: "secondary", size: "xs", children: summary.description }) : null
+                  ]
+                }
+              ),
+              summary.actionIcon ? /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  css: ({ colors, radius }) => ({
+                    width: 32,
+                    height: 32,
+                    backgroundColor: colors.focusTransparent10,
+                    borderRadius: radius.small / 2
+                  }),
+                  children: /* @__PURE__ */ jsxRuntime.jsx(summary.actionIcon, { color: "primary" })
+                }
+              ) : null
+            ]
+          }
+        ) : null
+      ]
+    }
+  );
+}
+exports.default = Assets;
+//# sourceMappingURL=index-BYyVXK0P.cjs.map

package/dist/index-BYyVXK0P.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-BYyVXK0P.cjs","sources":["../src/components/SodaCard/components/Assets/index.tsx"],"sourcesContent":["import { ReactElement } from \"react\";\n\nimport { Typography } from \"../../../Typography\";\nimport { IconCmp } from \"../../../../types/IconCmp\";\n\nexport type Props = {\n  summary?: {\n    title: string;\n    description?: string;\n    actionIcon?: IconCmp;\n    onClick?: () => void;\n  };\n  items: Array<{\n    id: string;\n    amount: number;\n    status: \"approved\" | \"disputed\" | \"rejected\";\n    reward: number;\n    rewardUsd: number;\n  }>;\n};\n\nexport default function Assets({ items, summary }: Props): ReactElement {\n  return (\n    <ul\n      css={({ font, text, fontSize, spacing, bg, radius }) => ({\n        margin: 0,\n        paddingTop: spacing * 2,\n        paddingLeft: spacing * 2,\n        paddingRight: spacing * 2,\n        listStyle: \"none\",\n        fontFamily: font.main,\n        color: text.secondary,\n        fontSize: fontSize.s,\n        backgroundColor: bg.card,\n        borderBottomLeftRadius: radius.medium,\n        borderBottomRightRadius: radius.medium,\n        overflow: \"hidden\"\n      })}\n    >\n      <li css={{ display: \"flex\", justifyContent: \"space-between\" }}>\n        <span css={({ spacing }) => ({ paddingLeft: spacing })}>Claim</span>\n        <span css={({ spacing }) => ({ paddingRight: spacing })}>Reward</span>\n      </li>\n      {items.map((item) => (\n        <li\n          key={item.id}\n          css={({ spacing }) => ({\n            display: \"flex\",\n            justifyContent: \"space-between\",\n            alignItems: \"center\",\n            marginBottom: spacing / 2,\n            padding: spacing\n          })}\n        >\n          <div css={{ display: \"flex\", alignItems: \"center\" }}>\n            <span\n              css={({ text, fontSize }) => ({\n                color: text.main,\n                fontSize: fontSize.regular\n              })}\n            >\n              12\n            </span>\n            <span\n              css={({ spacing, radius, fontSize, semantic }) => {\n                const color = {\n                  approved: semantic.success,\n                  disputed: semantic.warning,\n                  rejected: semantic.error\n                }[item.status];\n\n                const backgroundColor = {\n                  approved: semantic.successTransparent,\n                  disputed: semantic.warningTransparent,\n                  rejected: semantic.errorTransparent\n                }[item.status];\n\n                return {\n                  marginLeft: spacing,\n                  borderRadius: radius.medium,\n                  paddingLeft: spacing,\n                  paddingRight: spacing,\n                  paddingTop: spacing / 2,\n                  paddingBottom: spacing / 2,\n                  fontSize: fontSize.xs,\n                  backgroundColor,\n                  color\n                };\n              }}\n            >\n              Approved\n            </span>\n          </div>\n          <div\n            css={{\n              display: \"flex\",\n              flexDirection: \"column\",\n              alignItems: \"flex-end\"\n            }}\n          >\n            <span\n              css={({ text, fontSize }) => ({\n                color: text.main,\n                fontSize: fontSize.regular\n              })}\n            >\n              100 IXO\n            </span>\n            <span\n              css={({ text, fontSize }) => ({\n                color: text.secondary,\n                fontSize: fontSize.xs\n              })}\n            >\n              $200.12\n            </span>\n          </div>\n        </li>\n      ))}\n\n      {summary ? (\n        <button\n          onClick={summary.onClick}\n          css={({ bg, spacing, radius }) => ({\n            display: \"flex\",\n            width: \"100%\",\n            border: \"none\",\n            justifyContent: \"space-between\",\n            alignItems: \"center\",\n            backgroundColor: bg.cardHighlight,\n            padding: spacing,\n            borderRadius: radius.small,\n            cursor: \"pointer\",\n            marginBottom: spacing * 2\n          })}\n        >\n          <div\n            css={{\n              display: \"flex\",\n              flexDirection: \"column\",\n              alignItems: \"start\"\n            }}\n          >\n            <Typography.Text color=\"text\" size=\"regular\">\n              {summary.title}\n            </Typography.Text>\n            {summary.description ? (\n              <Typography.Text color=\"secondary\" size=\"xs\">\n                {summary.description}\n              </Typography.Text>\n            ) : null}\n          </div>\n          {summary.actionIcon ? (\n            <div\n              css={({ colors, radius }) => ({\n                width: 32,\n                height: 32,\n                backgroundColor: colors.focusTransparent10,\n                borderRadius: radius.small / 2\n              })}\n            >\n              <summary.actionIcon color=\"primary\" />\n            </div>\n          ) : null}\n        </button>\n      ) : null}\n    </ul>\n  );\n}\n"],"names":["jsxs","jsx","Typography"],"mappings":"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"}

package/dist/index-BuRdNBuS.js

@@ -0,0 +1,66 @@
+import { jsxs, jsx, Fragment } from "@emotion/react/jsx-runtime";
+import { useRef, useCallback } from "react";
+import { i as isValidClick, S as Spacer, A as Avatar, T as Typography, a as Tag, M as MoreMenu, I as IconButton } from "./components-CcLa67E1.js";
+import { C as Close } from "./UsersSolid-CEMcHCoD.js";
+function Header({ user, onClose, onHeaderClick, icon, title, moreMenu, action }) {
+  const wrapperRef = useRef(null);
+  const handleHeaderClick = useCallback(
+    (e) => {
+      if (onHeaderClick && isValidClick(e, wrapperRef.current)) {
+        onHeaderClick();
+      }
+    },
+    [onHeaderClick]
+  );
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: wrapperRef,
+      role: onHeaderClick ? "button" : void 0,
+      tabIndex: onHeaderClick ? 0 : void 0,
+      onClick: onHeaderClick ? handleHeaderClick : void 0,
+      css: ({ spacing, bg, radius }) => ({
+        display: "flex",
+        border: "none",
+        justifyContent: "space-between",
+        alignItems: "center",
+        padding: spacing * 2,
+        backgroundColor: bg.card,
+        borderTopLeftRadius: radius.medium,
+        borderTopRightRadius: radius.medium,
+        cursor: onHeaderClick ? "pointer" : void 0
+      }),
+      children: [
+        user ? /* @__PURE__ */ jsxs(Spacer, { children: [
+          /* @__PURE__ */ jsx(Avatar, { src: user.avatarSrc || "", did: user.did, size: 40 }),
+          /* @__PURE__ */ jsxs(Spacer, { vertical: true, alignItems: "start", distance: 0, children: [
+            /* @__PURE__ */ jsxs(Spacer, { children: [
+              /* @__PURE__ */ jsx(Typography.Text, { children: user.name }),
+              user.badge ? /* @__PURE__ */ jsx(Tag, { value: user.badge, bgColor: "selected", textColor: "secondary" }) : null
+            ] }),
+            /* @__PURE__ */ jsx(Typography.Text, { size: "xs", children: user.description })
+          ] })
+        ] }) : /* @__PURE__ */ jsx(Fragment, { children: title ? /* @__PURE__ */ jsx(Tag, { value: title, icon, bgColor: "selected" }) : /* @__PURE__ */ jsx("span", {}) }),
+        onClose || moreMenu || action ? /* @__PURE__ */ jsxs(
+          "div",
+          {
+            css: ({ spacing }) => ({
+              display: "flex",
+              gap: spacing,
+              alignItems: "center"
+            }),
+            children: [
+              moreMenu ? /* @__PURE__ */ jsx(MoreMenu, { items: moreMenu.items, controlColor: "secondary" }) : null,
+              action ? /* @__PURE__ */ jsx(IconButton, { icon: action.icon, size: 20, onClick: action.onClick }) : null,
+              onClose ? /* @__PURE__ */ jsx(IconButton, { icon: Close, size: 20, colorDefault: "secondary", onClick: onClose }) : null
+            ]
+          }
+        ) : /* @__PURE__ */ jsx("span", {})
+      ]
+    }
+  );
+}
+export {
+  Header as default
+};
+//# sourceMappingURL=index-BuRdNBuS.js.map

package/dist/index-BuRdNBuS.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-BuRdNBuS.js","sources":["../src/components/ActionCard/components/Header/index.tsx"],"sourcesContent":["import { ReactElement, useCallback, MouseEvent, useRef } from \"react\";\n\nimport { Avatar } from \"../../../Avatar\";\nimport { IconButton } from \"../../../IconButton\";\nimport { MoreMenu } from \"../../../MoreMenu\";\nimport { Spacer } from \"../../../Spacer\";\nimport { Tag } from \"../../../Tag\";\nimport { Typography } from \"../../../Typography\";\nimport { Close } from \"../../../../icons\";\n\nimport { Props } from \"./types\";\nimport { isValidClick } from \"../../../../utils/dom\";\n\nexport default function Header({ user, onClose, onHeaderClick, icon, title, moreMenu, action }: Props): ReactElement {\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  const handleHeaderClick = useCallback(\n    (e: MouseEvent<HTMLElement>) => {\n      if (onHeaderClick && isValidClick(e, wrapperRef.current)) {\n        onHeaderClick();\n      }\n    },\n    [onHeaderClick]\n  );\n\n  return (\n    <div\n      ref={wrapperRef}\n      role={onHeaderClick ? \"button\" : undefined}\n      tabIndex={onHeaderClick ? 0 : undefined}\n      onClick={onHeaderClick ? handleHeaderClick : undefined}\n      css={({ spacing, bg, radius }) => ({\n        display: \"flex\",\n        border: \"none\",\n        justifyContent: \"space-between\",\n        alignItems: \"center\",\n        padding: spacing * 2,\n        backgroundColor: bg.card,\n        borderTopLeftRadius: radius.medium,\n        borderTopRightRadius: radius.medium,\n        cursor: onHeaderClick ? \"pointer\" : undefined\n      })}\n    >\n      {user ? (\n        <Spacer>\n          <Avatar src={user.avatarSrc || \"\"} did={user.did} size={40} />\n          <Spacer vertical alignItems=\"start\" distance={0}>\n            <Spacer>\n              <Typography.Text>{user.name}</Typography.Text>\n              {user.badge ? <Tag value={user.badge} bgColor=\"selected\" textColor=\"secondary\" /> : null}\n            </Spacer>\n            <Typography.Text size=\"xs\">{user.description}</Typography.Text>\n          </Spacer>\n        </Spacer>\n      ) : (\n        <>{title ? <Tag value={title} icon={icon} bgColor=\"selected\" /> : <span />}</>\n      )}\n      {onClose || moreMenu || action ? (\n        <div\n          css={({ spacing }) => ({\n            display: \"flex\",\n            gap: spacing,\n            alignItems: \"center\"\n          })}\n        >\n          {moreMenu ? <MoreMenu items={moreMenu.items} controlColor=\"secondary\" /> : null}\n          {action ? <IconButton icon={action.icon} size={20} onClick={action.onClick} /> : null}\n          {onClose ? <IconButton icon={Close} size={20} colorDefault=\"secondary\" onClick={onClose} /> : null}\n        </div>\n      ) : (\n        <span />\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAaA,SAAwB,OAAO,EAAE,MAAM,SAAS,eAAe,MAAM,OAAO,UAAU,UAA+B;AACnH,QAAM,aAAa,OAAuB,IAAI;AAE9C,QAAM,oBAAoB;AAAA,IACxB,CAAC,MAA+B;AAC9B,UAAI,iBAAiB,aAAa,GAAG,WAAW,OAAO,GAAG;AACxD,sBAAA;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,aAAa;AAAA,EAAA;AAGhB,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,MAAM,gBAAgB,WAAW;AAAA,MACjC,UAAU,gBAAgB,IAAI;AAAA,MAC9B,SAAS,gBAAgB,oBAAoB;AAAA,MAC7C,KAAK,CAAC,EAAE,SAAS,IAAI,cAAc;AAAA,QACjC,SAAS;AAAA,QACT,QAAQ;AAAA,QACR,gBAAgB;AAAA,QAChB,YAAY;AAAA,QACZ,SAAS,UAAU;AAAA,QACnB,iBAAiB,GAAG;AAAA,QACpB,qBAAqB,OAAO;AAAA,QAC5B,sBAAsB,OAAO;AAAA,QAC7B,QAAQ,gBAAgB,YAAY;AAAA,MAAA;AAAA,MAGrC,UAAA;AAAA,QAAA,4BACE,QAAA,EACC,UAAA;AAAA,UAAA,oBAAC,QAAA,EAAO,KAAK,KAAK,aAAa,IAAI,KAAK,KAAK,KAAK,MAAM,GAAA,CAAI;AAAA,+BAC3D,QAAA,EAAO,UAAQ,MAAC,YAAW,SAAQ,UAAU,GAC5C,UAAA;AAAA,YAAA,qBAAC,QAAA,EACC,UAAA;AAAA,cAAA,oBAAC,WAAW,MAAX,EAAiB,UAAA,KAAK,MAAK;AAAA,cAC3B,KAAK,QAAQ,oBAAC,KAAA,EAAI,OAAO,KAAK,OAAO,SAAQ,YAAW,WAAU,YAAA,CAAY,IAAK;AAAA,YAAA,GACtF;AAAA,gCACC,WAAW,MAAX,EAAgB,MAAK,MAAM,eAAK,YAAA,CAAY;AAAA,UAAA,EAAA,CAC/C;AAAA,QAAA,GACF,IAEA,oBAAA,UAAA,EAAG,UAAA,QAAQ,oBAAC,KAAA,EAAI,OAAO,OAAO,MAAY,SAAQ,WAAA,CAAW,IAAK,oBAAC,UAAK,GAAG;AAAA,QAE5E,WAAW,YAAY,SACtB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK,CAAC,EAAE,eAAe;AAAA,cACrB,SAAS;AAAA,cACT,KAAK;AAAA,cACL,YAAY;AAAA,YAAA;AAAA,YAGb,UAAA;AAAA,cAAA,+BAAY,UAAA,EAAS,OAAO,SAAS,OAAO,cAAa,aAAY,IAAK;AAAA,cAC1E,SAAS,oBAAC,YAAA,EAAW,MAAM,OAAO,MAAM,MAAM,IAAI,SAAS,OAAO,QAAA,CAAS,IAAK;AAAA,cAChF,UAAU,oBAAC,YAAA,EAAW,MAAM,OAAO,MAAM,IAAI,cAAa,aAAY,SAAS,QAAA,CAAS,IAAK;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA,wBAG/F,QAAA,CAAA,CAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAId;"}

package/dist/index-ByrCNpS2.cjs

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+function CustomContent({ content, position }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      css: ({ spacing, bg }) => ({
+        paddingTop: position === "top" ? spacing * 2 : 0,
+        paddingBottom: position === "bottom" ? spacing * 2 : 0,
+        borderBottomLeftRadius: spacing * 2,
+        borderBottomRightRadius: spacing * 2,
+        paddingLeft: spacing * 2,
+        paddingRight: spacing * 2,
+        backgroundColor: bg.card
+      }),
+      children: content
+    }
+  );
+}
+exports.default = CustomContent;
+//# sourceMappingURL=index-ByrCNpS2.cjs.map

package/dist/index-ByrCNpS2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-ByrCNpS2.cjs","sources":["../src/components/SodaCard/components/CustomContent/index.tsx"],"sourcesContent":["import { ReactElement } from \"react\";\n\nexport type Props = {\n  content: ReactElement;\n  position: \"top\" | \"bottom\";\n};\n\nexport default function CustomContent({ content, position }: Props): ReactElement {\n  return (\n    <div\n      css={({ spacing, bg }) => ({\n        paddingTop: position === \"top\" ? spacing * 2 : 0,\n        paddingBottom: position === \"bottom\" ? spacing * 2 : 0,\n        borderBottomLeftRadius: spacing * 2,\n        borderBottomRightRadius: spacing * 2,\n        paddingLeft: spacing * 2,\n        paddingRight: spacing * 2,\n        backgroundColor: bg.card\n      })}\n    >\n      {content}\n    </div>\n  );\n}\n"],"names":["jsx"],"mappings":";;;AAOA,SAAwB,cAAc,EAAE,SAAS,YAAiC;AAChF,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK,CAAC,EAAE,SAAS,UAAU;AAAA,QACzB,YAAY,aAAa,QAAQ,UAAU,IAAI;AAAA,QAC/C,eAAe,aAAa,WAAW,UAAU,IAAI;AAAA,QACrD,wBAAwB,UAAU;AAAA,QAClC,yBAAyB,UAAU;AAAA,QACnC,aAAa,UAAU;AAAA,QACvB,cAAc,UAAU;AAAA,QACxB,iBAAiB,GAAG;AAAA,MAAA;AAAA,MAGrB,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;;"}

package/dist/index-CJMaNSid.cjs

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const index = require("./index-CZWdbU4E.cjs");
+const export_components = require("./components-CZzxFRC3.cjs");
+function Actions({ items }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: "soda-card-actions",
+      css: {
+        position: "relative",
+        display: "grid",
+        gridTemplateRows: "0fr",
+        transition: "grid-template-rows 0.5s ease-out"
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          css: ({ transition }) => ({
+            overflow: "hidden",
+            transition: transition.duration
+          }),
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "ul",
+            {
+              css: ({ spacing }) => ({
+                listStyle: "none",
+                display: "flex",
+                flexDirection: "column",
+                margin: 0,
+                paddingLeft: spacing * 2,
+                paddingRight: spacing * 2
+              }),
+              children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+                "li",
+                {
+                  css: ({ spacing }) => ({
+                    padding: 0,
+                    marginTop: spacing,
+                    marginBottom: spacing,
+                    ":first-of-type": {
+                      marginTop: spacing * 2
+                    },
+                    ":last-child": {
+                      marginBottom: spacing * 2
+                    }
+                  }),
+                  children: /* @__PURE__ */ jsxRuntime.jsx(export_components.Tooltip, { content: item.tooltip, children: /* @__PURE__ */ jsxRuntime.jsx(index.CardActionButton, { onClick: item.onClick, disabled: item.disabled, highlighted: item.highlighted, title: item.title, icon: item.icon, badge: item.badge }) })
+                },
+                item.title
+              ))
+            }
+          )
+        }
+      )
+    }
+  );
+}
+exports.default = Actions;
+//# sourceMappingURL=index-CJMaNSid.cjs.map

package/dist/index-CJMaNSid.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-CJMaNSid.cjs","sources":["../src/components/SodaCard/components/Actions/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\n\nimport { CardActionButton } from \"../../../CardActionButton\";\nimport { Tooltip } from \"../../../Tooltip\";\n\nimport { Props as PropsCardActionButton } from \"../../../CardActionButton\";\n\nexport type Props = {\n  onClick?: () => void;\n  items: Array<PropsCardActionButton>;\n};\n\nexport default function Actions({ items }: Props): ReactNode {\n  return (\n    <div\n      className=\"soda-card-actions\"\n      css={{\n        position: \"relative\",\n        display: \"grid\",\n        gridTemplateRows: \"0fr\",\n        transition: \"grid-template-rows 0.5s ease-out\"\n      }}\n    >\n      <div\n        css={({ transition }) => ({\n          overflow: \"hidden\",\n          transition: transition.duration\n        })}\n      >\n        <ul\n          css={({ spacing }) => ({\n            listStyle: \"none\",\n            display: \"flex\",\n            flexDirection: \"column\",\n            margin: 0,\n            paddingLeft: spacing * 2,\n            paddingRight: spacing * 2\n          })}\n        >\n          {items.map((item) => (\n            <li\n              key={item.title}\n              css={({ spacing }) => ({\n                padding: 0,\n                marginTop: spacing,\n                marginBottom: spacing,\n                \":first-of-type\": {\n                  marginTop: spacing * 2\n                },\n                \":last-child\": {\n                  marginBottom: spacing * 2\n                }\n              })}\n            >\n              <Tooltip content={item.tooltip}>\n                <CardActionButton onClick={item.onClick} disabled={item.disabled} highlighted={item.highlighted} title={item.title} icon={item.icon} badge={item.badge} />\n              </Tooltip>\n            </li>\n          ))}\n        </ul>\n      </div>\n    </div>\n  );\n}\n"],"names":["jsx","Tooltip","CardActionButton"],"mappings":";;;;;AAYA,SAAwB,QAAQ,EAAE,SAA2B;AAC3D,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAK;AAAA,QACH,UAAU;AAAA,QACV,SAAS;AAAA,QACT,kBAAkB;AAAA,QAClB,YAAY;AAAA,MAAA;AAAA,MAGd,UAAAA,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAK,CAAC,EAAE,kBAAkB;AAAA,YACxB,UAAU;AAAA,YACV,YAAY,WAAW;AAAA,UAAA;AAAA,UAGzB,UAAAA,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAK,CAAC,EAAE,eAAe;AAAA,gBACrB,WAAW;AAAA,gBACX,SAAS;AAAA,gBACT,eAAe;AAAA,gBACf,QAAQ;AAAA,gBACR,aAAa,UAAU;AAAA,gBACvB,cAAc,UAAU;AAAA,cAAA;AAAA,cAGzB,UAAA,MAAM,IAAI,CAAC,SACVA,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBAEC,KAAK,CAAC,EAAE,eAAe;AAAA,oBACrB,SAAS;AAAA,oBACT,WAAW;AAAA,oBACX,cAAc;AAAA,oBACd,kBAAkB;AAAA,sBAChB,WAAW,UAAU;AAAA,oBAAA;AAAA,oBAEvB,eAAe;AAAA,sBACb,cAAc,UAAU;AAAA,oBAAA;AAAA,kBAC1B;AAAA,kBAGF,UAAAA,2BAAAA,IAACC,kBAAAA,SAAA,EAAQ,SAAS,KAAK,SACrB,yCAACC,MAAAA,kBAAA,EAAiB,SAAS,KAAK,SAAS,UAAU,KAAK,UAAU,aAAa,KAAK,aAAa,OAAO,KAAK,OAAO,MAAM,KAAK,MAAM,OAAO,KAAK,MAAA,CAAO,EAAA,CAC1J;AAAA,gBAAA;AAAA,gBAfK,KAAK;AAAA,cAAA,CAiBb;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;;"}

package/dist/index-CMsifKvb.js

@@ -0,0 +1,64 @@
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+import { C as CardActionButton } from "./index-6y8GG7Bk.js";
+import { S as Spacer, L as Loader, T as Typography, F as FeedbackMessage } from "./components-CcLa67E1.js";
+function Footer({ actions, loadingMessage, feedbackMessage }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      css: ({ radius }) => ({
+        borderBottomLeftRadius: radius.medium,
+        borderBottomRightRadius: radius.medium
+      }),
+      children: (() => {
+        if (actions) {
+          return /* @__PURE__ */ jsx(
+            Spacer,
+            {
+              vertical: actions.vertical,
+              css: ({ spacing, radius }) => ({
+                padding: spacing * 2,
+                borderBottomLeftRadius: radius.medium,
+                borderBottomRightRadius: radius.medium
+              }),
+              children: actions.items.map((action) => /* @__PURE__ */ jsx(
+                CardActionButton,
+                {
+                  title: action.title,
+                  tooltip: action.tooltip,
+                  badge: action.badge,
+                  disabled: action.disabled,
+                  highlighted: action.highlighted,
+                  icon: action.icon,
+                  onClick: action.onClick
+                },
+                action.title
+              ))
+            }
+          );
+        }
+        if (loadingMessage) {
+          return /* @__PURE__ */ jsxs(Spacer, { css: ({ spacing }) => ({ padding: spacing * 2 }), alignItems: "center", justifyContent: "center", children: [
+            /* @__PURE__ */ jsx(Loader, { size: 20 }),
+            /* @__PURE__ */ jsx(Typography.Text, { color: "secondary", children: loadingMessage })
+          ] });
+        }
+        if (feedbackMessage) {
+          return /* @__PURE__ */ jsx(
+            FeedbackMessage,
+            {
+              css: ({ spacing }) => ({ padding: spacing * 2 }),
+              text: feedbackMessage.text,
+              icon: feedbackMessage.icon,
+              iconColor: feedbackMessage.iconColor,
+              textColor: "secondary"
+            }
+          );
+        }
+      })()
+    }
+  );
+}
+export {
+  Footer as default
+};
+//# sourceMappingURL=index-CMsifKvb.js.map

package/dist/index-CMsifKvb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-CMsifKvb.js","sources":["../src/components/ActionCard/components/Footer/index.tsx"],"sourcesContent":["import { ReactElement, ReactNode } from \"react\";\n\nimport { CardActionButton } from \"../../../CardActionButton\";\nimport { FeedbackMessage } from \"../../../FeedbackMessage\";\nimport { Loader } from \"../../../Loader\";\nimport { Spacer } from \"../../../Spacer\";\nimport { Typography } from \"../../../Typography\";\n\nimport { Props } from \"./types\";\n\nexport default function Footer({ actions, loadingMessage, feedbackMessage }: Props): ReactElement {\n  return (\n    <div\n      css={({ radius }) => ({\n        borderBottomLeftRadius: radius.medium,\n        borderBottomRightRadius: radius.medium\n      })}\n    >\n      {((): ReactNode => {\n        if (actions) {\n          return (\n            <Spacer\n              vertical={actions.vertical}\n              css={({ spacing, radius }) => ({\n                padding: spacing * 2,\n                borderBottomLeftRadius: radius.medium,\n                borderBottomRightRadius: radius.medium\n              })}\n            >\n              {actions.items.map((action) => (\n                <CardActionButton\n                  key={action.title}\n                  title={action.title}\n                  tooltip={action.tooltip}\n                  badge={action.badge}\n                  disabled={action.disabled}\n                  highlighted={action.highlighted}\n                  icon={action.icon}\n                  onClick={action.onClick}\n                />\n              ))}\n            </Spacer>\n          );\n        }\n\n        if (loadingMessage) {\n          return (\n            <Spacer css={({ spacing }) => ({ padding: spacing * 2 })} alignItems=\"center\" justifyContent=\"center\">\n              <Loader size={20} />\n              <Typography.Text color=\"secondary\">{loadingMessage}</Typography.Text>\n            </Spacer>\n          );\n        }\n\n        if (feedbackMessage) {\n          return (\n            <FeedbackMessage\n              css={({ spacing }) => ({ padding: spacing * 2 })}\n              text={feedbackMessage.text}\n              icon={feedbackMessage.icon}\n              iconColor={feedbackMessage.iconColor}\n              textColor=\"secondary\"\n            />\n          );\n        }\n      })()}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;AAUA,SAAwB,OAAO,EAAE,SAAS,gBAAgB,mBAAwC;AAChG,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK,CAAC,EAAE,cAAc;AAAA,QACpB,wBAAwB,OAAO;AAAA,QAC/B,yBAAyB,OAAO;AAAA,MAAA;AAAA,MAGhC,WAAA,MAAiB;AACjB,YAAI,SAAS;AACX,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,UAAU,QAAQ;AAAA,cAClB,KAAK,CAAC,EAAE,SAAS,cAAc;AAAA,gBAC7B,SAAS,UAAU;AAAA,gBACnB,wBAAwB,OAAO;AAAA,gBAC/B,yBAAyB,OAAO;AAAA,cAAA;AAAA,cAGjC,UAAA,QAAQ,MAAM,IAAI,CAAC,WAClB;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBAEC,OAAO,OAAO;AAAA,kBACd,SAAS,OAAO;AAAA,kBAChB,OAAO,OAAO;AAAA,kBACd,UAAU,OAAO;AAAA,kBACjB,aAAa,OAAO;AAAA,kBACpB,MAAM,OAAO;AAAA,kBACb,SAAS,OAAO;AAAA,gBAAA;AAAA,gBAPX,OAAO;AAAA,cAAA,CASf;AAAA,YAAA;AAAA,UAAA;AAAA,QAGP;AAEA,YAAI,gBAAgB;AAClB,iBACE,qBAAC,QAAA,EAAO,KAAK,CAAC,EAAE,QAAA,OAAe,EAAE,SAAS,UAAU,EAAA,IAAM,YAAW,UAAS,gBAAe,UAC3F,UAAA;AAAA,YAAA,oBAAC,QAAA,EAAO,MAAM,GAAA,CAAI;AAAA,gCACjB,WAAW,MAAX,EAAgB,OAAM,aAAa,UAAA,eAAA,CAAe;AAAA,UAAA,GACrD;AAAA,QAEJ;AAEA,YAAI,iBAAiB;AACnB,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAK,CAAC,EAAE,QAAA,OAAe,EAAE,SAAS,UAAU;cAC5C,MAAM,gBAAgB;AAAA,cACtB,MAAM,gBAAgB;AAAA,cACtB,WAAW,gBAAgB;AAAA,cAC3B,WAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QAGhB;AAAA,MACF,GAAA;AAAA,IAAG;AAAA,EAAA;AAGT;"}

package/dist/index-CQzAYKbg.cjs

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const export_components = require("./components-CZzxFRC3.cjs");
+function Badge({ label, icon: Icon }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      css: ({ spacing, bg, radius }) => ({
+        position: "absolute",
+        display: "flex",
+        gap: spacing,
+        alignItems: "center",
+        height: 28,
+        top: spacing * 3,
+        left: spacing * 3,
+        backgroundColor: bg.card,
+        borderRadius: radius.big,
+        paddingLeft: spacing,
+        paddingRight: spacing
+      }),
+      children: [
+        Icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, { color: "primary", size: 16 }),
+        /* @__PURE__ */ jsxRuntime.jsx(export_components.Typography.Text, { color: "primary", size: "s", children: label })
+      ]
+    }
+  );
+}
+exports.default = Badge;
+//# sourceMappingURL=index-CQzAYKbg.cjs.map

package/dist/index-CQzAYKbg.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-CQzAYKbg.cjs","sources":["../src/components/ActionSheet/components/Badge/index.tsx"],"sourcesContent":["import { ReactElement } from \"react\";\n\nimport { Typography } from \"../../../Typography\";\nimport { IconCmp } from \"../../../../types/IconCmp\";\n\ntype Props = {\n  label: string;\n  icon?: IconCmp;\n};\n\nexport default function Badge({ label, icon: Icon }: Props): ReactElement {\n  return (\n    <div\n      css={({ spacing, bg, radius }) => ({\n        position: \"absolute\",\n        display: \"flex\",\n        gap: spacing,\n        alignItems: \"center\",\n        height: 28,\n        top: spacing * 3,\n        left: spacing * 3,\n        backgroundColor: bg.card,\n        borderRadius: radius.big,\n        paddingLeft: spacing,\n        paddingRight: spacing\n      })}\n    >\n      {Icon && <Icon color=\"primary\" size={16} />}\n      <Typography.Text color=\"primary\" size=\"s\">\n        {label}\n      </Typography.Text>\n    </div>\n  );\n}\n"],"names":["jsxs","jsx","Typography"],"mappings":";;;;AAUA,SAAwB,MAAM,EAAE,OAAO,MAAM,QAA6B;AACxE,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK,CAAC,EAAE,SAAS,IAAI,cAAc;AAAA,QACjC,UAAU;AAAA,QACV,SAAS;AAAA,QACT,KAAK;AAAA,QACL,YAAY;AAAA,QACZ,QAAQ;AAAA,QACR,KAAK,UAAU;AAAA,QACf,MAAM,UAAU;AAAA,QAChB,iBAAiB,GAAG;AAAA,QACpB,cAAc,OAAO;AAAA,QACrB,aAAa;AAAA,QACb,cAAc;AAAA,MAAA;AAAA,MAGf,UAAA;AAAA,QAAA,QAAQC,2BAAAA,IAAC,MAAA,EAAK,OAAM,WAAU,MAAM,IAAI;AAAA,QACzCA,+BAACC,kBAAAA,WAAW,MAAX,EAAgB,OAAM,WAAU,MAAK,KACnC,UAAA,MAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;;"}

package/dist/index-CZWdbU4E.cjs

@@ -0,0 +1,65 @@
+"use strict";
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const css = require("@emotion/css");
+const export_components = require("./components-CZzxFRC3.cjs");
+function CardActionButton({ onClick, tooltip, title, disabled, badge, highlighted, icon: Icon }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(export_components.Tooltip, { content: tooltip, classNameWrapper: css.css({ width: "100%", display: "inline-block" }), children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      onClick,
+      disabled,
+      css: ({ neutral, radius, spacing, colors }) => ({
+        cursor: disabled ? "not-allowed" : "pointer",
+        border: "none",
+        padding: spacing,
+        gap: spacing,
+        display: "flex",
+        alignItems: "center",
+        width: "100%",
+        borderStyle: "solid",
+        borderWidth: 1,
+        borderColor: highlighted ? colors.focus : "transparent",
+        backgroundColor: highlighted ? colors.focusTransparent20 : neutral.whiteFull,
+        borderRadius: radius.roundButtons,
+        "&:hover:not([disabled])": {
+          "& > span": {
+            color: colors.focus
+          },
+          "& > svg path[fill]": {
+            fill: colors.focus
+          },
+          "& > svg path[stroke]": {
+            stroke: colors.focus
+          }
+        }
+      }),
+      children: [
+        Icon ? /* @__PURE__ */ jsxRuntime.jsx(
+          Icon,
+          {
+            color: "secondary",
+            css: ({ transition }) => ({
+              "& > path[fill], & > path[stroke]": {
+                transition: transition.duration
+              }
+            })
+          }
+        ) : null,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            css: ({ text, fontSize, transition }) => ({
+              color: disabled ? text.secondary : text.main,
+              fontSize: fontSize.regular,
+              transition: transition.duration
+            }),
+            children: title
+          }
+        ),
+        badge !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx(export_components.Tag, { value: badge, small: true }) : null
+      ]
+    }
+  ) });
+}
+exports.CardActionButton = CardActionButton;
+//# sourceMappingURL=index-CZWdbU4E.cjs.map

package/dist/index-CZWdbU4E.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-CZWdbU4E.cjs","sources":["../src/components/CardActionButton/index.tsx"],"sourcesContent":["import { ReactElement } from \"react\";\nimport { css } from \"@emotion/css\";\n\nimport { Tag } from \"../Tag\";\nimport { Tooltip } from \"../Tooltip\";\nimport { IconCmp } from \"../../types/IconCmp\";\nexport type Props = {\n  title: string;\n  icon?: IconCmp;\n  onClick?: () => void;\n  tooltip?: string;\n  disabled?: boolean;\n  highlighted?: boolean;\n  badge?: string | number;\n};\n\nexport function CardActionButton({ onClick, tooltip, title, disabled, badge, highlighted, icon: Icon }: Props): ReactElement {\n  return (\n    <Tooltip content={tooltip} classNameWrapper={css({ width: \"100%\", display: \"inline-block\" })}>\n      <button\n        onClick={onClick}\n        disabled={disabled}\n        css={({ neutral, radius, spacing, colors }) => ({\n          cursor: disabled ? \"not-allowed\" : \"pointer\",\n          border: \"none\",\n          padding: spacing,\n          gap: spacing,\n          display: \"flex\",\n          alignItems: \"center\",\n          width: \"100%\",\n          borderStyle: \"solid\",\n          borderWidth: 1,\n          borderColor: highlighted ? colors.focus : \"transparent\",\n          backgroundColor: highlighted ? colors.focusTransparent20 : neutral.whiteFull,\n          borderRadius: radius.roundButtons,\n          \"&:hover:not([disabled])\": {\n            \"& > span\": {\n              color: colors.focus\n            },\n            \"& > svg path[fill]\": {\n              fill: colors.focus\n            },\n            \"& > svg path[stroke]\": {\n              stroke: colors.focus\n            }\n          }\n        })}\n      >\n        {Icon ? (\n          <Icon\n            color=\"secondary\"\n            css={({ transition }) => ({\n              \"& > path[fill], & > path[stroke]\": {\n                transition: transition.duration\n              }\n            })}\n          />\n        ) : null}\n        <span\n          css={({ text, fontSize, transition }) => ({\n            color: disabled ? text.secondary : text.main,\n            fontSize: fontSize.regular,\n            transition: transition.duration\n          })}\n        >\n          {title}\n        </span>\n        {badge !== undefined ? <Tag value={badge} small /> : null}\n      </button>\n    </Tooltip>\n  );\n}\n"],"names":["jsx","Tooltip","css","jsxs","Tag"],"mappings":";;;;AAgBO,SAAS,iBAAiB,EAAE,SAAS,SAAS,OAAO,UAAU,OAAO,aAAa,MAAM,QAA6B;AAC3H,SACEA,2BAAAA,IAACC,kBAAAA,SAAA,EAAQ,SAAS,SAAS,kBAAkBC,IAAAA,IAAI,EAAE,OAAO,QAAQ,SAAS,eAAA,CAAgB,GACzF,UAAAC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,KAAK,CAAC,EAAE,SAAS,QAAQ,SAAS,cAAc;AAAA,QAC9C,QAAQ,WAAW,gBAAgB;AAAA,QACnC,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,KAAK;AAAA,QACL,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,OAAO;AAAA,QACP,aAAa;AAAA,QACb,aAAa;AAAA,QACb,aAAa,cAAc,OAAO,QAAQ;AAAA,QAC1C,iBAAiB,cAAc,OAAO,qBAAqB,QAAQ;AAAA,QACnE,cAAc,OAAO;AAAA,QACrB,2BAA2B;AAAA,UACzB,YAAY;AAAA,YACV,OAAO,OAAO;AAAA,UAAA;AAAA,UAEhB,sBAAsB;AAAA,YACpB,MAAM,OAAO;AAAA,UAAA;AAAA,UAEf,wBAAwB;AAAA,YACtB,QAAQ,OAAO;AAAA,UAAA;AAAA,QACjB;AAAA,MACF;AAAA,MAGD,UAAA;AAAA,QAAA,OACCH,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,KAAK,CAAC,EAAE,kBAAkB;AAAA,cACxB,oCAAoC;AAAA,gBAClC,YAAY,WAAW;AAAA,cAAA;AAAA,YACzB;AAAA,UACF;AAAA,QAAA,IAEA;AAAA,QACJA,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK,CAAC,EAAE,MAAM,UAAU,kBAAkB;AAAA,cACxC,OAAO,WAAW,KAAK,YAAY,KAAK;AAAA,cACxC,UAAU,SAAS;AAAA,cACnB,YAAY,WAAW;AAAA,YAAA;AAAA,YAGxB,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,UAAU,SAAYA,2BAAAA,IAACI,uBAAA,EAAI,OAAO,OAAO,OAAK,MAAC,IAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAEzD;AAEJ;;"}