@bridger-kr/react 0.1.0

package/dist/components/product/ToolCard.cjs

@@ -0,0 +1,70 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/product/ToolCard.tsx
+var STATE_COLOR = {
+  available: "var(--dt-success)",
+  managed: "var(--dt-success)",
+  locked: "var(--dt-warning)"
+};
+function ToolCard({
+  name,
+  method = "GET",
+  category,
+  description = "\uC124\uBA85 \uC5C6\uC74C",
+  path = "/",
+  state = "available",
+  stateLabel,
+  style,
+  ...rest
+}) {
+  const cat = category ?? (name ? name.split("_")[0] : "etc");
+  const labels = { available: "\uC0AC\uC6A9 \uAC00\uB2A5", managed: "\uAD00\uB9AC\uD615 \uD0A4", locked: "\uD0A4 \uB4F1\uB85D" };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "article",
+    {
+      className: "dt-tool-card",
+      ...rest,
+      style: {
+        borderRadius: "var(--dt-radius-md)",
+        background: "var(--dt-surface)",
+        boxShadow: "var(--dt-ring), var(--dt-shadow-xs)",
+        padding: "16px 18px",
+        transition: "box-shadow var(--dt-motion), background-color var(--dt-motion)",
+        ...style
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "flex-start", justifyContent: "space-between", gap: 12 }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { minWidth: 0 }, children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexWrap: "wrap", gap: 8 }, children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "dt-chip dt-chip-muted", children: cat }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "dt-chip dt-chip-accent", children: method })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("h4", { style: { marginTop: 11, fontSize: 15, fontWeight: 650, letterSpacing: "-0.01em", color: "var(--dt-ink-strong)", wordBreak: "break-all" }, children: name })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { display: "inline-flex", alignItems: "center", gap: 6, flex: "0 0 auto", fontSize: 12, fontWeight: 600, color: STATE_COLOR[state] }, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { width: 6, height: 6, borderRadius: "9999px", background: STATE_COLOR[state] } }),
+            stateLabel ?? labels[state]
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { style: {
+          marginTop: 12,
+          fontSize: 13,
+          lineHeight: 1.5,
+          color: "var(--dt-muted-strong)",
+          display: "-webkit-box",
+          WebkitLineClamp: 2,
+          WebkitBoxOrient: "vertical",
+          overflow: "hidden"
+        }, children: description }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginTop: 14, paddingTop: 13, borderTop: "1px solid var(--dt-divider)", display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12 }, children: /* @__PURE__ */ jsxRuntime.jsx("code", { style: { fontFamily: "var(--dt-font-mono)", fontSize: 12, color: "var(--dt-muted)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: path }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("style", { children: ".dt-tool-card:hover{box-shadow:var(--dt-ring), var(--dt-shadow-md)}.dt-chip{font-family:var(--dt-font-mono);font-size:11px;font-weight:600;letter-spacing:.02em;padding:3px 8px;border-radius:var(--dt-radius-sm);background:var(--dt-surface-sunken)}.dt-chip-muted{color:var(--dt-muted-strong)}.dt-chip-accent{color:var(--dt-accent)" })
+      ]
+    }
+  );
+}
+
+exports.ToolCard = ToolCard;
+//# sourceMappingURL=ToolCard.cjs.map
+//# sourceMappingURL=ToolCard.cjs.map

