@equal-experts/kuat-react 0.15.0-beta.0 → 0.15.0-beta.2

package/dist/tag-CkE_Xgvs.js

@@ -0,0 +1,89 @@
+import { jsx as u, jsxs as x } from "react/jsx-runtime";
+import * as N from "react";
+import { Check as h, X as p } from "lucide-react";
+import { c as _ } from "./utils-DLUjLwnh.js";
+import { u as G } from "./tag-group-context-D_b_R9lC.js";
+const A = [
+  "base",
+  "index-indigo",
+  "transform-teal",
+  "packet-plum",
+  "server-slate",
+  "logic-lime",
+  "signal-yellow",
+  "cursor-coral",
+  "patch-peach"
+], k = ["display", "toggle", "dismiss"], O = N.forwardRef(function({
+  className: r,
+  color: s = "base",
+  mode: a = "display",
+  selected: e = !1,
+  onSelectedChange: l,
+  onDismiss: c,
+  onClick: g,
+  children: n,
+  ...m
+}, f) {
+  const i = G(), o = a !== "display", v = a === "dismiss" || a === "toggle" && e, y = _(
+    "tag",
+    `tag--${s}`,
+    o && "tag--interactive",
+    v && "tag--selected",
+    r
+  );
+  return o ? /* @__PURE__ */ x(
+    "button",
+    {
+      ref: f,
+      type: "button",
+      "data-slot": "tag",
+      "data-color": s,
+      "data-mode": a,
+      "aria-pressed": a === "toggle" ? e : void 0,
+      className: y,
+      onClick: (d) => {
+        var T;
+        if (g == null || g(d), !d.defaultPrevented)
+          if (a === "toggle")
+            l == null || l(!e);
+          else {
+            const b = (T = d.currentTarget.textContent) == null ? void 0 : T.trim();
+            b && (i == null || i.announce(`${b} removed`)), c == null || c();
+          }
+      },
+      ...m,
+      children: [
+        n,
+        a === "toggle" && e ? /* @__PURE__ */ u(h, { "aria-hidden": "true", className: "tag__icon", "data-slot": "tag-icon" }) : null,
+        a === "dismiss" ? /* @__PURE__ */ u(p, { "aria-hidden": "true", className: "tag__icon", "data-slot": "tag-icon" }) : null
+      ]
+    }
+  ) : /* @__PURE__ */ u(
+    "span",
+    {
+      ref: f,
+      "data-slot": "tag",
+      "data-color": s,
+      "data-mode": a,
+      className: y,
+      ...m,
+      children: n
+    }
+  );
+});
+O.displayName = "Tag";
+function E(t) {
+  const r = (t == null ? void 0 : t.color) ?? "base", s = (t == null ? void 0 : t.mode) ?? "display", a = s === "dismiss" || s === "toggle" && !!(t != null && t.selected);
+  return _(
+    "tag",
+    `tag--${r}`,
+    s !== "display" && "tag--interactive",
+    a && "tag--selected"
+  );
+}
+export {
+  O as T,
+  A as a,
+  k as b,
+  E as t
+};

package/dist/tag-group-context-D_b_R9lC.js

@@ -0,0 +1,9 @@
+import * as t from "react";
+const e = t.createContext(null);
+function o() {
+  return t.useContext(e);
+}
+export {
+  e as T,
+  o as u
+};

package/dist/tag-group-tBUBPRjX.js

@@ -0,0 +1,26 @@
+import { jsxs as g, jsx as e } from "react/jsx-runtime";
+import * as a from "react";
+import { c as m } from "./utils-DLUjLwnh.js";
+import { T as d } from "./tag-group-context-D_b_R9lC.js";
+const f = a.forwardRef(function({ className: r, label: s, children: t, ...n }, l) {
+  const [i, p] = a.useState(""), o = a.useCallback((u) => p(u), []), c = a.useMemo(() => ({ announce: o }), [o]);
+  return /* @__PURE__ */ g(
+    "div",
+    {
+      ref: l,
+      role: "group",
+      "aria-label": s,
+      "data-slot": "tag-group",
+      className: m("tag-group", r),
+      ...n,
+      children: [
+        /* @__PURE__ */ e(d.Provider, { value: c, children: t }),
+        /* @__PURE__ */ e("span", { "aria-live": "polite", className: "sr-only", "data-slot": "tag-group-live-region", children: i })
+      ]
+    }
+  );
+});
+f.displayName = "TagGroup";
+export {
+  f as T
+};

