@devalok/shilp-sutra 0.21.0 → 0.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (96) hide show
  1. package/dist/_chunks/use-calendar.js +115 -115
  2. package/dist/_chunks/vendor-utils.js +1230 -1178
  3. package/dist/composed/activity-feed.d.ts.map +1 -1
  4. package/dist/composed/activity-feed.js +78 -78
  5. package/dist/composed/avatar-group.d.ts +2 -2
  6. package/dist/composed/avatar-group.d.ts.map +1 -1
  7. package/dist/composed/avatar-group.js +87 -117
  8. package/dist/composed/command-palette.js +50 -50
  9. package/dist/composed/content-card.js +10 -10
  10. package/dist/composed/empty-state.d.ts.map +1 -1
  11. package/dist/composed/empty-state.js +58 -48
  12. package/dist/composed/global-loading.d.ts.map +1 -1
  13. package/dist/composed/global-loading.js +11 -10
  14. package/dist/composed/loading-skeleton.d.ts.map +1 -1
  15. package/dist/composed/loading-skeleton.js +32 -29
  16. package/dist/composed/member-picker.d.ts.map +1 -1
  17. package/dist/composed/member-picker.js +28 -17
  18. package/dist/composed/page-header.js +25 -25
  19. package/dist/composed/priority-indicator.d.ts.map +1 -1
  20. package/dist/composed/priority-indicator.js +60 -36
  21. package/dist/composed/rich-text-editor.js +104 -104
  22. package/dist/composed/schedule-view.d.ts.map +1 -1
  23. package/dist/composed/schedule-view.js +52 -44
  24. package/dist/composed/status-badge.js +16 -16
  25. package/dist/shell/bottom-navbar.d.ts.map +1 -1
  26. package/dist/shell/bottom-navbar.js +35 -31
  27. package/dist/shell/notification-center.d.ts.map +1 -1
  28. package/dist/shell/notification-center.js +119 -111
  29. package/dist/shell/sidebar.js +2 -2
  30. package/dist/shell/top-bar.js +9 -9
  31. package/dist/tailwind/index.cjs +30 -3
  32. package/dist/tailwind/preset.d.ts.map +1 -1
  33. package/dist/tailwind/preset.js +30 -3
  34. package/dist/tokens/semantic.css +10 -10
  35. package/dist/tokens/typography-semantic.css +3 -3
  36. package/dist/ui/accordion.js +22 -22
  37. package/dist/ui/alert.js +8 -8
  38. package/dist/ui/avatar.d.ts.map +1 -1
  39. package/dist/ui/avatar.js +72 -86
  40. package/dist/ui/badge.js +5 -5
  41. package/dist/ui/banner.js +18 -18
  42. package/dist/ui/breadcrumb.js +23 -23
  43. package/dist/ui/button.js +22 -22
  44. package/dist/ui/card.js +16 -16
  45. package/dist/ui/checkbox.d.ts.map +1 -1
  46. package/dist/ui/checkbox.js +72 -25
  47. package/dist/ui/chip.js +14 -14
  48. package/dist/ui/code.js +9 -9
  49. package/dist/ui/combobox.d.ts.map +1 -1
  50. package/dist/ui/combobox.js +46 -45
  51. package/dist/ui/dialog.js +17 -17
  52. package/dist/ui/dropdown-menu.js +22 -22
  53. package/dist/ui/form.d.ts.map +1 -1
  54. package/dist/ui/form.js +35 -29
  55. package/dist/ui/input.js +20 -20
  56. package/dist/ui/label.js +15 -15
  57. package/dist/ui/lib/motion.d.ts.map +1 -1
  58. package/dist/ui/lib/motion.js +2 -2
  59. package/dist/ui/link.js +14 -14
  60. package/dist/ui/number-input.js +36 -36
  61. package/dist/ui/pagination.js +14 -14
  62. package/dist/ui/progress.js +6 -6
  63. package/dist/ui/radio.d.ts.map +1 -1
  64. package/dist/ui/radio.js +24 -12
  65. package/dist/ui/search-input.d.ts.map +1 -1
  66. package/dist/ui/search-input.js +25 -19
  67. package/dist/ui/select.js +15 -15
  68. package/dist/ui/separator.d.ts +10 -2
  69. package/dist/ui/separator.d.ts.map +1 -1
  70. package/dist/ui/separator.js +16 -15
  71. package/dist/ui/sheet.js +7 -7
  72. package/dist/ui/sidebar.d.ts +1 -1
  73. package/dist/ui/sidebar.d.ts.map +1 -1
  74. package/dist/ui/sidebar.js +22 -22
  75. package/dist/ui/skeleton.js +5 -5
  76. package/dist/ui/slider.js +7 -7
  77. package/dist/ui/stat-card.js +19 -19
  78. package/dist/ui/switch.d.ts.map +1 -1
  79. package/dist/ui/switch.js +14 -13
  80. package/dist/ui/tabs.d.ts.map +1 -1
  81. package/dist/ui/tabs.js +60 -51
  82. package/dist/ui/textarea.js +15 -15
  83. package/dist/ui/toast.js +1 -1
  84. package/dist/ui/toggle.js +5 -5
  85. package/dist/ui/tooltip.d.ts +0 -4
  86. package/dist/ui/tooltip.d.ts.map +1 -1
  87. package/dist/ui/tooltip.js +24 -24
  88. package/docs/components/ui/avatar.md +3 -0
  89. package/docs/components/ui/button.md +5 -0
  90. package/docs/components/ui/checkbox.md +5 -0
  91. package/docs/components/ui/dropdown-menu.md +3 -0
  92. package/docs/components/ui/separator.md +3 -0
  93. package/docs/components/ui/tooltip.md +5 -0
  94. package/llms-full.txt +25 -1
  95. package/llms.txt +20 -0
  96. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"activity-feed.d.ts","sourceRoot":"","sources":["../../src/composed/activity-feed.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAW9B,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;IACxC,MAAM,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAA;IAChC,SAAS,EAAE,IAAI,GAAG,MAAM,CAAA;IACxB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;IAC5D,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC7E,KAAK,EAAE,YAAY,EAAE,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB,WAAW,CAAC,EAAE,WAAW,CAAA;CAC1B;AAiBD;;;GAGG;AACH,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,YAAY,EAAE,EACrB,MAAM,CAAC,EAAE,WAAW,GACnB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,YAAY,EAAE,CAAA;CAAE,EAAE,CA6C5C;AA8ID,QAAA,MAAM,YAAY,0FAiGjB,CAAA;AAGD,OAAO,EAAE,YAAY,EAAE,CAAA"}
