@versaur/react 1.0.13 → 1.0.15

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.
@@ -0,0 +1,159 @@
1
+ import { jsx as l, jsxs as N } from "react/jsx-runtime";
2
+ import { iconStyles as C, buttonIconStyles as j, filterChipStyles as A } from "@versaur/core/primitive";
3
+ import { LoaderIcon as F, XIcon as _ } from "@versaur/icons";
4
+ import B, { forwardRef as T } from "react";
5
+ import { c as w } from "./cx-B9vmfsc1.js";
6
+ function E(n) {
7
+ return n.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
8
+ }
9
+ function I(n) {
10
+ const t = {};
11
+ for (const [o, e] of Object.entries(n)) {
12
+ if (e == null)
13
+ continue;
14
+ const r = E(o);
15
+ typeof e == "boolean" ? e && (t[`data-${r}`] = (!!e).toString()) : (typeof e == "string" || typeof e == "number") && (t[`data-${r}`] = String(e));
16
+ }
17
+ return t;
18
+ }
19
+ const y = B.forwardRef(function({ intent: t = "inherit", size: o = "inherit", as: e, className: r, ...c }, s) {
20
+ const a = I({ intent: t, size: o });
21
+ return /* @__PURE__ */ l(e, { ref: s, className: w(C.icon, r), ...a, ...c });
22
+ });
23
+ y.displayName = "Icon";
24
+ const $ = T(
25
+ ({
26
+ as: n,
27
+ variant: t = "primary",
28
+ size: o = "medium",
29
+ loading: e = !1,
30
+ disabled: r = !1,
31
+ pressed: c = !1,
32
+ type: s = "button",
33
+ onClick: a,
34
+ iconProps: f = {},
35
+ "aria-label": m,
36
+ className: b,
37
+ ...p
38
+ }, v) => {
39
+ const u = I({
40
+ disabled: r || e,
41
+ loading: e,
42
+ size: o,
43
+ variant: t
44
+ }), d = (h) => {
45
+ if (r || e) {
46
+ h.preventDefault();
47
+ return;
48
+ }
49
+ a == null || a(h);
50
+ };
51
+ return /* @__PURE__ */ l(
52
+ "button",
53
+ {
54
+ ref: v,
55
+ type: s,
56
+ className: w(j["button-icon"], b),
57
+ "aria-label": m,
58
+ "aria-pressed": c ? "true" : void 0,
59
+ "aria-busy": e ? "true" : void 0,
60
+ "aria-disabled": r || e ? "true" : void 0,
61
+ ...u,
62
+ ...p,
63
+ onClick: d,
64
+ children: e ? /* @__PURE__ */ l(y, { as: F, "aria-label": "Loading", "data-loading-icon": "loader" }) : /* @__PURE__ */ l(y, { as: n, ...f })
65
+ }
66
+ );
67
+ }
68
+ );
69
+ $.displayName = "ButtonIcon";
70
+ const g = T(
71
+ ({ disabled: n = !1, onClick: t, maxWidth: o, className: e, children: r, style: c, ...s }, a) => {
72
+ const f = I({ disabled: n }), m = (b) => {
73
+ if (n) {
74
+ b.preventDefault();
75
+ return;
76
+ }
77
+ t == null || t(b);
78
+ };
79
+ return /* @__PURE__ */ N(
80
+ "button",
81
+ {
82
+ ref: a,
83
+ type: "button",
84
+ className: w(A.chip, e),
85
+ style: o ? { "--_max-width": o, ...c } : c,
86
+ "aria-disabled": n ? "true" : void 0,
87
+ onClick: m,
88
+ ...f,
89
+ ...s,
90
+ children: [
91
+ /* @__PURE__ */ l("span", { className: A.label, children: r }),
92
+ /* @__PURE__ */ l(y, { as: _ })
93
+ ]
94
+ }
95
+ );
96
+ }
97
+ );
98
+ g.displayName = "FilterChip";
99
+ const x = 100, i = 16;
100
+ function q(n, t) {
101
+ let o = n.parentElement;
102
+ for (; o; ) {
103
+ const e = o.querySelector(`[data-tooltip-trigger="${t}"]`);
104
+ if (e) return e;
105
+ if (o === document.body) break;
106
+ o = o.parentElement;
107
+ }
108
+ return null;
109
+ }
110
+ function G(n, t, o = x, e) {
111
+ const r = window.innerWidth, c = window.innerHeight, s = {
112
+ top: n.top,
113
+ bottom: c - n.bottom,
114
+ left: n.left,
115
+ right: r - n.right
116
+ };
117
+ if (t) {
118
+ const a = n.left + n.width / 2, f = n.top + n.height / 2, m = [
119
+ // Bottom: check if tooltip fits below trigger
120
+ [
121
+ "bottom",
122
+ s.bottom,
123
+ n.bottom + t.height + i <= c && a - t.width / 2 >= i && a + t.width / 2 <= r - i
124
+ ],
125
+ // Top: check if tooltip fits above trigger
126
+ [
127
+ "top",
128
+ s.top,
129
+ n.top - t.height - i >= 0 && a - t.width / 2 >= i && a + t.width / 2 <= r - i
130
+ ],
131
+ // Right: check if tooltip fits to the right of trigger
132
+ [
133
+ "right",
134
+ s.right,
135
+ n.right + t.width + i <= r && f - t.height / 2 >= i && f + t.height / 2 <= c - i
136
+ ],
137
+ // Left: check if tooltip fits to the left of trigger
138
+ [
139
+ "left",
140
+ s.left,
141
+ n.left - t.width - i >= 0 && f - t.height / 2 >= i && f + t.height / 2 <= c - i
142
+ ]
143
+ ], p = (e ? m.filter(([u]) => e.includes(u)) : m).filter(([u, d, h]) => h);
144
+ return p.length > 0 ? p.find(([d]) => d === "bottom") ? "bottom" : p.reduce((d, h) => h[1] > d[1] ? h : d)[0] : (e ? Object.entries(s).filter(
145
+ ([u]) => e.includes(u)
146
+ ) : Object.entries(s)).reduce((u, d) => d[1] > u[1] ? d : u)[0];
147
+ }
148
+ return s.bottom >= o ? "bottom" : Object.entries(s).reduce(
149
+ (a, f) => f[1] > a[1] ? f : a
150
+ )[0];
151
+ }
152
+ export {
153
+ $ as B,
154
+ g as F,
155
+ y as I,
156
+ G as c,
157
+ q as f,
158
+ I as u
159
+ };
@@ -17,8 +17,8 @@ const c = t(
17
17
  );
