@feelflow/ffid-sdk 0.1.0 → 0.3.0

package/dist/{chunk-YCMQXJOS.cjs → chunk-A6YJDYIX.cjs}

@@ -860,13 +860,539 @@ function FFIDSubscriptionBadge({
   );
 }
 
+// src/announcements/ffid-announcements-client.ts
+var API_PATH = "/api/v1/announcements";
+var SDK_LOG_PREFIX2 = "[FFID Announcements SDK]";
+var FFID_ANNOUNCEMENTS_ERROR_CODES = {
+  /** Network request failed (fetch threw) */
+  NETWORK_ERROR: "NETWORK_ERROR",
+  /** Failed to parse server response as JSON */
+  PARSE_ERROR: "PARSE_ERROR",
+  /** Server returned error without structured error body */
+  UNKNOWN_ERROR: "UNKNOWN_ERROR"
+};
+var quietLogger = {
+  debug: () => {
+  },
+  info: () => {
+  },
+  warn: () => {
+  },
+  error: (...args) => console.error(SDK_LOG_PREFIX2, ...args)
+};
+var consoleLogger2 = {
+  debug: (...args) => console.debug(SDK_LOG_PREFIX2, ...args),
+  info: (...args) => console.info(SDK_LOG_PREFIX2, ...args),
+  warn: (...args) => console.warn(SDK_LOG_PREFIX2, ...args),
+  error: (...args) => console.error(SDK_LOG_PREFIX2, ...args)
+};
+function createFFIDAnnouncementsClient(config = {}) {
+  const baseUrl = config.apiBaseUrl ?? DEFAULT_API_BASE_URL;
+  const logger = config.logger ?? (config.debug ? consoleLogger2 : quietLogger);
+  async function fetchApi(endpoint) {
+    const url = `${baseUrl}${endpoint}`;
+    logger.debug("Fetching:", url);
+    let response;
+    try {
+      response = await fetch(url, {
+        headers: {
+          Accept: "application/json"
+        }
+      });
+    } catch (error) {
+      logger.error("Network error:", { url, error });
+      return {
+        error: {
+          code: FFID_ANNOUNCEMENTS_ERROR_CODES.NETWORK_ERROR,
+          message: error instanceof Error ? error.message : "\u30CD\u30C3\u30C8\u30EF\u30FC\u30AF\u30A8\u30E9\u30FC\u304C\u767A\u751F\u3057\u307E\u3057\u305F"
+        }
+      };
+    }
+    let data;
+    try {
+      data = await response.json();
+    } catch (parseError) {
+      logger.error("Parse error:", { url, status: response.status, parseError });
+      return {
+        error: {
+          code: FFID_ANNOUNCEMENTS_ERROR_CODES.PARSE_ERROR,
+          message: `\u30B5\u30FC\u30D0\u30FC\u304B\u3089\u4E0D\u6B63\u306A\u30EC\u30B9\u30DD\u30F3\u30B9\u3092\u53D7\u4FE1\u3057\u307E\u3057\u305F (status: ${response.status})`
+        }
+      };
+    }
+    logger.debug("Response:", response.status, data);
+    if (!response.ok || !data.success) {
+      return {
+        error: data.error ?? {
+          code: FFID_ANNOUNCEMENTS_ERROR_CODES.UNKNOWN_ERROR,
+          message: "\u4E0D\u660E\u306A\u30A8\u30E9\u30FC\u304C\u767A\u751F\u3057\u307E\u3057\u305F"
+        }
+      };
+    }
+    if (data.data === void 0) {
+      return {
+        error: {
+          code: FFID_ANNOUNCEMENTS_ERROR_CODES.UNKNOWN_ERROR,
+          message: "\u30B5\u30FC\u30D0\u30FC\u304B\u3089\u30C7\u30FC\u30BF\u304C\u8FD4\u3055\u308C\u307E\u305B\u3093\u3067\u3057\u305F"
+        }
+      };
+    }
+    return { data: data.data };
+  }
+  async function listAnnouncements(options = {}) {
+    const params = new URLSearchParams();
+    if (options.limit !== void 0) {
+      const limit = Math.max(0, Math.floor(options.limit));
+      params.set("limit", String(limit));
+    }
+    if (options.offset !== void 0) {
+      const offset = Math.max(0, Math.floor(options.offset));
+      params.set("offset", String(offset));
+    }
+    const query = params.toString();
+    const endpoint = query ? `${API_PATH}?${query}` : API_PATH;
+    return fetchApi(endpoint);
+  }
+  return {
+    /** List published announcements */
+    listAnnouncements,
+    /** Resolved logger instance */
+    logger,
+    /** API base URL */
+    baseUrl
+  };
+}
+
+// src/hooks/useFFIDAnnouncements.ts
+var LAST_READ_STORAGE_KEY = "ffid-announcements-last-read";
+function getStoredLastReadAt() {
+  try {
+    return localStorage.getItem(LAST_READ_STORAGE_KEY);
+  } catch {
+    return null;
+  }
+}
+function useFFIDAnnouncements(options = {}) {
+  const {
+    limit,
+    offset,
+    apiBaseUrl,
+    debug,
+    enabled = true
+  } = options;
+  const [announcements, setAnnouncements] = react.useState([]);
+  const [total, setTotal] = react.useState(0);
+  const [isLoading, setIsLoading] = react.useState(false);
+  const [error, setError] = react.useState(null);
+  const [lastReadAt, setLastReadAt] = react.useState(getStoredLastReadAt);
+  const resolvedBaseUrl = apiBaseUrl ?? DEFAULT_API_BASE_URL;
+  const client = react.useMemo(
+    () => createFFIDAnnouncementsClient({ apiBaseUrl: resolvedBaseUrl, debug }),
+    [resolvedBaseUrl, debug]
+  );
+  const unreadCount = react.useMemo(() => {
+    if (!lastReadAt) {
+      return announcements.length;
+    }
+    const lastReadTime = new Date(lastReadAt).getTime();
+    return announcements.filter(
+      (a) => a.publishedAt && new Date(a.publishedAt).getTime() > lastReadTime
+    ).length;
+  }, [announcements, lastReadAt]);
+  const fetchAnnouncements = react.useCallback(async () => {
+    setIsLoading(true);
+    setError(null);
+    try {
+      const fetchOptions = {};
+      if (limit !== void 0) fetchOptions.limit = limit;
+      if (offset !== void 0) fetchOptions.offset = offset;
+      const result = await client.listAnnouncements(fetchOptions);
+      if (result.error) {
+        setError(result.error);
+      } else {
+        setAnnouncements(result.data.announcements);
+        setTotal(result.data.total);
+      }
+    } catch (err) {
+      setError({
+        code: FFID_ANNOUNCEMENTS_ERROR_CODES.UNKNOWN_ERROR,
+        message: err instanceof Error ? err.message : "\u4E88\u671F\u3057\u306A\u3044\u30A8\u30E9\u30FC\u304C\u767A\u751F\u3057\u307E\u3057\u305F"
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  }, [client, limit, offset]);
+  react.useEffect(() => {
+    if (enabled) {
+      void fetchAnnouncements();
+    }
+  }, [enabled, fetchAnnouncements]);
+  const markAsRead = react.useCallback(() => {
+    const now = (/* @__PURE__ */ new Date()).toISOString();
+    setLastReadAt(now);
+    try {
+      localStorage.setItem(LAST_READ_STORAGE_KEY, now);
+    } catch {
+    }
+  }, []);
+  return {
+    announcements,
+    total,
+    unreadCount,
+    isLoading,
+    error,
+    refetch: fetchAnnouncements,
+    markAsRead
+  };
+}
+var DEFAULT_ICON_SIZE = 20;
+var BADGE_SIZE = 18;
+var BADGE_FONT_SIZE = 11;
+var BADGE_OFFSET = -6;
+var BADGE_MAX_COUNT = 99;
+function BellIcon({ size, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10.3 21a1.94 1.94 0 0 0 3.4 0" })
+      ]
+    }
+  );
+}
+function FFIDAnnouncementBadge({
+  onClick,
+  className = "",
+  classNames = {},
+  style,
+  announcementOptions,
+  iconSize = DEFAULT_ICON_SIZE,
+  ariaLabel = "\u304A\u77E5\u3089\u305B"
+}) {
+  const { unreadCount } = useFFIDAnnouncements(announcementOptions);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      className: [className, classNames.button].filter(Boolean).join(" ") || void 0,
+      style: {
+        position: "relative",
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        background: "none",
+        border: "none",
+        cursor: "pointer",
+        padding: 4,
+        borderRadius: 6,
+        color: "inherit",
+        ...style
+      },
+      "aria-label": `${ariaLabel}${unreadCount > 0 ? ` (${unreadCount}\u4EF6\u672A\u8AAD)` : ""}`,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(BellIcon, { size: iconSize, className: classNames.icon }),
+        unreadCount > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: classNames.badge,
+            style: {
+              position: "absolute",
+              top: BADGE_OFFSET,
+              right: BADGE_OFFSET,
+              display: "inline-flex",
+              alignItems: "center",
+              justifyContent: "center",
+              minWidth: BADGE_SIZE,
+              height: BADGE_SIZE,
+              padding: "0 4px",
+              borderRadius: 9999,
+              fontSize: BADGE_FONT_SIZE,
+              fontWeight: 600,
+              lineHeight: 1,
+              backgroundColor: "#ef4444",
+              color: "white"
+            },
+            "aria-hidden": "true",
+            children: unreadCount > BADGE_MAX_COUNT ? `${BADGE_MAX_COUNT}+` : unreadCount
+          }
+        )
+      ]
+    }
+  );
+}
+function WrenchIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: 16,
+      height: 16,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" })
+    }
+  );
+}
+function AlertTriangleIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: 16,
+      height: 16,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 9v4" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 17h.01" })
+      ]
+    }
+  );
+}
+function InfoIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: 16,
+      height: 16,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 16v-4" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 8h.01" })
+      ]
+    }
+  );
+}
+var TYPE_ICON_CONFIG = {
+  maintenance: { icon: WrenchIcon, color: "#f59e0b" },
+  incident: { icon: AlertTriangleIcon, color: "#ef4444" }
+};
+function getTypeIcon(type) {
+  const category = type.split(".")[0];
+  const config = TYPE_ICON_CONFIG[category];
+  if (config) {
+    return { icon: config.icon(), color: config.color };
+  }
+  return { icon: /* @__PURE__ */ jsxRuntime.jsx(InfoIcon, {}), color: "#6b7280" };
+}
+var DEFAULT_MAX_CONTENT_LINES = 2;
+function defaultFormatDate(dateStr) {
+  try {
+    const date = new Date(dateStr);
+    return new Intl.DateTimeFormat("ja-JP", {
+      year: "numeric",
+      month: "2-digit",
+      day: "2-digit",
+      hour: "2-digit",
+      minute: "2-digit"
+    }).format(date);
+  } catch {
+    return dateStr;
+  }
+}
+function FFIDAnnouncementList({
+  announcements,
+  isLoading = false,
+  className = "",
+  classNames = {},
+  style,
+  formatDate = defaultFormatDate,
+  emptyMessage,
+  loadingRender,
+  renderItem,
+  maxContentLines = DEFAULT_MAX_CONTENT_LINES
+}) {
+  if (isLoading) {
+    if (loadingRender) {
+      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingRender });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: [className, classNames.container].filter(Boolean).join(" ") || void 0,
+        style: { padding: SPACING_MD, textAlign: "center", color: COLOR_TEXT_MUTED, ...style },
+        children: "\u8AAD\u307F\u8FBC\u307F\u4E2D..."
+      }
+    );
+  }
+  if (announcements.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: [className, classNames.container, classNames.empty].filter(Boolean).join(" ") || void 0,
+        style: { padding: SPACING_MD, textAlign: "center", color: COLOR_TEXT_MUTED, ...style },
+        children: emptyMessage ?? "\u304A\u77E5\u3089\u305B\u306F\u3042\u308A\u307E\u305B\u3093"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: [className, classNames.container].filter(Boolean).join(" ") || void 0,
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        gap: 0,
+        ...style
+      },
+      role: "list",
+      "aria-label": "\u304A\u77E5\u3089\u305B\u4E00\u89A7",
+      children: announcements.map((announcement) => {
+        if (renderItem) {
+          return /* @__PURE__ */ jsxRuntime.jsx("div", { role: "listitem", children: renderItem(announcement) }, announcement.id);
+        }
+        const { icon, color } = getTypeIcon(announcement.type);
+        const displayDate = announcement.publishedAt ?? announcement.createdAt;
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: classNames.item,
+            style: {
+              display: "flex",
+              gap: SPACING_SM,
+              padding: SPACING_MD,
+              borderBottom: `1px solid ${COLOR_BORDER}`
+            },
+            role: "listitem",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: classNames.icon,
+                  style: {
+                    flexShrink: 0,
+                    color,
+                    marginTop: 2
+                  },
+                  children: icon
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: classNames.title,
+                    style: {
+                      fontSize: FONT_SIZE_SM,
+                      fontWeight: 600,
+                      lineHeight: 1.4,
+                      marginBottom: SPACING_XS
+                    },
+                    children: announcement.title
+                  }
+                ),
+                maxContentLines > 0 && announcement.content && /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: classNames.content,
+                    style: {
+                      fontSize: FONT_SIZE_XS,
+                      color: COLOR_TEXT_MUTED,
+                      lineHeight: 1.5,
+                      overflow: "hidden",
+                      display: "-webkit-box",
+                      WebkitLineClamp: maxContentLines,
+                      WebkitBoxOrient: "vertical",
+                      marginBottom: SPACING_XS
+                    },
+                    children: announcement.content
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsxs(
+                  "div",
+                  {
+                    style: {
+                      display: "flex",
+                      flexWrap: "wrap",
+                      alignItems: "center",
+                      gap: SPACING_XS,
+                      marginTop: SPACING_XS
+                    },
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          className: classNames.timestamp,
+                          style: {
+                            fontSize: FONT_SIZE_XS,
+                            color: COLOR_TEXT_MUTED
+                          },
+                          children: formatDate(displayDate)
+                        }
+                      ),
+                      announcement.affectedServices.length > 0 && announcement.affectedServices.map((service) => /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          className: classNames.serviceTag,
+                          style: {
+                            display: "inline-block",
+                            fontSize: FONT_SIZE_XS,
+                            padding: `1px ${SPACING_XS}px`,
+                            borderRadius: BORDER_RADIUS_SM,
+                            backgroundColor: "#f3f4f6",
+                            color: "#4b5563"
+                          },
+                          children: service
+                        },
+                        service
+                      ))
+                    ]
+                  }
+                )
+              ] })
+            ]
+          },
+          announcement.id
+        );
+      })
+    }
+  );
+}
+
 exports.DEFAULT_API_BASE_URL = DEFAULT_API_BASE_URL;