1
+ {"version":3,"file":"activity-feed.d.ts","sourceRoot":"","sources":["../../src/composed/activity-feed.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAW9B,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;IACxC,MAAM,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAA;IAChC,SAAS,EAAE,IAAI,GAAG,MAAM,CAAA;IACxB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;IAC5D,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC7E,KAAK,EAAE,YAAY,EAAE,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB,WAAW,CAAC,EAAE,WAAW,CAAA;CAC1B;AAiBD;;;GAGG;AACH,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,YAAY,EAAE,EACrB,MAAM,CAAC,EAAE,WAAW,GACnB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,YAAY,EAAE,CAAA;CAAE,EAAE,CA6C5C;AA8ID,QAAA,MAAM,YAAY,0FAqGjB,CAAA;AAGD,OAAO,EAAE,YAAY,EAAE,CAAA"}
@@ -1,87 +1,87 @@
1
1
  "use client";
2
- import { jsx as t, jsxs as a } from "react/jsx-runtime";
3
- import * as N from "react";
4
- import { cn as r } from "../ui/lib/utils.js";
5
- import { IconChevronRight as S } from "@tabler/icons-react";
6
- import { Avatar as O, AvatarImage as C, AvatarFallback as F } from "../ui/avatar.js";
7
- import { Button as D } from "../ui/button.js";
2
+ import { jsx as t, jsxs as s } from "react/jsx-runtime";
3
+ import * as k from "react";
4
+ import { cn as i } from "../ui/lib/utils.js";
5
+ import { IconChevronRight as F } from "@tabler/icons-react";
6
+ import { Avatar as W, AvatarImage as j, AvatarFallback as E } from "../ui/avatar.js";
7
+ import { Button as S } from "../ui/button.js";
8
8
  import { Skeleton as v } from "../ui/skeleton.js";
9
- import { getInitials as W } from "./lib/string-utils.js";
10
- import { formatRelativeTime as j } from "../ui/lib/date-utils.js";
11
- import { tweens as E } from "../ui/lib/motion.js";
12
- import { m as R } from "../_chunks/framer.js";
13
- const L = {
9
+ import { getInitials as R } from "./lib/string-utils.js";
10
+ import { formatRelativeTime as L } from "../ui/lib/date-utils.js";
11
+ import { tweens as D } from "../ui/lib/motion.js";
12
+ import { m as T } from "../_chunks/framer.js";
13
+ const z = {
14
14
  default: "bg-surface-fg-subtle",
15
15
  success: "bg-success-9",
16
16
  warning: "bg-warning-9",
17
17
  error: "bg-error-9",
18
18
  info: "bg-info-9"
19
- }, z = {
19
+ }, B = {
20
20
  today: "Today",
21
21
  yesterday: "Yesterday",
22
22
  thisWeek: "This Week",
23
23
  older: "Older"
24
24
  };
25
- function B(e, s) {
26
- const o = { ...z, ...s }, d = /* @__PURE__ */ new Date(), c = new Date(d.getFullYear(), d.getMonth(), d.getDate()), n = new Date(c.getTime() - 24 * 60 * 60 * 1e3), l = d.getDay(), b = l === 0 ? 6 : l - 1, y = new Date(
27
- c.getTime() - b * 24 * 60 * 60 * 1e3
28
- ), f = [], m = [], u = [], p = [];
29
- for (const i of e) {
30
- const x = (typeof i.timestamp == "string" ? new Date(i.timestamp) : i.timestamp).getTime();
31
- x >= c.getTime() ? f.push(i) : x >= n.getTime() ? m.push(i) : x >= y.getTime() ? u.push(i) : p.push(i);
25
+ function G(e, a) {
26
+ const d = { ...B, ...a }, o = /* @__PURE__ */ new Date(), c = new Date(o.getFullYear(), o.getMonth(), o.getDate()), n = new Date(c.getTime() - 24 * 60 * 60 * 1e3), r = o.getDay(), y = r === 0 ? 6 : r - 1, b = new Date(
27
+ c.getTime() - y * 24 * 60 * 60 * 1e3
28
+ ), f = [], m = [], u = [], g = [];
29
+ for (const l of e) {
30
+ const x = (typeof l.timestamp == "string" ? new Date(l.timestamp) : l.timestamp).getTime();
31
+ x >= c.getTime() ? f.push(l) : x >= n.getTime() ? m.push(l) : x >= b.getTime() ? u.push(l) : g.push(l);
32
32
  }
33
33
  const h = [];
34
- return f.length > 0 && h.push({ label: o.today, items: f }), m.length > 0 && h.push({ label: o.yesterday, items: m }), u.length > 0 && h.push({ label: o.thisWeek, items: u }), p.length > 0 && h.push({ label: o.older, items: p }), h;
34
+ return f.length > 0 && h.push({ label: d.today, items: f }), m.length > 0 && h.push({ label: d.yesterday, items: m }), u.length > 0 && h.push({ label: d.thisWeek, items: u }), g.length > 0 && h.push({ label: d.older, items: g }), h;
35
35
  }
36
- function G({ compact: e }) {
37
- return /* @__PURE__ */ t("div", { className: r("flex flex-col", e ? "gap-1" : "gap-3"), children: [0, 1, 2].map((s) => /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-03", children: [
36
+ function I({ compact: e }) {
37
+ return /* @__PURE__ */ t("div", { className: i("flex flex-col", e ? "gap-1" : "gap-3"), children: [0, 1, 2].map((a) => /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-03", children: [
38
38
  /* @__PURE__ */ t(v, { className: "h-2 w-2 shrink-0 rounded-ds-full" }),
39
39
  !e && /* @__PURE__ */ t(v, { className: "h-4 w-4 shrink-0 rounded-ds-full" }),
40
- /* @__PURE__ */ t(v, { className: r("flex-1", e ? "h-3" : "h-4") }),
40
+ /* @__PURE__ */ t(v, { className: i("flex-1", e ? "h-3" : "h-4") }),
41
41
  /* @__PURE__ */ t(v, { className: "h-3 w-12" })
42
- ] }, s)) });
42
+ ] }, a)) });
43
43
  }