18
18
  c.displayName = "OverlayFooter";
19
19
  export {
20
- v as O,
20
+ i as O,
21
21
  c as a,
22
- d as b,
23
- i as c
22
+ v as b,
23
+ d as c
24
24
  };
@@ -310,6 +310,17 @@ export { DotSize }
310
310
 
311
311
  export { DotVariant }
312
312
 
313
+ export declare const FilterChip: ForwardRefExoticComponent<FilterChipProps & RefAttributes<HTMLButtonElement>>;
314
+
315
+ export declare interface FilterChipProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "disabled"> {
316
+ /** Whether the chip is disabled — prevents click and applies visual muted state */
317
+ disabled?: boolean;
318
+ /** Max width for label truncation (CSS length value, e.g. "12rem", "200px") */
319
+ maxWidth?: string;
320
+ /** Chip label content */
321
+ children: ReactNode;
322
+ }
323
+
313
324
  export declare const Heading: ForwardRefExoticComponent<HeadingProps & RefAttributes<HTMLHeadingElement>>;
314
325
 
315
326
  export { HeadingAs }
@@ -332,6 +343,7 @@ export declare interface HeadingProps extends HTMLAttributes<HTMLHeadingElement>
332
343
  weight?: Heading_2.Weight;
333
344
  /**
334
345
  * Text color intent
346
+ * @default 'default'
335
347
  */
336
348
  intent?: Heading_2.Intent;
337
349
  /**
@@ -498,6 +510,7 @@ export declare interface TextProps extends HTMLAttributes<HTMLElement> {
498
510
  weight?: Text_3.Weight;
499
511
  /**
500
512
  * Text color intent
513
+ * @default 'default'
501
514
  */
502
515
  intent?: Text_3.Intent;
