@agentiffai/design 0.1.10 → 0.1.12

package/dist/icons/index.cjs

@@ -502,6 +502,161 @@ function LinkedInIcon({
   return /* @__PURE__ */ jsxRuntime.jsx("span", { className, style: { display: "inline-flex", width: size, height: size }, children: svgElement });
 }
 LinkedInIcon.displayName = "LinkedInIcon";
+var StyledIconWrapper3 = styled__default.default.button`
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  background: transparent;
+  border: none;
+  padding: 0;
+  cursor: pointer;
+  transition: all 0.2s ease-in-out;
+  width: ${({ $size }) => `${$size}px`};
+  height: ${({ $size }) => `${$size}px`};
+  border-radius: ${({ theme }) => theme?.radii?.sm ?? "4px"};
+
+  &:hover:not(:disabled) {
+    opacity: 0.8;
+    transform: scale(1.05);
+  }
+
+  &:active:not(:disabled) {
+    opacity: 0.6;
+    transform: scale(0.95);
+  }
+
+  &:focus-visible {
+    outline: 2px solid ${({ theme }) => (theme?.colors?.primary && typeof theme.colors.primary === "object" ? theme.colors.primary.light : theme?.colors?.primary) ?? "#0066FF"};
+    outline-offset: 2px;
+  }
+
+  &:disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+  }
+
+  /* Remove default focus outline, using focus-visible instead */
+  &:focus {
+    outline: none;
+  }
+
+  svg {
+    display: block;
+    width: 100%;
+    height: 100%;
+  }
+`;
+function PostizIcon({
+  variant = "colored",
+  size = 24,
+  className,
+  style,
+  "aria-label": ariaLabel = "Postiz",
+  onPress,
+  ...ariaProps
+}) {
+  const ref = react.useRef(null);
+  const isInteractive = Boolean(onPress);
+  const { buttonProps } = button.useButton(
+    {
+      ...ariaProps,
+      onPress,
+      "aria-label": ariaLabel,
+      isDisabled: !isInteractive
+    },
+    ref
+  );
+  const role = isInteractive ? "button" : "img";
+  const ariaHidden = !isInteractive && !ariaLabel;
+  const colors = {
+    colored: {
+      purple: "#612bd3",
+      dark: "#131019",
+      white: "#fff",
+      stroke: "#131019"
+    },
+    black: {
+      purple: "black",
+      dark: "black",
+      white: "black",
+      stroke: "black"
+    },
+    white: {
+      purple: "white",
+      dark: "white",
+      white: "white",
+      stroke: "white"
+    }
+  };
+  const c = colors[variant];
+  const svgElement = /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "26.74 0.02 460.94 509.34",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      role,
+      "aria-label": ariaLabel,
+      "aria-hidden": ariaHidden,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M103.4 82.6c.4 5.6.8 12 1.4 19.1L125 362.4c2.3 29.1 3.4 43.8 9.9 54.4 5.7 9.4 14.4 16.7 24.5 21 11.6 4.9 26.1 3.7 55.2 1.4l199.8-15.4c18.9-1.5 31.7-2.5 41.2-4.8-3.2 7.5-8.1 14.3-14.5 19.5-9.6 8-23.9 11.4-52.4 17.9l-195 45c-28.5 6.5-42.8 9.9-54.8 6.8-10.7-2.7-20.3-8.6-27.3-17.1-8-9.6-11.4-23.9-17.9-52.4L34.7 184c-6.5-28.5-9.9-42.8-6.8-54.8 2.7-10.7 8.6-20.3 17.1-27.3 9.6-8 23.9-11.4 52.4-17.9z",
+            fill: c.purple
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M112.8 101.1c-1.1-14.8-2-25.2-1.9-33.6 0-8.2.9-13.6 2.8-18 3.6-8.6 9.8-15.8 17.7-20.8 4.1-2.5 9.2-4.2 17.4-5.4 8.2-1.3 18.8-2.2 33.5-3.3L382 4.4c14.8-1.1 25.2-2 33.6-1.9 8.2 0 13.6.9 18 2.8 8.6 3.6 15.8 9.8 20.8 17.7 2.5 4.1 4.2 9.2 5.4 17.4s2.2 18.8 3.3 33.5l20.2 260.8c1.1 14.8 2 25.2 1.9 33.6 0 8.2-.9 13.6-2.8 18-3.6 8.6-9.8 15.8-17.7 20.8-4.1 2.5-9.2 4.2-17.4 5.4-8.2 1.3-18.8 2.2-33.5 3.3l-199.7 15.4c-14.8 1.1-25.2 2-33.6 1.9-8.2 0-13.6-.9-18-2.8-8.6-3.6-15.8-9.8-20.8-17.7-2.5-4.1-4.2-9.2-5.4-17.4-1.3-8.2-2.2-18.8-3.3-33.5z",
+            fill: "none",
+            stroke: c.stroke,
+            strokeWidth: "4.9373"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "m182.9 27.9 199.7-15.4c14.9-1.2 25-1.9 33-1.9 7.7 0 11.9.9 14.9 2.2 7 3 13 8 17 14.6 1.7 2.9 3.2 6.8 4.5 14.5 1.3 7.8 2.1 18 3.2 32.9l20.2 260.8c1.2 14.9 1.9 25 1.9 33 0 7.7-.9 11.9-2.2 14.9-3 7-8 13-14.6 17-2.9 1.7-6.8 3.2-14.5 4.5-7.8 1.3-18 2.1-32.9 3.2l-199.7 15.3c-14.8 1.2-25 1.9-33 1.9-7.7 0-11.9-.9-14.9-2.2-7-3-13-8-17-14.6-1.7-2.9-3.2-6.8-4.5-14.5-1.3-7.8-2.1-18-3.2-32.9l-20.2-260.8c-1.2-14.8-1.9-25-1.9-33 0-7.7.9-11.9 2.2-14.9 3-7 8-13 14.6-17 2.9-1.7 6.8-3.2 14.5-4.5 7.9-1.1 18.1-1.9 32.9-3.1",
+            fill: c.white
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "m269.4 88.3 1.9 24.8c3.5-4.3 7.9-7.9 13.4-11 5.4-3.3 12.3-5.2 20.4-5.8 7.4-.6 14.7.3 21.4 2.7 7 2.4 13.3 6.4 18.8 12.5 5.7 5.7 10.6 13.7 14.5 23.8s6.3 22.5 7.5 37.2c.8 10.5.7 21.2-.5 31.9-1 10.7-3.4 20.4-7.3 29.1-4 8.7-9.7 16-17.2 21.9-7.3 5.6-16.7 8.9-28.4 9.8-8.3.7-15 .1-20-1.8-5-2.1-8.8-4.6-11.5-7.4l6.2 80-46.5 15.5L221.8 92zm26.4 149c5.7-.4 10.4-2.7 14.1-6.7 3.7-4.3 6.3-9.5 8-15.8 2-6.3 3.1-13.3 3.4-20.8.5-7.7.5-15.3-.1-22.9-.9-12.1-2.8-21.6-5.5-28.4-2.5-6.8-5.3-11.9-8.4-14.9-3.2-3.3-6.1-5.2-9.1-5.9-2.7-.7-4.9-1-6.3-.8-4 .3-7.7 2.1-11.2 5.1-3.6 3-5.9 7.2-7.3 12.9l7.1 91.9c1.2 1.7 3.2 3.3 5.6 4.9 2.5 1.2 5.7 1.7 9.7 1.4",
+            fill: c.dark
+          }
+        )
+      ]
+    }
+  );
+  if (isInteractive) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      StyledIconWrapper3,
+      {
+        ...buttonProps,
+        ref,
+        className,
+        style,
+        $size: size,
+        children: svgElement
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className,
+      style: { display: "inline-flex", width: size, height: size, ...style },
+      children: svgElement
+    }
+  );
+}
+PostizIcon.displayName = "PostizIcon";
 var ColoredVariant = () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
   /* @__PURE__ */ jsxRuntime.jsx(
     "path",
@@ -984,6 +1139,13 @@ function WhatsAppIcon({
   );
 }
 WhatsAppIcon.displayName = "WhatsAppIcon";
+
+// src/theme/tokens.ts
+var tokens = {
+  borderRadius: {
+    sm: "0.25rem"}};
+
+// src/components/icons/XIcon/XIcon.styles.ts
 var StyledXIcon = styled__default.default.svg`
   display: inline-block;
   vertical-align: middle;
@@ -1004,7 +1166,7 @@ var StyledXIcon = styled__default.default.svg`
     &:focus-visible {
       outline: 2px solid ${theme?.colors?.primary ?? "#007bff"};
       outline-offset: 2px;
-      border-radius: 2px;
+      border-radius: ${tokens.borderRadius.sm};
     }
   `}
 `;
@@ -1159,6 +1321,7 @@ exports.FacebookIcon = FacebookIcon;
 exports.GmailIcon = GmailIcon;
 exports.InstagramIcon = InstagramIcon;
 exports.LinkedInIcon = LinkedInIcon;
+exports.PostizIcon = PostizIcon;
 exports.RedditIcon = RedditIcon;
 exports.SlackIcon = SlackIcon;
 exports.TelegramIcon = TelegramIcon;