+exports.FFIDAnnouncementBadge = FFIDAnnouncementBadge;
+exports.FFIDAnnouncementList = FFIDAnnouncementList;
 exports.FFIDLoginButton = FFIDLoginButton;
 exports.FFIDOrganizationSwitcher = FFIDOrganizationSwitcher;
 exports.FFIDProvider = FFIDProvider;
 exports.FFIDSubscriptionBadge = FFIDSubscriptionBadge;
 exports.FFIDUserMenu = FFIDUserMenu;
+exports.FFID_ANNOUNCEMENTS_ERROR_CODES = FFID_ANNOUNCEMENTS_ERROR_CODES;
+exports.createFFIDAnnouncementsClient = createFFIDAnnouncementsClient;
 exports.useFFID = useFFID;
+exports.useFFIDAnnouncements = useFFIDAnnouncements;
 exports.useFFIDContext = useFFIDContext;
 exports.useSubscription = useSubscription;
 exports.withSubscription = withSubscription;

package/dist/chunk-P4MLCG4T.js

@@ -0,0 +1,4 @@
+// src/constants.ts
+var DEFAULT_API_BASE_URL = "https://id.feelflow.co.jp";
+
+export { DEFAULT_API_BASE_URL };

package/dist/chunk-P5PPUZGX.cjs

@@ -0,0 +1,6 @@
+'use strict';
+
+// src/constants.ts
+var DEFAULT_API_BASE_URL = "https://id.feelflow.co.jp";
+
+exports.DEFAULT_API_BASE_URL = DEFAULT_API_BASE_URL;