package/dist/tag-group.d.ts

@@ -0,0 +1,3 @@
+export { cn } from './lib/utils';
+export { TagGroup, TagGroupContext, useTagGroup } from './components/ui/tag-group';
+export type { TagGroupProps, TagGroupContextValue } from './components/ui/tag-group';

package/dist/tag-group.js

@@ -0,0 +1,9 @@
+import { c as a } from "./utils-DLUjLwnh.js";
+import { T as e } from "./tag-group-tBUBPRjX.js";
+import { T as t, u } from "./tag-group-context-D_b_R9lC.js";
+export {
+  e as TagGroup,
+  t as TagGroupContext,
+  a as cn,
+  u as useTagGroup
+};

package/dist/tag.d.ts

@@ -0,0 +1,3 @@
+export { cn } from './lib/utils';
+export { Tag, tagVariants, TAG_COLORS, TAG_MODES } from './components/ui/tag';
+export type { TagProps, TagColor, TagMode } from './components/ui/tag';

package/dist/tag.js

@@ -0,0 +1,9 @@
+import { c as r } from "./utils-DLUjLwnh.js";
+import { a as o, b as T, T as O, t as c } from "./tag-CkE_Xgvs.js";
+export {
+  o as TAG_COLORS,
+  T as TAG_MODES,
+  O as Tag,
+  r as cn,
+  c as tagVariants
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equal-experts/kuat-react",
-  "version": "0.15.0-beta.0",
+  "version": "0.15.0-beta.2",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -26,10 +26,30 @@
       "import": "./dist/badge.js",
       "types": "./dist/badge.d.ts"
     },
+    "./status-badge": {
+      "import": "./dist/status-badge.js",
+      "types": "./dist/status-badge.d.ts"
+    },
+    "./tag": {
+      "import": "./dist/tag.js",
+      "types": "./dist/tag.d.ts"
+    },
+    "./tag-group": {
+      "import": "./dist/tag-group.js",
+      "types": "./dist/tag-group.d.ts"
+    },
+    "./counter-badge": {
+      "import": "./dist/counter-badge.js",
+      "types": "./dist/counter-badge.d.ts"
+    },
     "./button-group": {
       "import": "./dist/button-group.js",
       "types": "./dist/button-group.d.ts"
     },
+    "./callout": {
+      "import": "./dist/callout.js",
+      "types": "./dist/callout.d.ts"
+    },
     "./kuat-radial-progress": {
       "import": "./dist/kuat-radial-progress.js",
       "types": "./dist/kuat-radial-progress.d.ts"
@@ -128,6 +148,7 @@
   },
   "devDependencies": {
     "@equal-experts/kuat-core": "workspace:*",
+    "@figma/code-connect": "^1.4.9",
     "@tailwindcss/vite": "^4.0.0",
     "@testing-library/jest-dom": "^6.6.0",
     "@testing-library/react": "^16.0.0",

package/dist/badge-BZgdEQSD.js

@@ -1,22 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { c as r } from "./utils-DLUjLwnh.js";
-const c = ["default", "secondary", "destructive", "outline", "ghost"], f = ["default", "round"];
-function g({ className: a, variant: e = "default", roundness: d = "default", ...u }) {
-  return /* @__PURE__ */ t(
-    "div",
-    {
-      className: r("badge", `badge--${e}`, `badge--roundness-${d}`, a),
-      ...u
-    }
-  );
-}
-function b(a) {
-  const e = (a == null ? void 0 : a.variant) ?? "default", d = (a == null ? void 0 : a.roundness) ?? "default";
-  return r("badge", `badge--${e}`, `badge--roundness-${d}`);
-}
-export {
-  g as B,
-  c as a,
-  b,
-  f as c
-};