44
- function T({
44
+ function O({
45
45
  item: e,
46
- compact: s
46
+ compact: a
47
47
  }) {
48
- const [o, d] = N.useState(!1), c = e.color ?? "default", n = () => {
49
- e.detail && d((l) => !l);
48
+ const [d, o] = k.useState(!1), c = e.color ?? "default", n = () => {
49
+ e.detail && o((r) => !r);
50
50
  };
51
- return /* @__PURE__ */ a("div", { className: r("relative flex items-start", s ? "gap-ds-02" : "gap-ds-03"), children: [
51
+ return /* @__PURE__ */ s("div", { className: i("relative flex items-start", a ? "gap-ds-02" : "gap-ds-03"), children: [
52
52
  /* @__PURE__ */ t(
53
53
  "div",
54
54
  {
55
- className: r(
55
+ className: i(
56
56
  "relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-ds-full ring-2 ring-surface-1",
57
- L[c]
57
+ z[c]
58
58
  )
59
59
  }
60
60
  ),
61
- !s && e.actor && /* @__PURE__ */ a(O, { className: "h-5 w-5 shrink-0 text-[9px]", children: [
62
- e.actor.image && /* @__PURE__ */ t(C, { src: e.actor.image, alt: e.actor.name }),
63
- /* @__PURE__ */ t(F, { className: "text-[9px]", children: W(e.actor.name) })
61
+ !a && e.actor && /* @__PURE__ */ s(W, { className: "h-5 w-5 shrink-0 text-[9px]", children: [
62
+ e.actor.image && /* @__PURE__ */ t(j, { src: e.actor.image, alt: e.actor.name }),
63
+ /* @__PURE__ */ t(E, { className: "text-[9px]", children: R(e.actor.name) })
64
64
  ] }),
65
- /* @__PURE__ */ a("div", { className: "flex min-w-0 flex-1 flex-col", children: [
66
- /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-ds-02", children: [
67
- /* @__PURE__ */ a("div", { className: r("min-w-0 flex-1 flex items-center gap-ds-01 flex-wrap", s ? "text-ds-xs" : "text-ds-sm"), children: [
68
- e.actor && /* @__PURE__ */ a("span", { className: "font-medium text-surface-fg", children: [
65
+ /* @__PURE__ */ s("div", { className: "flex min-w-0 flex-1 flex-col", children: [
66
+ /* @__PURE__ */ s("div", { className: "flex items-center justify-between gap-ds-02", children: [
67
+ /* @__PURE__ */ s("div", { className: i("min-w-0 flex-1 flex items-center gap-ds-01 flex-wrap", a ? "text-ds-xs" : "text-ds-sm"), children: [
68
+ e.actor && /* @__PURE__ */ s("span", { className: "font-medium text-surface-fg", children: [
69
69
  e.actor.name,
70
70
  " "
71
71
  ] }),
72
- e.detail && /* @__PURE__ */ t(S, { className: r("h-3 w-3 shrink-0 text-surface-fg-subtle transition-transform", o && "rotate-90") }),
72
+ e.detail && /* @__PURE__ */ t(F, { className: i("h-3 w-3 shrink-0 text-surface-fg-subtle transition-transform duration-fast-02 ease-productive-standard", d && "rotate-90") }),
73
73
  /* @__PURE__ */ t(
74
74
  "span",
75
75
  {
76
- className: r(
76
+ className: i(
77
77
  "text-surface-fg-muted",
78
- e.detail && "cursor-pointer hover:underline"
78
+ e.detail && "cursor-pointer hover:underline hover:bg-surface-2 rounded-ds-md"
79
79
  ),
80
80
  onClick: n,
81
81
  role: e.detail ? "button" : void 0,
82
82
  tabIndex: e.detail ? 0 : void 0,
83
- onKeyDown: e.detail ? (l) => {
84
- (l.key === "Enter" || l.key === " ") && (l.preventDefault(), n());
83
+ onKeyDown: e.detail ? (r) => {
84
+ (r.key === "Enter" || r.key === " ") && (r.preventDefault(), n());
85
85
  } : void 0,
86
86
  children: e.action
87
87
  }
@@ -90,32 +90,32 @@ function T({
90
90
  /* @__PURE__ */ t(
91
91
  "time",
92
92
  {
93
- className: r(
93
+ className: i(
94
94
  "shrink-0 whitespace-nowrap text-surface-fg-subtle",
95
- s ? "text-ds-xs" : "text-ds-sm"
95
+ a ? "text-ds-xs" : "text-ds-sm"
96
96
  ),
97
97
  dateTime: (typeof e.timestamp == "string" ? new Date(e.timestamp) : e.timestamp).toISOString(),
98
- children: j(e.timestamp)
98
+ children: L(e.timestamp)
99
99
  }
100
100
  )
101
101
  ] }),
102
- o && e.detail && /* @__PURE__ */ t("div", { className: "mt-ds-02 animate-in fade-in slide-in-from-top-1 text-ds-sm text-surface-fg-muted", children: e.detail })
102
+ d && e.detail && /* @__PURE__ */ t("div", { className: "mt-ds-02 animate-in fade-in slide-in-from-top-1 text-ds-sm text-surface-fg-muted", children: e.detail })
103
103
  ] })
104
104
  ] });
105
105
  }
106
- function I({
106
+ function Y({
107
107
  label: e,
108
- isFirst: s
108
+ isFirst: a
109
109
  }) {
110
- return /* @__PURE__ */ a(
111
- R.div,
110
+ return /* @__PURE__ */ s(
111
+ T.div,
112
112
  {
113
113
  initial: { opacity: 0 },
114
114
  animate: { opacity: 1 },
115
- transition: E.fade,
116
- className: r(
115
+ transition: D.fade,
116
+ className: i(
117
117
  "flex items-center gap-ds-03",
118
- s ? "" : "mt-ds-06",
118
+ a ? "" : "mt-ds-06",
119
119
  "mb-ds-03"
120
120
  ),
121
121
  children: [
@@ -126,39 +126,39 @@ function I({
126
126
  }
127
127
  );
128
128
  }
129
- const Y = N.forwardRef(
129
+ const M = k.forwardRef(
130
130
  ({
131
131
  items: e,
132
- onLoadMore: s,
133
- loading: o = !1,
134
- hasMore: d = !1,
132
+ onLoadMore: a,
133
+ loading: d = !1,
134
+ hasMore: o = !1,
135
135
  emptyState: c,
136
136
  compact: n = !1,
137
- maxInitialItems: l,
138
- groupBy: b = "none",
139
- groupLabels: y,
137
+ maxInitialItems: r,
138
+ groupBy: y = "none",
139
+ groupLabels: b,
140
140
  className: f,
141
141
  ...m
142
142
  }, u) => {
143
- const [p, h] = N.useState(!1);
144
- if (o)
145
- return /* @__PURE__ */ t("div", { ref: u, className: r("relative", f), ...m, children: /* @__PURE__ */ t(G, { compact: n }) });
143
+ const [g, h] = k.useState(!1);
144
+ if (d)
145
+ return /* @__PURE__ */ t("div", { ref: u, className: i("relative", f), ...m, children: /* @__PURE__ */ t(I, { compact: n }) });
146
146
  if (e.length === 0)
147
147
  return c ? /* @__PURE__ */ t("div", { ref: u, className: f, ...m, children: c }) : null;
148
- const i = l != null && !p && e.length > l, w = i ? e.slice(0, l) : e, x = b === "time";
149
- return /* @__PURE__ */ a("div", { ref: u, className: r("relative", f), ...m, children: [
150
- x ? /* @__PURE__ */ t("div", { children: B(w, y).map((g, A) => /* @__PURE__ */ a("div", { children: [
151
- /* @__PURE__ */ t(I, { label: g.label, isFirst: A === 0 }),
152
- /* @__PURE__ */ a("div", { className: r("relative flex flex-col", n ? "gap-1" : "gap-3"), children: [
148
+ const l = r != null && !g && e.length > r, w = l ? e.slice(0, r) : e, x = y === "time";
149
+ return /* @__PURE__ */ s("div", { ref: u, className: i("relative", f), ...m, children: [
150
+ x ? /* @__PURE__ */ t("div", { children: G(w, b).map((p, N) => /* @__PURE__ */ s("div", { children: [
151
+ /* @__PURE__ */ t(Y, { label: p.label, isFirst: N === 0 }),
152
+ /* @__PURE__ */ s("div", { className: i("relative flex flex-col", n ? "gap-1" : "gap-3"), children: [
153
153
  /* @__PURE__ */ t("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }),
154
- g.items.map((k) => /* @__PURE__ */ t(T, { item: k, compact: n }, k.id))
154
+ p.items.map((A, C) => /* @__PURE__ */ t(T.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { ...D.fade, delay: C * 0.03 }, children: /* @__PURE__ */ t(O, { item: A, compact: n }) }, A.id))
155
155
  ] })
156
- ] }, g.label)) }) : /* @__PURE__ */ a("div", { className: r("relative flex flex-col", n ? "gap-1" : "gap-3"), children: [
156
+ ] }, p.label)) }) : /* @__PURE__ */ s("div", { className: i("relative flex flex-col", n ? "gap-1" : "gap-3"), children: [
157
157
  /* @__PURE__ */ t("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }),
158
- w.map((g) => /* @__PURE__ */ t(T, { item: g, compact: n }, g.id))
158
+ w.map((p, N) => /* @__PURE__ */ t(T.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { ...D.fade, delay: N * 0.03 }, children: /* @__PURE__ */ t(O, { item: p, compact: n }) }, p.id))
159
159
  ] }),
160
- i && /* @__PURE__ */ t("div", { className: "relative mt-ds-03 flex justify-center", children: /* @__PURE__ */ a(
161
- D,
160
+ l && /* @__PURE__ */ t("div", { className: "relative mt-ds-03 flex justify-center", children: /* @__PURE__ */ s(
161
+ S,
162
162
  {
163
163
  variant: "ghost",
164
164
  size: "sm",
@@ -170,12 +170,12 @@ const Y = N.forwardRef(
170
170
  ]
171
171
  }
172
172
  ) }),
173
- d && s && !i && /* @__PURE__ */ t("div", { className: "relative mt-ds-03 flex justify-center", children: /* @__PURE__ */ t(D, { variant: "ghost", size: "sm", onClick: s, children: "Load more" }) })
173
+ o && a && !l && /* @__PURE__ */ t("div", { className: "relative mt-ds-03 flex justify-center", children: /* @__PURE__ */ t(S, { variant: "ghost", size: "sm", onClick: a, children: "Load more" }) })
174
174
  ] });
175
175
  }
176
176
  );
177
- Y.displayName = "ActivityFeed";
177
+ M.displayName = "ActivityFeed";
178
178
  export {
179
- Y as ActivityFeed,
180
- B as groupItemsByTime
179
+ M as ActivityFeed,
180
+ G as groupItemsByTime
181
181
  };
@@ -20,9 +20,9 @@ export interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement>,
20
20
  onOverflowClick?: () => void;
21
21
  /** Custom render function for each avatar */
22
22
  renderAvatar?: (user: AvatarUser, index: number) => React.ReactNode;
23
- /** Direction the group expands on hover. 'right' (default) for left-aligned groups, 'left' for right-aligned groups. */
23
+ /** Direction avatars expand on hover. @default 'right' */
24
24
  expandDirection?: 'left' | 'right';
25
- /** How much the group spreads on hover. 'compact' = subtle peek, 'default' = full spread, 'wide' = extra room. */
25
+ /** How much avatars spread apart on hover. @default 'default' */
26
26
  expandAmount?: 'compact' | 'default' | 'wide';
27
27
  }
28
28
  declare const AvatarGroup: React.ForwardRefExoticComponent<AvatarGroupProps & React.RefAttributes<HTMLDivElement>>;
@@ -1 +1 @@
1
- {"version":3,"file":"avatar-group.d.ts","sourceRoot":"","sources":["../../src/composed/avatar-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAOjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAgB9C,QAAA,MAAM,kBAAkB;;8EAgBvB,CAAA;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,IAAI,CAAC,EAAE,UAAU,CAAA;CAClB;AAED,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,kBAAkB,CAAC;IACzC,KAAK,EAAE,UAAU,EAAE,CAAA;IACnB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,WAAW,GAAG,WAAW,CAAA;IACvC,uDAAuD;IACvD,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,6CAA6C;IAC7C,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAA;IACnE,wHAAwH;IACxH,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAClC,kHAAkH;IAClH,YAAY,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,MAAM,CAAA;CAC9C;AAED,QAAA,MAAM,WAAW,yFAsNhB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,CAAA"}
1
+ {"version":3,"file":"avatar-group.d.ts","sourceRoot":"","sources":["../../src/composed/avatar-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAOjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAS9C,QAAA,MAAM,kBAAkB;;8EAgBvB,CAAA;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,IAAI,CAAC,EAAE,UAAU,CAAA;CAClB;AAED,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,kBAAkB,CAAC;IACzC,KAAK,EAAE,UAAU,EAAE,CAAA;IACnB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,WAAW,GAAG,WAAW,CAAA;IACvC,uDAAuD;IACvD,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,6CAA6C;IAC7C,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAA;IACnE,0DAA0D;IAC1D,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAClC,iEAAiE;IACjE,YAAY,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,MAAM,CAAA;CAC9C;AAED,QAAA,MAAM,WAAW,yFAkLhB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,CAAA"}
@@ -1,17 +1,13 @@
1
1
  "use client";
2
- import { jsx as t, jsxs as s } from "react/jsx-runtime";
3
- import * as T from "react";
4
- import { ag as H } from "../_chunks/vendor-utils.js";
5
- import { cn as o } from "../ui/lib/utils.js";
6
- import { Avatar as O, AvatarImage as B, AvatarFallback as L } from "../ui/avatar.js";
7
- import { TooltipProvider as q, Tooltip as p, TooltipTrigger as u, TooltipContent as x } from "../ui/tooltip.js";
8
- import { getInitials as D } from "./lib/string-utils.js";
9
- const M = {
10
- lead: "ring-2 ring-accent-7 ring-offset-1 ring-offset-surface-2",
11
- admin: "ring-2 ring-warning-7 ring-offset-1 ring-offset-surface-2",
12
- client: "ring-2 ring-info-7 ring-offset-1 ring-offset-surface-2"
13
- }, g = H(
14
- "shrink-0 rounded-ds-full border-2",
2
+ import { jsx as r, jsxs as o } from "react/jsx-runtime";
3
+ import * as b from "react";
4
+ import { ag as $ } from "../_chunks/vendor-utils.js";
5
+ import { cn as n } from "../ui/lib/utils.js";
6
+ import { Avatar as E, AvatarImage as F, AvatarFallback as G } from "../ui/avatar.js";
7
+ import { TooltipProvider as H, Tooltip as y, TooltipTrigger as N, TooltipContent as w } from "../ui/tooltip.js";
8
+ import { getInitials as R } from "./lib/string-utils.js";
9
+ const p = $(
10
+ "shrink-0 overflow-hidden rounded-ds-full border-2",
15
11
  {
16
12
  variants: {
17
13
  size: {
@@ -19,184 +15,158 @@ const M = {
19
15
  sm: "h-ds-xs w-ds-xs text-ds-xs",
20
16
  md: "h-ds-sm w-ds-sm text-ds-sm",
21
17
  lg: "h-ds-md w-ds-md text-ds-md",
22
- xl: "h-ds-lg w-ds-lg text-ds-md"
18
+ xl: "h-ds-lg w-ds-lg text-ds-lg"
23
19
  }
24
20
  },
25
21
  defaultVariants: {
26
22
  size: "md"
27
23
  }
28
24
  }
29
- ), J = T.forwardRef(
25
+ ), B = b.forwardRef(
30
26
  ({
31
27
  users: l,
32
- max: h = 4,
33
- size: n,
34
- showTooltip: b = !0,
35
- borderColor: z = "surface-2",
36
- onOverflowClick: v,
37
- renderAvatar: y,
38
- expandDirection: j = "right",
39
- expandAmount: A = "default",
40
- className: S,
41
- ...k
42
- }, P) => {
43
- const [R, i] = T.useState(!1), a = l.slice(0, h), c = l.length - h, V = {
28
+ max: g = 4,
29
+ size: s,
30
+ showTooltip: I = !0,
31
+ borderColor: T = "surface-2",
32
+ onOverflowClick: h,
33
+ renderAvatar: u,
34
+ expandDirection: M = "right",
35
+ expandAmount: C = "default",
36
+ className: z,
37
+ ...S
38
+ }, j) => {
39
+ const a = l.slice(0, g), c = l.length - g, d = {
44
40
  xs: "-ml-ds-02",
45
41
  sm: "-ml-ds-02b",
46
42
  md: "-ml-ds-03",
47
43
  lg: "-ml-ds-04",
48
44
  xl: "-ml-ds-05"
49
- }, X = {
45
+ }[s ?? "md"], i = T === "surface-1" ? "border-surface-1" : "border-surface-2", [A, m] = b.useState(!1), P = {
50
46
  xs: 8,
51
47
  sm: 10,
52
48
  md: 12,
53
49
  lg: 16,
54
50
  xl: 20
55
- }, N = n ?? "md", d = V[N], $ = X[N], f = z === "surface-1" ? "border-surface-1" : "border-surface-2", E = { compact: 0.5, default: 1, wide: 1.5 }[A], F = a.length + (c > 0 ? 1 : 0);
56
- function m(e) {
57
- if (!R) return "translateX(0)";
58
- const r = $ * E;
59
- return j === "left" ? `translateX(-${(F - 1 - e) * r}px)` : `translateX(${e * r}px)`;
51
+ }[s ?? "md"], k = { compact: 0.5, default: 1, wide: 1.5 }[C], V = a.length + (c > 0 ? 1 : 0);
52
+ function f(e) {
53
+ if (!A) return "translateX(0)";
54
+ const t = P * k;
55
+ return M === "left" ? `translateX(-${(V - 1 - e) * t}px)` : `translateX(${e * t}px)`;
60
56
  }
61
- const I = "transition-[transform,opacity] duration-300 ease-out hover:z-50 hover:scale-105 group-hover:[&:not(:hover)]:opacity-85";
62
- return /* @__PURE__ */ t(q, { children: /* @__PURE__ */ s(
57
+ const x = "transition-[transform,opacity] duration-300 ease-out hover:z-50 hover:scale-105 group-hover:[&:not(:hover)]:opacity-85";
58
+ return /* @__PURE__ */ r(H, { children: /* @__PURE__ */ o(
63
59
  "div",
64
60
  {
65
- ref: P,
61
+ ref: j,
66
62
  role: "group",
67
63
  "aria-label": `${l.length} team members`,
68
64
  tabIndex: 0,
69
- className: o("group flex items-center", S),
70
- onMouseEnter: () => i(!0),
71
- onMouseLeave: () => i(!1),
72
- onFocus: () => i(!0),
65
+ className: n("group flex items-center", z),
66
+ onMouseEnter: () => m(!0),
67
+ onMouseLeave: () => m(!1),
68
+ onFocus: () => m(!0),
73
69
  onBlur: (e) => {
74
- e.currentTarget.contains(e.relatedTarget) || i(!1);
70
+ e.currentTarget.contains(e.relatedTarget) || m(!1);
75
71
  },
76
- ...k,
72
+ ...S,
77
73
  children: [
78
- a.map((e, r) => {
79
- const G = D(e.name);
80
- if (y) {
81
- const C = /* @__PURE__ */ t(
74
+ a.map((e, t) => {
75
+ const X = R(e.name);
76
+ if (u)
77
+ return /* @__PURE__ */ r(
82
78
  "div",
83
79
  {
84
- className: o(
85
- g({ size: n }),
86
- f,
87
- r > 0 && d,
88
- I,
89
- e.ring && e.ring !== "none" && M[e.ring]
80
+ className: n(
81
+ p({ size: s }),
82
+ i,
83
+ t > 0 && d,
84
+ x
90
85
  ),
91
- style: {
92
- zIndex: a.length - r,
93
- transform: m(r)
94
- },
95
- children: y(e, r)
86
+ style: { zIndex: a.length - t, transform: f(t) },
87
+ children: u(e, t)
96
88
  },
97
89
  e.name
98
90
  );
99
- return b ? /* @__PURE__ */ s(p, { children: [
100
- /* @__PURE__ */ t(u, { asChild: !0, children: C }),
101
- /* @__PURE__ */ t(
102
- x,
103
- {
104
- className: "border-surface-border-strong bg-surface-1 text-surface-fg",
105
- sideOffset: 6,
106
- children: /* @__PURE__ */ t("p", { className: "text-ds-sm", children: e.name })
107
- }
108
- )
109
- ] }, e.name) : C;
110
- }
111
- const w = /* @__PURE__ */ s(
112
- O,
91
+ const v = /* @__PURE__ */ o(
92
+ E,
113
93
  {
114
- className: o(
115
- g({ size: n }),
116
- f,
117
- r > 0 && d,
118
- I,
119
- e.ring && e.ring !== "none" && M[e.ring]
94
+ ring: e.ring,
95
+ className: n(
96
+ p({ size: s }),
97
+ i,
98
+ t > 0 && d,
99
+ x
120
100
  ),
121
- style: {
122
- zIndex: a.length - r,
123
- transform: m(r)
124
- },
101
+ style: { zIndex: a.length - t, transform: f(t) },
125
102
  children: [
126
- e.image && /* @__PURE__ */ t(B, { src: e.image, alt: e.name }),
127
- /* @__PURE__ */ t(
128
- L,
103
+ e.image && /* @__PURE__ */ r(F, { src: e.image, alt: e.name }),
104
+ /* @__PURE__ */ r(
105
+ G,
129
106
  {
130
107
  className: "font-body font-semibold",
131
108
  colorSeed: e.name,
132
- children: G
109
+ children: X
133
110
  }
134
111
  )
135
112
  ]
136
113
  },
137
114
  e.name
138
115
  );
139
- return b ? /* @__PURE__ */ s(p, { children: [
140
- /* @__PURE__ */ t(u, { asChild: !0, children: w }),
141
- /* @__PURE__ */ t(
142
- x,
116
+ return I ? /* @__PURE__ */ o(y, { children: [
117
+ /* @__PURE__ */ r(N, { asChild: !0, children: v }),
118
+ /* @__PURE__ */ r(
119
+ w,
143
120
  {
144
121
  className: "border-surface-border-strong bg-surface-1 text-surface-fg",
145
122
  sideOffset: 6,
146
- children: /* @__PURE__ */ t("p", { className: "text-ds-sm", children: e.name })
123
+ children: /* @__PURE__ */ r("p", { className: "text-ds-sm", children: e.name })
147
124
  }
148
125
  )
149
- ] }, e.name) : w;
126
+ ] }, e.name) : v;
150
127
  }),
151
- c > 0 && /* @__PURE__ */ s(p, { children: [
152
- /* @__PURE__ */ t(u, { asChild: !0, children: v ? /* @__PURE__ */ s(
128
+ c > 0 && /* @__PURE__ */ o(y, { children: [
129
+ /* @__PURE__ */ r(N, { asChild: !0, children: h ? /* @__PURE__ */ o(
153
130
  "button",
154
131
  {
155
132
  type: "button",
156
- onClick: v,
157
- className: o(
158
- g({ size: n }),
159
- f,
133
+ onClick: h,
134
+ className: n(
135
+ p({ size: s }),
136
+ i,
160
137
  d,
161
138
  "flex cursor-pointer items-center justify-center bg-accent-2 font-body font-semibold text-accent-11",
162
- "transition-[transform,background-color] duration-300 ease-out",
163
- "hover:scale-105 hover:bg-accent-3"
139
+ "hover:scale-105 hover:bg-accent-3 transition-[transform,background-color] duration-300 ease-out"
164
140
  ),
165
- style: {
166
- zIndex: 0,
167
- transform: m(a.length)
168
- },
141
+ style: { zIndex: 0, transform: f(a.length) },
169
142
  children: [
170
143
  "+",
171
144
  c
172
145
  ]
173
146
  }
174
- ) : /* @__PURE__ */ s(
147
+ ) : /* @__PURE__ */ o(
175
148
  "div",
176
149
  {
177
- className: o(
178
- g({ size: n }),
179
- f,
150
+ className: n(
151
+ p({ size: s }),
152
+ i,
180
153
  d,
181
154
  "flex cursor-default items-center justify-center bg-accent-2 font-body font-semibold text-accent-11",
182
- "transition-[transform] duration-300 ease-out"
155
+ "transition-[transform,opacity] duration-300 ease-out"
183
156
  ),
184
- style: {
185
- zIndex: 0,
186
- transform: m(a.length)
187
- },
157
+ style: { zIndex: 0, transform: f(a.length) },
188
158
  children: [
189
159
  "+",
190
160
  c
191
161
  ]
192
162
  }
193
163
  ) }),
194
- /* @__PURE__ */ t(
195
- x,
164
+ /* @__PURE__ */ r(
165
+ w,
196
166
  {
197
167
  className: "border-surface-border-strong bg-surface-1 text-surface-fg",
198
168
  sideOffset: 6,
199
- children: /* @__PURE__ */ t("div", { className: "flex flex-col gap-ds-01", children: l.slice(h).map((e, r) => /* @__PURE__ */ t("p", { className: "text-ds-sm", children: e.name }, r)) })
169
+ children: /* @__PURE__ */ r("div", { className: "flex flex-col gap-ds-01", children: l.slice(g).map((e, t) => /* @__PURE__ */ r("p", { className: "text-ds-sm", children: e.name }, t)) })
200
170
  }
201
171
  )
202
172
  ] })
@@ -205,7 +175,7 @@ const M = {
205
175
  ) });
206
176
  }
207
177
  );
208
- J.displayName = "AvatarGroup";
178
+ B.displayName = "AvatarGroup";
209
179
  export {
210
- J as AvatarGroup
180
+ B as AvatarGroup
211
181
  };