package/dist/components/product/ToolCard.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/product/ToolCard.tsx"],"names":["jsxs","jsx"],"mappings":"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","file":"ToolCard.cjs","sourcesContent":["import type { HTMLAttributes } from 'react';\n\nconst STATE_COLOR: Record<'available' | 'managed' | 'locked', string> = {\n  available: 'var(--dt-success)',\n  managed: 'var(--dt-success)',\n  locked: 'var(--dt-warning)',\n};\n\nexport interface ToolCardProps extends HTMLAttributes<HTMLElement> {\n  /** Tool name, e.g. \"weather_getForecast\". */\n  name: string;\n  method?: 'GET' | 'POST' | 'PUT' | 'DELETE' | string;\n  /** Category chip; defaults to the name prefix before the first underscore. */\n  category?: string;\n  description?: string;\n  /** Mono API path shown in the footer. */\n  path?: string;\n  /** Usability state — drives the status dot/label. */\n  state?: 'available' | 'managed' | 'locked';\n  stateLabel?: string;\n}\n\n/**\n * An MCP tool as shown in the catalog and tool list.\n */\nexport function ToolCard({\n  name,\n  method = 'GET',\n  category,\n  description = '설명 없음',\n  path = '/',\n  state = 'available',\n  stateLabel,\n  style,\n  ...rest\n}: ToolCardProps) {\n  const cat = category ?? (name ? name.split('_')[0] : 'etc');\n  const labels = { available: '사용 가능', managed: '관리형 키', locked: '키 등록' };\n  return (\n    <article\n      className=\"dt-tool-card\"\n      {...rest}\n      style={{\n        borderRadius: 'var(--dt-radius-md)',\n        background: 'var(--dt-surface)',\n        boxShadow: 'var(--dt-ring), var(--dt-shadow-xs)',\n        padding: '16px 18px',\n        transition: 'box-shadow var(--dt-motion), background-color var(--dt-motion)',\n        ...style,\n      }}\n    >\n      <div style={{ display: 'flex', alignItems: 'flex-start', justifyContent: 'space-between', gap: 12 }}>\n        <div style={{ minWidth: 0 }}>\n          <div style={{ display: 'flex', flexWrap: 'wrap', gap: 8 }}>\n            <span className=\"dt-chip dt-chip-muted\">{cat}</span>\n            <span className=\"dt-chip dt-chip-accent\">{method}</span>\n          </div>\n          <h4 style={{ marginTop: 11, fontSize: 15, fontWeight: 650, letterSpacing: '-0.01em', color: 'var(--dt-ink-strong)', wordBreak: 'break-all' }}>\n            {name}\n          </h4>\n        </div>\n        <span style={{ display: 'inline-flex', alignItems: 'center', gap: 6, flex: '0 0 auto', fontSize: 12, fontWeight: 600, color: STATE_COLOR[state] }}>\n          <span style={{ width: 6, height: 6, borderRadius: '9999px', background: STATE_COLOR[state] }} />\n          {stateLabel ?? labels[state]}\n        </span>\n      </div>\n      <p style={{\n        marginTop: 12, fontSize: 13, lineHeight: 1.5, color: 'var(--dt-muted-strong)',\n        display: '-webkit-box', WebkitLineClamp: 2, WebkitBoxOrient: 'vertical', overflow: 'hidden',\n      }}>\n        {description}\n      </p>\n      <div style={{ marginTop: 14, paddingTop: 13, borderTop: '1px solid var(--dt-divider)', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12 }}>\n        <code style={{ fontFamily: 'var(--dt-font-mono)', fontSize: 12, color: 'var(--dt-muted)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>\n          {path}\n        </code>\n      </div>\n      <style>{'.dt-tool-card:hover{box-shadow:var(--dt-ring), var(--dt-shadow-md)}.dt-chip{font-family:var(--dt-font-mono);font-size:11px;font-weight:600;letter-spacing:.02em;padding:3px 8px;border-radius:var(--dt-radius-sm);background:var(--dt-surface-sunken)}.dt-chip-muted{color:var(--dt-muted-strong)}.dt-chip-accent{color:var(--dt-accent)'}</style>\n    </article>\n  );\n}\n"]}

package/dist/components/product/ToolCard.d.cts

@@ -0,0 +1,22 @@
+import * as react from 'react';
+import { HTMLAttributes } from 'react';
+
+interface ToolCardProps extends HTMLAttributes<HTMLElement> {
+    /** Tool name, e.g. "weather_getForecast". */
+    name: string;
+    method?: 'GET' | 'POST' | 'PUT' | 'DELETE' | string;
+    /** Category chip; defaults to the name prefix before the first underscore. */
+    category?: string;
+    description?: string;
+    /** Mono API path shown in the footer. */
+    path?: string;
+    /** Usability state — drives the status dot/label. */
+    state?: 'available' | 'managed' | 'locked';
+    stateLabel?: string;
+}
+/**
+ * An MCP tool as shown in the catalog and tool list.
+ */
+declare function ToolCard({ name, method, category, description, path, state, stateLabel, style, ...rest }: ToolCardProps): react.JSX.Element;
+
+export { ToolCard, type ToolCardProps };

package/dist/components/product/ToolCard.d.ts