503
516
  /**
package/dist/primitive.js CHANGED
@@ -1,207 +1,18 @@
1
- import { jsxs as x, jsx as c } from "react/jsx-runtime";
2
- import { buttonStyles as k, headingStyles as R, textStyles as w, avatarStyles as S, loaderStyles as K, badgeStyles as z, bannerStyles as A, dotStyles as C, kbdStyles as O } from "@versaur/core/primitive";
3
- import { LoaderIcon as T, UserIcon as U, XIcon as X } from "@versaur/icons";
4
- import { forwardRef as u, useState as q } from "react";
5
- import { u as b } from "./use-data-attrs-iPFyfiKN.js";
6
- import { c as p } from "./cx-B9vmfsc1.js";
7
- import { I as B, B as F } from "./tooltip-_eEMRSo8.js";
8
- import { H as nt, T as lt } from "./tooltip-_eEMRSo8.js";
9
- const G = u(
10
- ({
11
- variant: a = "primary",
12
- size: r = "medium",
13
- loading: t = !1,
14
- disabled: e = !1,
15
- pressed: o = !1,
16
- leftIcon: s,
17
- rightIcon: n,
18
- children: l,
19
- type: d = "button",
20
- onClick: y,
21
- className: h,
22
- ...m
23
- }, N) => {
24
- const g = !!s, i = !!n, v = !!l;
25
- let f;
26
- g && i && v ? f = "both-text" : g && v ? f = "left-text" : i && v ? f = "right-text" : g && i ? f = "both" : g ? f = "left" : i && (f = "right");
27
- const H = b({
28
- disabled: e || t,
29
- loading: t,
30
- size: r,
31
- variant: a,
32
- ...f && { iconConfig: f }
33
- }), j = (I) => {
34
- if (e || t) {
35
- I.preventDefault();
36
- return;
37
- }
38
- y == null || y(I);
39
- };
40
- return /* @__PURE__ */ x(
41
- "button",
42
- {
43
- ref: N,
44
- type: d,
45
- className: p(k.button, h),
46
- "aria-pressed": o ? "true" : void 0,
47
- "aria-busy": t ? "true" : void 0,
48
- "aria-disabled": e || t ? "true" : void 0,
49
- ...H,
50
- ...m,
51
- onClick: j,
52
- children: [
53
- t ? /* @__PURE__ */ c(B, { as: T, "aria-label": "Loading", "data-loading-icon": "loader" }) : null,
54
- s,
55
- l,
56
- n
57
- ]
58
- }
59
- );
60
- }
61
- );
62
- G.displayName = "Button";
63
- const J = u(
64
- ({ as: a = "h2", size: r, weight: t, intent: e, case: o, transform: s, children: n, className: l, ...d }, y) => {
65
- const h = a, m = b({
66
- as: a,
67
- case: o,
68
- intent: e,
69
- size: r,
70
- transform: s,
71
- weight: t
72
- });
73
- return /* @__PURE__ */ c(h, { ref: y, className: p(R.heading, l), ...m, ...d, children: n });
74
- }
75
- );
76
- J.displayName = "Heading";
77
- const M = u(
78
- ({ as: a = "p", size: r, weight: t, intent: e, case: o, transform: s, children: n, className: l, ...d }, y) => {
79
- const h = a, m = b({
80
- as: a,
81
- case: o,
82
- intent: e,
83
- size: r,
84
- transform: s,
85
- weight: t
86
- });
87
- return /* @__PURE__ */ c(h, { ref: y, className: p(w.text, l), ...m, ...d, children: n });
88
- }
89
- );
90
- M.displayName = "Text";
91
- const L = u(
92
- ({ variant: a = "primary", size: r = "md", shape: t = "circle", children: e, className: o, ...s }, n) => {
93
- const l = b({ shape: t, size: r, variant: a }), d = e || /* @__PURE__ */ c(B, { as: U });
94
- return /* @__PURE__ */ c("span", { ref: n, className: p(S.avatar, o), role: "img", ...l, ...s, children: d });
95
- }
96
- );
97
- L.displayName = "Avatar";
98
- const D = u(({ src: a, alt: r, onError: t, className: e, ...o }, s) => {
99
- const [n, l] = q(!1);
100
- return n ? null : /* @__PURE__ */ c(
101
- "img",
102
- {
103
- ref: s,
104
- className: p(S["avatar-image"], e),
105
- src: a,
106
- alt: r,
107
- onError: (d) => {
108
- l(!0), t == null || t(d);
109
- },
110
- ...o
111
- }
112
- );
113
- });
114
- D.displayName = "Avatar.Image";
115
- const st = Object.assign(L, {
116
- Image: D
117
- }), P = u(
118
- ({ type: a = "spinner", size: r = "sm", children: t, className: e, ...o }, s) => {
119
- const n = b({
120
- size: r,
121
- type: a
122
- });
123
- return /* @__PURE__ */ x("div", { ref: s, className: p(K.loader, e), ...n, ...o, children: [
124
- a === "spinner" && /* @__PURE__ */ c(B, { as: T, "aria-hidden": "true" }),
125
- t
126
- ] });
127
- }
128
- );
129
- P.displayName = "Loader";
130
- const Q = u(
131
- ({
132
- variant: a = "primary",
133
- size: r = "medium",
134
- shape: t = "rounded",
135
- iconLeft: e,
136
- iconRight: o,
137
- maxWidth: s,
138
- children: n,
139
- style: l,
140
- className: d,
141
- ...y
142
- }, h) => {
143
- const m = !!e, N = !!o, g = !!n;
144
- let i;
145
- m && N && g ? i = "both-text" : m && g ? i = "left-text" : N && g ? i = "right-text" : m && N ? i = "both" : m ? i = "left" : N && (i = "right");
146
- const v = b({
147
- shape: t,
148
- size: r,
149
- variant: a,
150
- ...i && { iconConfig: i }
151
- }), f = {
152
- ...l,
153
- ...s && { "--vers-comp-badge-max-width": s }
154
- };
155
- return /* @__PURE__ */ x("div", { ref: h, className: p(z.badge, d), ...v, ...y, style: f, children: [
156
- e,
157
- n,
158
- o
159
- ] });
160
- }
161
- );
162
- Q.displayName = "Badge";
163
- const V = u(
164
- ({ variant: a = "info", icon: r, onDismiss: t, children: e, className: o, ...s }, n) => {
165
- const l = b({
166
- variant: a
167
- });
168
- return /* @__PURE__ */ x("div", { ref: n, className: p(A.banner, o), ...l, ...s, children: [
169
- r && /* @__PURE__ */ c("div", { className: A.icon, children: r }),
170
- /* @__PURE__ */ c("div", { className: A.content, children: e }),
171
- t && /* @__PURE__ */ c(F, { as: X, variant: "ghost", size: "small", onClick: t, "aria-label": "Dismiss banner" })
172
- ] });
173
- }
174
- );
175
- V.displayName = "Banner";
176
- const Y = u(
177
- ({ variant: a = "primary", size: r = "medium", className: t, ...e }, o) => {
178
- const s = b({
179
- size: r,
180
- variant: a
181
- });
182
- return /* @__PURE__ */ c("span", { ref: o, className: p(C.dot, t), ...s, ...e });
183
- }
184
- );
185
- Y.displayName = "Dot";
186
- const Z = u(
187
- ({ variant: a = "filled", size: r = "md", children: t, className: e, ...o }, s) => {
188
- const n = b({ size: r, variant: a });
189
- return /* @__PURE__ */ c("kbd", { ref: s, className: p(O.kbd, e), ...n, ...o, children: t });
190
- }
191
- );
192
- Z.displayName = "Kbd";
1
+ import { A as o, B as t, a as r, b as e, D as n, H as B, c as d, K as i, L as p, T as c, d as x } from "./tooltip-Cn7Ml9vw.js";
2
+ import { B as I, F as T, I as b } from "./helpers-D23F5WBX.js";
193
3
  export {
194
- st as Avatar,
195
- Q as Badge,
196
- V as Banner,
197
- G as Button,
198
- F as ButtonIcon,
199
- Y as Dot,
200
- J as Heading,
201
- nt as Hr,
202
- B as Icon,
203
- Z as Kbd,
204
- P as Loader,
205
- M as Text,
206
- lt as Tooltip
4
+ o as Avatar,
5
+ t as Badge,
6
+ r as Banner,
7
+ e as Button,
8
+ I as ButtonIcon,
9
+ n as Dot,
10
+ T as FilterChip,
11
+ B as Heading,
12
+ d as Hr,
13
+ b as Icon,
14
+ i as Kbd,
15
+ p as Loader,
16
+ c as Text,
17
+ x as Tooltip
207
18
  };