@@ -0,0 +1,22 @@
+import * as react from 'react';
+import { HTMLAttributes } from 'react';
+
+interface ToolCardProps extends HTMLAttributes<HTMLElement> {
+    /** Tool name, e.g. "weather_getForecast". */
+    name: string;
+    method?: 'GET' | 'POST' | 'PUT' | 'DELETE' | string;
+    /** Category chip; defaults to the name prefix before the first underscore. */
+    category?: string;
+    description?: string;
+    /** Mono API path shown in the footer. */
+    path?: string;
+    /** Usability state — drives the status dot/label. */
+    state?: 'available' | 'managed' | 'locked';
+    stateLabel?: string;
+}
+/**
+ * An MCP tool as shown in the catalog and tool list.
+ */
+declare function ToolCard({ name, method, category, description, path, state, stateLabel, style, ...rest }: ToolCardProps): react.JSX.Element;
+
+export { ToolCard, type ToolCardProps };

package/dist/components/product/ToolCard.mjs

@@ -0,0 +1,68 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/product/ToolCard.tsx
+var STATE_COLOR = {
+  available: "var(--dt-success)",
+  managed: "var(--dt-success)",
+  locked: "var(--dt-warning)"
+};
+function ToolCard({
+  name,
+  method = "GET",
+  category,
+  description = "\uC124\uBA85 \uC5C6\uC74C",
+  path = "/",
+  state = "available",
+  stateLabel,
+  style,
+  ...rest
+}) {
+  const cat = category ?? (name ? name.split("_")[0] : "etc");
+  const labels = { available: "\uC0AC\uC6A9 \uAC00\uB2A5", managed: "\uAD00\uB9AC\uD615 \uD0A4", locked: "\uD0A4 \uB4F1\uB85D" };
+  return /* @__PURE__ */ jsxs(
+    "article",
+    {
+      className: "dt-tool-card",
+      ...rest,
+      style: {
+        borderRadius: "var(--dt-radius-md)",
+        background: "var(--dt-surface)",
+        boxShadow: "var(--dt-ring), var(--dt-shadow-xs)",
+        padding: "16px 18px",
+        transition: "box-shadow var(--dt-motion), background-color var(--dt-motion)",
+        ...style
+      },
+      children: [
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "flex-start", justifyContent: "space-between", gap: 12 }, children: [
+          /* @__PURE__ */ jsxs("div", { style: { minWidth: 0 }, children: [
+            /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexWrap: "wrap", gap: 8 }, children: [
+              /* @__PURE__ */ jsx("span", { className: "dt-chip dt-chip-muted", children: cat }),
+              /* @__PURE__ */ jsx("span", { className: "dt-chip dt-chip-accent", children: method })
+            ] }),
+            /* @__PURE__ */ jsx("h4", { style: { marginTop: 11, fontSize: 15, fontWeight: 650, letterSpacing: "-0.01em", color: "var(--dt-ink-strong)", wordBreak: "break-all" }, children: name })
+          ] }),
+          /* @__PURE__ */ jsxs("span", { style: { display: "inline-flex", alignItems: "center", gap: 6, flex: "0 0 auto", fontSize: 12, fontWeight: 600, color: STATE_COLOR[state] }, children: [
+            /* @__PURE__ */ jsx("span", { style: { width: 6, height: 6, borderRadius: "9999px", background: STATE_COLOR[state] } }),
+            stateLabel ?? labels[state]
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("p", { style: {
+          marginTop: 12,
+          fontSize: 13,
+          lineHeight: 1.5,
+          color: "var(--dt-muted-strong)",
+          display: "-webkit-box",
+          WebkitLineClamp: 2,
+          WebkitBoxOrient: "vertical",
+          overflow: "hidden"
+        }, children: description }),
+        /* @__PURE__ */ jsx("div", { style: { marginTop: 14, paddingTop: 13, borderTop: "1px solid var(--dt-divider)", display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12 }, children: /* @__PURE__ */ jsx("code", { style: { fontFamily: "var(--dt-font-mono)", fontSize: 12, color: "var(--dt-muted)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: path }) }),
+        /* @__PURE__ */ jsx("style", { children: ".dt-tool-card:hover{box-shadow:var(--dt-ring), var(--dt-shadow-md)}.dt-chip{font-family:var(--dt-font-mono);font-size:11px;font-weight:600;letter-spacing:.02em;padding:3px 8px;border-radius:var(--dt-radius-sm);background:var(--dt-surface-sunken)}.dt-chip-muted{color:var(--dt-muted-strong)}.dt-chip-accent{color:var(--dt-accent)" })
+      ]
+    }
+  );
+}
+
+export { ToolCard };
+//# sourceMappingURL=ToolCard.mjs.map
+//# sourceMappingURL=ToolCard.mjs.map

package/dist/components/product/ToolCard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/product/ToolCard.tsx"],"names":[],"mappings":"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","file":"ToolCard.mjs","sourcesContent":["import type { HTMLAttributes } from 'react';\n\nconst STATE_COLOR: Record<'available' | 'managed' | 'locked', string> = {\n  available: 'var(--dt-success)',\n  managed: 'var(--dt-success)',\n  locked: 'var(--dt-warning)',\n};\n\nexport interface ToolCardProps extends HTMLAttributes<HTMLElement> {\n  /** Tool name, e.g. \"weather_getForecast\". */\n  name: string;\n  method?: 'GET' | 'POST' | 'PUT' | 'DELETE' | string;\n  /** Category chip; defaults to the name prefix before the first underscore. */\n  category?: string;\n  description?: string;\n  /** Mono API path shown in the footer. */\n  path?: string;\n  /** Usability state — drives the status dot/label. */\n  state?: 'available' | 'managed' | 'locked';\n  stateLabel?: string;\n}\n\n/**\n * An MCP tool as shown in the catalog and tool list.\n */\nexport function ToolCard({\n  name,\n  method = 'GET',\n  category,\n  description = '설명 없음',\n  path = '/',\n  state = 'available',\n  stateLabel,\n  style,\n  ...rest\n}: ToolCardProps) {\n  const cat = category ?? (name ? name.split('_')[0] : 'etc');\n  const labels = { available: '사용 가능', managed: '관리형 키', locked: '키 등록' };\n  return (\n    <article\n      className=\"dt-tool-card\"\n      {...rest}\n      style={{\n        borderRadius: 'var(--dt-radius-md)',\n        background: 'var(--dt-surface)',\n        boxShadow: 'var(--dt-ring), var(--dt-shadow-xs)',\n        padding: '16px 18px',\n        transition: 'box-shadow var(--dt-motion), background-color var(--dt-motion)',\n        ...style,\n      }}\n    >\n      <div style={{ display: 'flex', alignItems: 'flex-start', justifyContent: 'space-between', gap: 12 }}>\n        <div style={{ minWidth: 0 }}>\n          <div style={{ display: 'flex', flexWrap: 'wrap', gap: 8 }}>\n            <span className=\"dt-chip dt-chip-muted\">{cat}</span>\n            <span className=\"dt-chip dt-chip-accent\">{method}</span>\n          </div>\n          <h4 style={{ marginTop: 11, fontSize: 15, fontWeight: 650, letterSpacing: '-0.01em', color: 'var(--dt-ink-strong)', wordBreak: 'break-all' }}>\n            {name}\n          </h4>\n        </div>\n        <span style={{ display: 'inline-flex', alignItems: 'center', gap: 6, flex: '0 0 auto', fontSize: 12, fontWeight: 600, color: STATE_COLOR[state] }}>\n          <span style={{ width: 6, height: 6, borderRadius: '9999px', background: STATE_COLOR[state] }} />\n          {stateLabel ?? labels[state]}\n        </span>\n      </div>\n      <p style={{\n        marginTop: 12, fontSize: 13, lineHeight: 1.5, color: 'var(--dt-muted-strong)',\n        display: '-webkit-box', WebkitLineClamp: 2, WebkitBoxOrient: 'vertical', overflow: 'hidden',\n      }}>\n        {description}\n      </p>\n      <div style={{ marginTop: 14, paddingTop: 13, borderTop: '1px solid var(--dt-divider)', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12 }}>\n        <code style={{ fontFamily: 'var(--dt-font-mono)', fontSize: 12, color: 'var(--dt-muted)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>\n          {path}\n        </code>\n      </div>\n      <style>{'.dt-tool-card:hover{box-shadow:var(--dt-ring), var(--dt-shadow-md)}.dt-chip{font-family:var(--dt-font-mono);font-size:11px;font-weight:600;letter-spacing:.02em;padding:3px 8px;border-radius:var(--dt-radius-sm);background:var(--dt-surface-sunken)}.dt-chip-muted{color:var(--dt-muted-strong)}.dt-chip-accent{color:var(--dt-accent)'}</style>\n    </article>\n  );\n}\n"]}