@easyv/theme-variables-react 0.1.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.
- package/dist/index.cjs +460 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +127 -0
- package/dist/index.d.ts +127 -0
- package/dist/index.js +410 -0
- package/dist/index.js.map +1 -0
- package/package.json +54 -0
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,460 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// src/index.ts
|
|
31
|
+
var index_exports = {};
|
|
32
|
+
__export(index_exports, {
|
|
33
|
+
Button: () => Button,
|
|
34
|
+
Dropdown: () => Dropdown,
|
|
35
|
+
DropdownCheckboxItem: () => DropdownCheckboxItem,
|
|
36
|
+
DropdownItem: () => DropdownItem,
|
|
37
|
+
DropdownLabel: () => DropdownLabel,
|
|
38
|
+
DropdownSeparator: () => DropdownSeparator,
|
|
39
|
+
Input: () => Input,
|
|
40
|
+
Menu: () => Menu,
|
|
41
|
+
MenuItem: () => MenuItem,
|
|
42
|
+
MenuLabel: () => MenuLabel,
|
|
43
|
+
MenuSeparator: () => MenuSeparator,
|
|
44
|
+
Select: () => Select,
|
|
45
|
+
Tooltip: () => Tooltip,
|
|
46
|
+
UiTheme: () => UiTheme
|
|
47
|
+
});
|
|
48
|
+
module.exports = __toCommonJS(index_exports);
|
|
49
|
+
|
|
50
|
+
// src/components/button/button.tsx
|
|
51
|
+
var import_react = require("react");
|
|
52
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
53
|
+
var Button = (0, import_react.forwardRef)(
|
|
54
|
+
function Button2({
|
|
55
|
+
className,
|
|
56
|
+
children,
|
|
57
|
+
disabled,
|
|
58
|
+
loading = false,
|
|
59
|
+
size = "sm",
|
|
60
|
+
tone = "neutral",
|
|
61
|
+
type = "button",
|
|
62
|
+
variant = "primary",
|
|
63
|
+
...props
|
|
64
|
+
}, ref) {
|
|
65
|
+
const classes = ["ui-button", className].filter(Boolean).join(" ");
|
|
66
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
67
|
+
"button",
|
|
68
|
+
{
|
|
69
|
+
...props,
|
|
70
|
+
ref,
|
|
71
|
+
type,
|
|
72
|
+
className: classes,
|
|
73
|
+
disabled: disabled || loading,
|
|
74
|
+
"aria-busy": loading || void 0,
|
|
75
|
+
"data-slot": "root",
|
|
76
|
+
"data-variant": variant,
|
|
77
|
+
"data-size": size,
|
|
78
|
+
"data-tone": tone,
|
|
79
|
+
"data-loading": loading ? "" : void 0,
|
|
80
|
+
children: [
|
|
81
|
+
loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "ui-button__spinner", "data-slot": "spinner", "aria-hidden": "true" }) : null,
|
|
82
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "ui-button__label", "data-slot": "label", children })
|
|
83
|
+
]
|
|
84
|
+
}
|
|
85
|
+
);
|
|
86
|
+
}
|
|
87
|
+
);
|
|
88
|
+
|
|
89
|
+
// src/components/dropdown/dropdown.tsx
|
|
90
|
+
var DropdownPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
|
|
91
|
+
var import_react3 = require("react");
|
|
92
|
+
|
|
93
|
+
// src/theme/ui-theme.tsx
|
|
94
|
+
var import_react2 = require("react");
|
|
95
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
96
|
+
var UiThemeContext = (0, import_react2.createContext)(void 0);
|
|
97
|
+
function useUiThemeName() {
|
|
98
|
+
return (0, import_react2.useContext)(UiThemeContext);
|
|
99
|
+
}
|
|
100
|
+
var UiTheme = (0, import_react2.forwardRef)(
|
|
101
|
+
function UiTheme2({ className, name, ...props }, ref) {
|
|
102
|
+
const classes = ["ui-theme", className].filter(Boolean).join(" ");
|
|
103
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(UiThemeContext.Provider, { value: name, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
104
|
+
"div",
|
|
105
|
+
{
|
|
106
|
+
...props,
|
|
107
|
+
ref,
|
|
108
|
+
className: classes,
|
|
109
|
+
"data-ui-theme": name,
|
|
110
|
+
"data-slot": "theme-root"
|
|
111
|
+
}
|
|
112
|
+
) });
|
|
113
|
+
}
|
|
114
|
+
);
|
|
115
|
+
|
|
116
|
+
// src/components/dropdown/dropdown.tsx
|
|
117
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
118
|
+
function Dropdown({
|
|
119
|
+
align = "start",
|
|
120
|
+
children,
|
|
121
|
+
contentClassName,
|
|
122
|
+
defaultOpen,
|
|
123
|
+
modal = true,
|
|
124
|
+
onOpenChange,
|
|
125
|
+
open,
|
|
126
|
+
side = "bottom",
|
|
127
|
+
sideOffset = 8,
|
|
128
|
+
trigger
|
|
129
|
+
}) {
|
|
130
|
+
const themeName = useUiThemeName();
|
|
131
|
+
const rootProps = {
|
|
132
|
+
modal,
|
|
133
|
+
...open === void 0 ? {} : { open },
|
|
134
|
+
...defaultOpen === void 0 ? {} : { defaultOpen },
|
|
135
|
+
...onOpenChange === void 0 ? {} : { onOpenChange }
|
|
136
|
+
};
|
|
137
|
+
const classes = ["ui-dropdown", contentClassName].filter(Boolean).join(" ");
|
|
138
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(DropdownPrimitive.Root, { ...rootProps, children: [
|
|
139
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DropdownPrimitive.Trigger, { asChild: true, children: trigger }),
|
|
140
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DropdownPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
141
|
+
DropdownPrimitive.Content,
|
|
142
|
+
{
|
|
143
|
+
className: classes,
|
|
144
|
+
"data-slot": "content",
|
|
145
|
+
"data-ui-theme": themeName,
|
|
146
|
+
side,
|
|
147
|
+
align,
|
|
148
|
+
sideOffset,
|
|
149
|
+
collisionPadding: 8,
|
|
150
|
+
children: [
|
|
151
|
+
children,
|
|
152
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DropdownPrimitive.Arrow, { className: "ui-dropdown__arrow", "data-slot": "arrow" })
|
|
153
|
+
]
|
|
154
|
+
}
|
|
155
|
+
) })
|
|
156
|
+
] });
|
|
157
|
+
}
|
|
158
|
+
var DropdownItem = (0, import_react3.forwardRef)(
|
|
159
|
+
function DropdownItem2({ className, tone = "neutral", ...props }, ref) {
|
|
160
|
+
const classes = ["ui-menu__item", "ui-dropdown__item", className].filter(Boolean).join(" ");
|
|
161
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
162
|
+
DropdownPrimitive.Item,
|
|
163
|
+
{
|
|
164
|
+
...props,
|
|
165
|
+
ref,
|
|
166
|
+
className: classes,
|
|
167
|
+
"data-slot": "item",
|
|
168
|
+
"data-tone": tone
|
|
169
|
+
}
|
|
170
|
+
);
|
|
171
|
+
}
|
|
172
|
+
);
|
|
173
|
+
var DropdownLabel = (0, import_react3.forwardRef)(function DropdownLabel2({ className, ...props }, ref) {
|
|
174
|
+
const classes = ["ui-menu__label", className].filter(Boolean).join(" ");
|
|
175
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
176
|
+
DropdownPrimitive.Label,
|
|
177
|
+
{
|
|
178
|
+
...props,
|
|
179
|
+
ref,
|
|
180
|
+
className: classes,
|
|
181
|
+
"data-slot": "label"
|
|
182
|
+
}
|
|
183
|
+
);
|
|
184
|
+
});
|
|
185
|
+
var DropdownSeparator = (0, import_react3.forwardRef)(function DropdownSeparator2({ className, ...props }, ref) {
|
|
186
|
+
const classes = ["ui-menu__separator", className].filter(Boolean).join(" ");
|
|
187
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
188
|
+
DropdownPrimitive.Separator,
|
|
189
|
+
{
|
|
190
|
+
...props,
|
|
191
|
+
ref,
|
|
192
|
+
className: classes,
|
|
193
|
+
"data-slot": "separator"
|
|
194
|
+
}
|
|
195
|
+
);
|
|
196
|
+
});
|
|
197
|
+
var DropdownCheckboxItem = (0, import_react3.forwardRef)(function DropdownCheckboxItem2({ children, className, ...props }, ref) {
|
|
198
|
+
const classes = [
|
|
199
|
+
"ui-menu__item",
|
|
200
|
+
"ui-dropdown__item",
|
|
201
|
+
"ui-dropdown__checkbox-item",
|
|
202
|
+
className
|
|
203
|
+
].filter(Boolean).join(" ");
|
|
204
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
205
|
+
DropdownPrimitive.CheckboxItem,
|
|
206
|
+
{
|
|
207
|
+
...props,
|
|
208
|
+
ref,
|
|
209
|
+
className: classes,
|
|
210
|
+
"data-slot": "checkbox-item",
|
|
211
|
+
children: [
|
|
212
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
213
|
+
DropdownPrimitive.ItemIndicator,
|
|
214
|
+
{
|
|
215
|
+
className: "ui-dropdown__indicator",
|
|
216
|
+
"data-slot": "indicator",
|
|
217
|
+
children: "\u2713"
|
|
218
|
+
}
|
|
219
|
+
),
|
|
220
|
+
children
|
|
221
|
+
]
|
|
222
|
+
}
|
|
223
|
+
);
|
|
224
|
+
});
|
|
225
|
+
|
|
226
|
+
// src/components/input/input.tsx
|
|
227
|
+
var import_react4 = require("react");
|
|
228
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
229
|
+
var Input = (0, import_react4.forwardRef)(
|
|
230
|
+
function Input2({
|
|
231
|
+
"aria-invalid": ariaInvalid,
|
|
232
|
+
className,
|
|
233
|
+
invalid = false,
|
|
234
|
+
size = "sm",
|
|
235
|
+
...props
|
|
236
|
+
}, ref) {
|
|
237
|
+
const classes = ["ui-input", className].filter(Boolean).join(" ");
|
|
238
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
239
|
+
"input",
|
|
240
|
+
{
|
|
241
|
+
...props,
|
|
242
|
+
ref,
|
|
243
|
+
className: classes,
|
|
244
|
+
"aria-invalid": ariaInvalid ?? (invalid || void 0),
|
|
245
|
+
"data-slot": "root",
|
|
246
|
+
"data-size": size,
|
|
247
|
+
"data-invalid": invalid ? "" : void 0
|
|
248
|
+
}
|
|
249
|
+
);
|
|
250
|
+
}
|
|
251
|
+
);
|
|
252
|
+
|
|
253
|
+
// src/components/menu/menu.tsx
|
|
254
|
+
var RovingFocus = __toESM(require("@radix-ui/react-roving-focus"), 1);
|
|
255
|
+
var import_react5 = require("react");
|
|
256
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
257
|
+
var Menu = (0, import_react5.forwardRef)(
|
|
258
|
+
function Menu2({ className, loop = true, ...props }, ref) {
|
|
259
|
+
const classes = ["ui-menu", className].filter(Boolean).join(" ");
|
|
260
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RovingFocus.Root, { asChild: true, orientation: "vertical", loop, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
261
|
+
"div",
|
|
262
|
+
{
|
|
263
|
+
...props,
|
|
264
|
+
ref,
|
|
265
|
+
role: "menu",
|
|
266
|
+
className: classes,
|
|
267
|
+
"data-slot": "root"
|
|
268
|
+
}
|
|
269
|
+
) });
|
|
270
|
+
}
|
|
271
|
+
);
|
|
272
|
+
var MenuItem = (0, import_react5.forwardRef)(
|
|
273
|
+
function MenuItem2({ className, disabled, tone = "neutral", type = "button", ...props }, ref) {
|
|
274
|
+
const classes = ["ui-menu__item", className].filter(Boolean).join(" ");
|
|
275
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RovingFocus.Item, { asChild: true, focusable: !disabled, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
276
|
+
"button",
|
|
277
|
+
{
|
|
278
|
+
...props,
|
|
279
|
+
ref,
|
|
280
|
+
type,
|
|
281
|
+
role: "menuitem",
|
|
282
|
+
className: classes,
|
|
283
|
+
disabled,
|
|
284
|
+
"data-slot": "item",
|
|
285
|
+
"data-tone": tone
|
|
286
|
+
}
|
|
287
|
+
) });
|
|
288
|
+
}
|
|
289
|
+
);
|
|
290
|
+
var MenuLabel = (0, import_react5.forwardRef)(
|
|
291
|
+
function MenuLabel2({ className, ...props }, ref) {
|
|
292
|
+
const classes = ["ui-menu__label", className].filter(Boolean).join(" ");
|
|
293
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ...props, ref, className: classes, "data-slot": "label" });
|
|
294
|
+
}
|
|
295
|
+
);
|
|
296
|
+
var MenuSeparator = (0, import_react5.forwardRef)(function MenuSeparator2({ className, ...props }, ref) {
|
|
297
|
+
const classes = ["ui-menu__separator", className].filter(Boolean).join(" ");
|
|
298
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
299
|
+
"div",
|
|
300
|
+
{
|
|
301
|
+
...props,
|
|
302
|
+
ref,
|
|
303
|
+
role: "separator",
|
|
304
|
+
className: classes,
|
|
305
|
+
"data-slot": "separator"
|
|
306
|
+
}
|
|
307
|
+
);
|
|
308
|
+
});
|
|
309
|
+
|
|
310
|
+
// src/components/select/select.tsx
|
|
311
|
+
var SelectPrimitive = __toESM(require("@radix-ui/react-select"), 1);
|
|
312
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
313
|
+
function Select({
|
|
314
|
+
"aria-label": ariaLabel,
|
|
315
|
+
"aria-labelledby": ariaLabelledby,
|
|
316
|
+
contentClassName,
|
|
317
|
+
defaultOpen,
|
|
318
|
+
defaultValue,
|
|
319
|
+
disabled,
|
|
320
|
+
id,
|
|
321
|
+
name,
|
|
322
|
+
onOpenChange,
|
|
323
|
+
onValueChange,
|
|
324
|
+
open,
|
|
325
|
+
options,
|
|
326
|
+
placeholder = "Select an option",
|
|
327
|
+
required,
|
|
328
|
+
size = "sm",
|
|
329
|
+
value
|
|
330
|
+
}) {
|
|
331
|
+
const themeName = useUiThemeName();
|
|
332
|
+
const rootProps = {
|
|
333
|
+
...value === void 0 ? {} : { value },
|
|
334
|
+
...defaultValue === void 0 ? {} : { defaultValue },
|
|
335
|
+
...onValueChange === void 0 ? {} : { onValueChange },
|
|
336
|
+
...open === void 0 ? {} : { open },
|
|
337
|
+
...defaultOpen === void 0 ? {} : { defaultOpen },
|
|
338
|
+
...onOpenChange === void 0 ? {} : { onOpenChange },
|
|
339
|
+
...disabled === void 0 ? {} : { disabled },
|
|
340
|
+
...required === void 0 ? {} : { required },
|
|
341
|
+
...name === void 0 ? {} : { name }
|
|
342
|
+
};
|
|
343
|
+
const contentClasses = ["ui-select__content", contentClassName].filter(Boolean).join(" ");
|
|
344
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(SelectPrimitive.Root, { ...rootProps, children: [
|
|
345
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
346
|
+
SelectPrimitive.Trigger,
|
|
347
|
+
{
|
|
348
|
+
id,
|
|
349
|
+
className: "ui-select__trigger",
|
|
350
|
+
"data-slot": "trigger",
|
|
351
|
+
"data-size": size,
|
|
352
|
+
"aria-label": ariaLabel,
|
|
353
|
+
"aria-labelledby": ariaLabelledby,
|
|
354
|
+
children: [
|
|
355
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectPrimitive.Value, { placeholder }),
|
|
356
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectPrimitive.Icon, { className: "ui-select__icon", "data-slot": "icon", children: "\u25BE" })
|
|
357
|
+
]
|
|
358
|
+
}
|
|
359
|
+
),
|
|
360
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
361
|
+
SelectPrimitive.Content,
|
|
362
|
+
{
|
|
363
|
+
className: contentClasses,
|
|
364
|
+
"data-slot": "content",
|
|
365
|
+
"data-ui-theme": themeName,
|
|
366
|
+
position: "popper",
|
|
367
|
+
sideOffset: 6,
|
|
368
|
+
collisionPadding: 8,
|
|
369
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
370
|
+
SelectPrimitive.Viewport,
|
|
371
|
+
{
|
|
372
|
+
className: "ui-select__viewport",
|
|
373
|
+
"data-slot": "viewport",
|
|
374
|
+
children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
375
|
+
SelectPrimitive.Item,
|
|
376
|
+
{
|
|
377
|
+
value: option.value,
|
|
378
|
+
...option.disabled === void 0 ? {} : { disabled: option.disabled },
|
|
379
|
+
className: "ui-select__item",
|
|
380
|
+
"data-slot": "item",
|
|
381
|
+
children: [
|
|
382
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectPrimitive.ItemText, { children: option.label }),
|
|
383
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
384
|
+
SelectPrimitive.ItemIndicator,
|
|
385
|
+
{
|
|
386
|
+
className: "ui-select__indicator",
|
|
387
|
+
"data-slot": "indicator",
|
|
388
|
+
children: "\u2713"
|
|
389
|
+
}
|
|
390
|
+
)
|
|
391
|
+
]
|
|
392
|
+
},
|
|
393
|
+
option.value
|
|
394
|
+
))
|
|
395
|
+
}
|
|
396
|
+
)
|
|
397
|
+
}
|
|
398
|
+
) })
|
|
399
|
+
] });
|
|
400
|
+
}
|
|
401
|
+
|
|
402
|
+
// src/components/tooltip/tooltip.tsx
|
|
403
|
+
var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"), 1);
|
|
404
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
405
|
+
function Tooltip({
|
|
406
|
+
align = "center",
|
|
407
|
+
children,
|
|
408
|
+
content,
|
|
409
|
+
contentClassName,
|
|
410
|
+
defaultOpen,
|
|
411
|
+
delayDuration = 350,
|
|
412
|
+
onOpenChange,
|
|
413
|
+
open,
|
|
414
|
+
side = "top",
|
|
415
|
+
sideOffset = 8
|
|
416
|
+
}) {
|
|
417
|
+
const themeName = useUiThemeName();
|
|
418
|
+
const rootProps = {
|
|
419
|
+
...open === void 0 ? {} : { open },
|
|
420
|
+
...defaultOpen === void 0 ? {} : { defaultOpen },
|
|
421
|
+
...onOpenChange === void 0 ? {} : { onOpenChange }
|
|
422
|
+
};
|
|
423
|
+
const classes = ["ui-tooltip", contentClassName].filter(Boolean).join(" ");
|
|
424
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TooltipPrimitive.Provider, { delayDuration, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(TooltipPrimitive.Root, { ...rootProps, children: [
|
|
425
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TooltipPrimitive.Trigger, { asChild: true, children }),
|
|
426
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TooltipPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
|
|
427
|
+
TooltipPrimitive.Content,
|
|
428
|
+
{
|
|
429
|
+
className: classes,
|
|
430
|
+
"data-slot": "content",
|
|
431
|
+
"data-ui-theme": themeName,
|
|
432
|
+
side,
|
|
433
|
+
align,
|
|
434
|
+
sideOffset,
|
|
435
|
+
children: [
|
|
436
|
+
content,
|
|
437
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TooltipPrimitive.Arrow, { className: "ui-tooltip__arrow", "data-slot": "arrow" })
|
|
438
|
+
]
|
|
439
|
+
}
|
|
440
|
+
) })
|
|
441
|
+
] }) });
|
|
442
|
+
}
|
|
443
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
444
|
+
0 && (module.exports = {
|
|
445
|
+
Button,
|
|
446
|
+
Dropdown,
|
|
447
|
+
DropdownCheckboxItem,
|
|
448
|
+
DropdownItem,
|
|
449
|
+
DropdownLabel,
|
|
450
|
+
DropdownSeparator,
|
|
451
|
+
Input,
|
|
452
|
+
Menu,
|
|
453
|
+
MenuItem,
|
|
454
|
+
MenuLabel,
|
|
455
|
+
MenuSeparator,
|
|
456
|
+
Select,
|
|
457
|
+
Tooltip,
|
|
458
|
+
UiTheme
|
|
459
|
+
});
|
|
460
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/components/button/button.tsx","../src/components/dropdown/dropdown.tsx","../src/theme/ui-theme.tsx","../src/components/input/input.tsx","../src/components/menu/menu.tsx","../src/components/select/select.tsx","../src/components/tooltip/tooltip.tsx"],"sourcesContent":["export * from './components/button';\nexport * from './components/dropdown';\nexport * from './components/input';\nexport * from './components/menu';\nexport * from './components/select';\nexport * from './components/tooltip';\nexport { UiTheme } from './theme/ui-theme';\nexport type { UiThemeProps } from './theme/ui-theme';\n","import { forwardRef } from 'react';\nimport type { ButtonHTMLAttributes } from 'react';\n\nexport type ButtonVariant = 'primary' | 'secondary' | 'ghost';\nexport type ButtonSize = 'xs' | 'mini' | 'sm' | 'lg';\nexport type ButtonTone = 'neutral' | 'danger';\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n /** The visual hierarchy of the action. */\n variant?: ButtonVariant;\n /** The control height and horizontal spacing. */\n size?: ButtonSize;\n /** The semantic intent of the action. */\n tone?: ButtonTone;\n /** Prevents repeated interaction and exposes a busy state to assistive tech. */\n loading?: boolean;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n className,\n children,\n disabled,\n loading = false,\n size = 'sm',\n tone = 'neutral',\n type = 'button',\n variant = 'primary',\n ...props\n },\n ref,\n ) {\n const classes = ['ui-button', className].filter(Boolean).join(' ');\n\n return (\n <button\n {...props}\n ref={ref}\n type={type}\n className={classes}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n data-slot=\"root\"\n data-variant={variant}\n data-size={size}\n data-tone={tone}\n data-loading={loading ? '' : undefined}\n >\n {loading ? (\n <span className=\"ui-button__spinner\" data-slot=\"spinner\" aria-hidden=\"true\" />\n ) : null}\n <span className=\"ui-button__label\" data-slot=\"label\">\n {children}\n </span>\n </button>\n );\n },\n);\n\n","import * as DropdownPrimitive from '@radix-ui/react-dropdown-menu';\nimport { forwardRef } from 'react';\nimport type { ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react';\nimport { useUiThemeName } from '../../theme/ui-theme';\n\nexport type DropdownSide = 'top' | 'right' | 'bottom' | 'left';\nexport type DropdownAlign = 'start' | 'center' | 'end';\n\nexport interface DropdownProps {\n /** The element that opens the dropdown. It must accept a ref. */\n trigger: ReactElement;\n children: ReactNode;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n side?: DropdownSide;\n align?: DropdownAlign;\n sideOffset?: number;\n modal?: boolean;\n contentClassName?: string;\n}\n\nexport function Dropdown({\n align = 'start',\n children,\n contentClassName,\n defaultOpen,\n modal = true,\n onOpenChange,\n open,\n side = 'bottom',\n sideOffset = 8,\n trigger,\n}: DropdownProps) {\n const themeName = useUiThemeName();\n const rootProps: DropdownPrimitive.DropdownMenuProps = {\n modal,\n ...(open === undefined ? {} : { open }),\n ...(defaultOpen === undefined ? {} : { defaultOpen }),\n ...(onOpenChange === undefined ? {} : { onOpenChange }),\n };\n const classes = ['ui-dropdown', contentClassName].filter(Boolean).join(' ');\n\n return (\n <DropdownPrimitive.Root {...rootProps}>\n <DropdownPrimitive.Trigger asChild>{trigger}</DropdownPrimitive.Trigger>\n <DropdownPrimitive.Portal>\n <DropdownPrimitive.Content\n className={classes}\n data-slot=\"content\"\n data-ui-theme={themeName}\n side={side}\n align={align}\n sideOffset={sideOffset}\n collisionPadding={8}\n >\n {children}\n <DropdownPrimitive.Arrow className=\"ui-dropdown__arrow\" data-slot=\"arrow\" />\n </DropdownPrimitive.Content>\n </DropdownPrimitive.Portal>\n </DropdownPrimitive.Root>\n );\n}\n\nexport interface DropdownItemProps\n extends ComponentPropsWithoutRef<typeof DropdownPrimitive.Item> {\n tone?: 'neutral' | 'danger';\n}\n\nexport const DropdownItem = forwardRef<HTMLDivElement, DropdownItemProps>(\n function DropdownItem(\n { className, tone = 'neutral', ...props },\n ref,\n ) {\n const classes = ['ui-menu__item', 'ui-dropdown__item', className]\n .filter(Boolean)\n .join(' ');\n return (\n <DropdownPrimitive.Item\n {...props}\n ref={ref}\n className={classes}\n data-slot=\"item\"\n data-tone={tone}\n />\n );\n },\n);\n\nexport const DropdownLabel = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<typeof DropdownPrimitive.Label>\n>(function DropdownLabel({ className, ...props }, ref) {\n const classes = ['ui-menu__label', className].filter(Boolean).join(' ');\n return (\n <DropdownPrimitive.Label\n {...props}\n ref={ref}\n className={classes}\n data-slot=\"label\"\n />\n );\n});\n\nexport const DropdownSeparator = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<typeof DropdownPrimitive.Separator>\n>(function DropdownSeparator({ className, ...props }, ref) {\n const classes = ['ui-menu__separator', className].filter(Boolean).join(' ');\n return (\n <DropdownPrimitive.Separator\n {...props}\n ref={ref}\n className={classes}\n data-slot=\"separator\"\n />\n );\n});\n\nexport interface DropdownCheckboxItemProps\n extends ComponentPropsWithoutRef<typeof DropdownPrimitive.CheckboxItem> {}\n\nexport const DropdownCheckboxItem = forwardRef<\n HTMLDivElement,\n DropdownCheckboxItemProps\n>(function DropdownCheckboxItem({ children, className, ...props }, ref) {\n const classes = [\n 'ui-menu__item',\n 'ui-dropdown__item',\n 'ui-dropdown__checkbox-item',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n return (\n <DropdownPrimitive.CheckboxItem\n {...props}\n ref={ref}\n className={classes}\n data-slot=\"checkbox-item\"\n >\n <DropdownPrimitive.ItemIndicator\n className=\"ui-dropdown__indicator\"\n data-slot=\"indicator\"\n >\n ✓\n </DropdownPrimitive.ItemIndicator>\n {children}\n </DropdownPrimitive.CheckboxItem>\n );\n});\n\n","import { createContext, forwardRef, useContext } from 'react';\nimport type { HTMLAttributes } from 'react';\n\nexport interface UiThemeProps extends HTMLAttributes<HTMLDivElement> {\n /** Theme name contributed by an installed theme package. */\n name: string;\n}\n\nconst UiThemeContext = createContext<string | undefined>(undefined);\n\nexport function useUiThemeName() {\n return useContext(UiThemeContext);\n}\n\nexport const UiTheme = forwardRef<HTMLDivElement, UiThemeProps>(\n function UiTheme({ className, name, ...props }, ref) {\n const classes = ['ui-theme', className].filter(Boolean).join(' ');\n\n return (\n <UiThemeContext.Provider value={name}>\n <div\n {...props}\n ref={ref}\n className={classes}\n data-ui-theme={name}\n data-slot=\"theme-root\"\n />\n </UiThemeContext.Provider>\n );\n },\n);\n","import { forwardRef } from 'react';\nimport type { InputHTMLAttributes } from 'react';\n\nexport type InputSize = 'xs' | 'mini' | 'sm' | 'lg';\n\nexport interface InputProps\n extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {\n /** The control height and horizontal spacing. */\n size?: InputSize;\n /** Exposes an invalid state visually and to assistive technology. */\n invalid?: boolean;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n function Input(\n {\n 'aria-invalid': ariaInvalid,\n className,\n invalid = false,\n size = 'sm',\n ...props\n },\n ref,\n ) {\n const classes = ['ui-input', className].filter(Boolean).join(' ');\n\n return (\n <input\n {...props}\n ref={ref}\n className={classes}\n aria-invalid={ariaInvalid ?? (invalid || undefined)}\n data-slot=\"root\"\n data-size={size}\n data-invalid={invalid ? '' : undefined}\n />\n );\n },\n);\n\n","import * as RovingFocus from '@radix-ui/react-roving-focus';\nimport { forwardRef } from 'react';\nimport type { ButtonHTMLAttributes, HTMLAttributes } from 'react';\n\nexport interface MenuProps extends HTMLAttributes<HTMLDivElement> {\n /** Whether arrow-key focus wraps from the last item to the first. */\n loop?: boolean;\n}\n\nexport const Menu = forwardRef<HTMLDivElement, MenuProps>(\n function Menu({ className, loop = true, ...props }, ref) {\n const classes = ['ui-menu', className].filter(Boolean).join(' ');\n\n return (\n <RovingFocus.Root asChild orientation=\"vertical\" loop={loop}>\n <div\n {...props}\n ref={ref}\n role=\"menu\"\n className={classes}\n data-slot=\"root\"\n />\n </RovingFocus.Root>\n );\n },\n);\n\nexport interface MenuItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n /** Destructive items use the shared danger semantic token. */\n tone?: 'neutral' | 'danger';\n}\n\nexport const MenuItem = forwardRef<HTMLButtonElement, MenuItemProps>(\n function MenuItem(\n { className, disabled, tone = 'neutral', type = 'button', ...props },\n ref,\n ) {\n const classes = ['ui-menu__item', className].filter(Boolean).join(' ');\n\n return (\n <RovingFocus.Item asChild focusable={!disabled}>\n <button\n {...props}\n ref={ref}\n type={type}\n role=\"menuitem\"\n className={classes}\n disabled={disabled}\n data-slot=\"item\"\n data-tone={tone}\n />\n </RovingFocus.Item>\n );\n },\n);\n\nexport const MenuLabel = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(\n function MenuLabel({ className, ...props }, ref) {\n const classes = ['ui-menu__label', className].filter(Boolean).join(' ');\n return <div {...props} ref={ref} className={classes} data-slot=\"label\" />;\n },\n);\n\nexport const MenuSeparator = forwardRef<\n HTMLDivElement,\n HTMLAttributes<HTMLDivElement>\n>(function MenuSeparator({ className, ...props }, ref) {\n const classes = ['ui-menu__separator', className].filter(Boolean).join(' ');\n return (\n <div\n {...props}\n ref={ref}\n role=\"separator\"\n className={classes}\n data-slot=\"separator\"\n />\n );\n});\n\n","import * as SelectPrimitive from '@radix-ui/react-select';\nimport type { ReactNode } from 'react';\nimport { useUiThemeName } from '../../theme/ui-theme';\n\nexport type SelectSize = 'xs' | 'mini' | 'sm' | 'lg';\n\nexport interface SelectOption {\n value: string;\n label: ReactNode;\n disabled?: boolean;\n}\n\nexport interface SelectProps {\n options: readonly SelectOption[];\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n placeholder?: ReactNode;\n size?: SelectSize;\n disabled?: boolean;\n required?: boolean;\n name?: string;\n id?: string;\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n contentClassName?: string;\n}\n\nexport function Select({\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n contentClassName,\n defaultOpen,\n defaultValue,\n disabled,\n id,\n name,\n onOpenChange,\n onValueChange,\n open,\n options,\n placeholder = 'Select an option',\n required,\n size = 'sm',\n value,\n}: SelectProps) {\n const themeName = useUiThemeName();\n const rootProps: SelectPrimitive.SelectProps = {\n ...(value === undefined ? {} : { value }),\n ...(defaultValue === undefined ? {} : { defaultValue }),\n ...(onValueChange === undefined ? {} : { onValueChange }),\n ...(open === undefined ? {} : { open }),\n ...(defaultOpen === undefined ? {} : { defaultOpen }),\n ...(onOpenChange === undefined ? {} : { onOpenChange }),\n ...(disabled === undefined ? {} : { disabled }),\n ...(required === undefined ? {} : { required }),\n ...(name === undefined ? {} : { name }),\n };\n const contentClasses = ['ui-select__content', contentClassName]\n .filter(Boolean)\n .join(' ');\n\n return (\n <SelectPrimitive.Root {...rootProps}>\n <SelectPrimitive.Trigger\n id={id}\n className=\"ui-select__trigger\"\n data-slot=\"trigger\"\n data-size={size}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby}\n >\n <SelectPrimitive.Value placeholder={placeholder} />\n <SelectPrimitive.Icon className=\"ui-select__icon\" data-slot=\"icon\">\n ▾\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n className={contentClasses}\n data-slot=\"content\"\n data-ui-theme={themeName}\n position=\"popper\"\n sideOffset={6}\n collisionPadding={8}\n >\n <SelectPrimitive.Viewport\n className=\"ui-select__viewport\"\n data-slot=\"viewport\"\n >\n {options.map((option) => (\n <SelectPrimitive.Item\n key={option.value}\n value={option.value}\n {...(option.disabled === undefined\n ? {}\n : { disabled: option.disabled })}\n className=\"ui-select__item\"\n data-slot=\"item\"\n >\n <SelectPrimitive.ItemText>{option.label}</SelectPrimitive.ItemText>\n <SelectPrimitive.ItemIndicator\n className=\"ui-select__indicator\"\n data-slot=\"indicator\"\n >\n ✓\n </SelectPrimitive.ItemIndicator>\n </SelectPrimitive.Item>\n ))}\n </SelectPrimitive.Viewport>\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n </SelectPrimitive.Root>\n );\n}\n","import * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport type { ReactElement, ReactNode } from 'react';\nimport { useUiThemeName } from '../../theme/ui-theme';\n\nexport type TooltipSide = 'top' | 'right' | 'bottom' | 'left';\nexport type TooltipAlign = 'start' | 'center' | 'end';\n\nexport interface TooltipProps {\n /** The trigger element. It must be able to receive a ref. */\n children: ReactElement;\n /** Content announced and displayed by the tooltip. */\n content: ReactNode;\n /** Controlled open state. */\n open?: boolean;\n /** Initial state when the tooltip is uncontrolled. */\n defaultOpen?: boolean;\n /** Called whenever the open state changes. */\n onOpenChange?: (open: boolean) => void;\n /** Delay before opening from pointer hover, in milliseconds. */\n delayDuration?: number;\n /** Preferred placement relative to the trigger. */\n side?: TooltipSide;\n /** Alignment along the selected side. */\n align?: TooltipAlign;\n /** Gap between the trigger and content. */\n sideOffset?: number;\n /** Extra class for a one-off content customization. */\n contentClassName?: string;\n}\n\nexport function Tooltip({\n align = 'center',\n children,\n content,\n contentClassName,\n defaultOpen,\n delayDuration = 350,\n onOpenChange,\n open,\n side = 'top',\n sideOffset = 8,\n}: TooltipProps) {\n const themeName = useUiThemeName();\n const rootProps: TooltipPrimitive.TooltipProps = {\n ...(open === undefined ? {} : { open }),\n ...(defaultOpen === undefined ? {} : { defaultOpen }),\n ...(onOpenChange === undefined ? {} : { onOpenChange }),\n };\n const classes = ['ui-tooltip', contentClassName].filter(Boolean).join(' ');\n\n return (\n <TooltipPrimitive.Provider delayDuration={delayDuration}>\n <TooltipPrimitive.Root {...rootProps}>\n <TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Content\n className={classes}\n data-slot=\"content\"\n data-ui-theme={themeName}\n side={side}\n align={align}\n sideOffset={sideOffset}\n >\n {content}\n <TooltipPrimitive.Arrow className=\"ui-tooltip__arrow\" data-slot=\"arrow\" />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.Provider>\n );\n}\n"],"mappings":"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","names":["Button","import_react","import_react","import_jsx_runtime","UiTheme","import_jsx_runtime","DropdownItem","DropdownLabel","DropdownSeparator","DropdownCheckboxItem","import_react","import_jsx_runtime","Input","import_react","import_jsx_runtime","Menu","MenuItem","MenuLabel","MenuSeparator","import_jsx_runtime","import_jsx_runtime"]}
|
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ButtonHTMLAttributes, ReactElement, ReactNode, ComponentPropsWithoutRef, InputHTMLAttributes, HTMLAttributes } from 'react';
|
|
3
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
4
|
+
import * as DropdownPrimitive from '@radix-ui/react-dropdown-menu';
|
|
5
|
+
|
|
6
|
+
type ButtonVariant = 'primary' | 'secondary' | 'ghost';
|
|
7
|
+
type ButtonSize = 'xs' | 'mini' | 'sm' | 'lg';
|
|
8
|
+
type ButtonTone = 'neutral' | 'danger';
|
|
9
|
+
interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
10
|
+
/** The visual hierarchy of the action. */
|
|
11
|
+
variant?: ButtonVariant;
|
|
12
|
+
/** The control height and horizontal spacing. */
|
|
13
|
+
size?: ButtonSize;
|
|
14
|
+
/** The semantic intent of the action. */
|
|
15
|
+
tone?: ButtonTone;
|
|
16
|
+
/** Prevents repeated interaction and exposes a busy state to assistive tech. */
|
|
17
|
+
loading?: boolean;
|
|
18
|
+
}
|
|
19
|
+
declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
|
|
20
|
+
|
|
21
|
+
type DropdownSide = 'top' | 'right' | 'bottom' | 'left';
|
|
22
|
+
type DropdownAlign = 'start' | 'center' | 'end';
|
|
23
|
+
interface DropdownProps {
|
|
24
|
+
/** The element that opens the dropdown. It must accept a ref. */
|
|
25
|
+
trigger: ReactElement;
|
|
26
|
+
children: ReactNode;
|
|
27
|
+
open?: boolean;
|
|
28
|
+
defaultOpen?: boolean;
|
|
29
|
+
onOpenChange?: (open: boolean) => void;
|
|
30
|
+
side?: DropdownSide;
|
|
31
|
+
align?: DropdownAlign;
|
|
32
|
+
sideOffset?: number;
|
|
33
|
+
modal?: boolean;
|
|
34
|
+
contentClassName?: string;
|
|
35
|
+
}
|
|
36
|
+
declare function Dropdown({ align, children, contentClassName, defaultOpen, modal, onOpenChange, open, side, sideOffset, trigger, }: DropdownProps): react_jsx_runtime.JSX.Element;
|
|
37
|
+
interface DropdownItemProps extends ComponentPropsWithoutRef<typeof DropdownPrimitive.Item> {
|
|
38
|
+
tone?: 'neutral' | 'danger';
|
|
39
|
+
}
|
|
40
|
+
declare const DropdownItem: react.ForwardRefExoticComponent<DropdownItemProps & react.RefAttributes<HTMLDivElement>>;
|
|
41
|
+
declare const DropdownLabel: react.ForwardRefExoticComponent<Omit<DropdownPrimitive.DropdownMenuLabelProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
42
|
+
declare const DropdownSeparator: react.ForwardRefExoticComponent<Omit<DropdownPrimitive.DropdownMenuSeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
43
|
+
interface DropdownCheckboxItemProps extends ComponentPropsWithoutRef<typeof DropdownPrimitive.CheckboxItem> {
|
|
44
|
+
}
|
|
45
|
+
declare const DropdownCheckboxItem: react.ForwardRefExoticComponent<DropdownCheckboxItemProps & react.RefAttributes<HTMLDivElement>>;
|
|
46
|
+
|
|
47
|
+
type InputSize = 'xs' | 'mini' | 'sm' | 'lg';
|
|
48
|
+
interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
|
|
49
|
+
/** The control height and horizontal spacing. */
|
|
50
|
+
size?: InputSize;
|
|
51
|
+
/** Exposes an invalid state visually and to assistive technology. */
|
|
52
|
+
invalid?: boolean;
|
|
53
|
+
}
|
|
54
|
+
declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
|
|
55
|
+
|
|
56
|
+
interface MenuProps extends HTMLAttributes<HTMLDivElement> {
|
|
57
|
+
/** Whether arrow-key focus wraps from the last item to the first. */
|
|
58
|
+
loop?: boolean;
|
|
59
|
+
}
|
|
60
|
+
declare const Menu: react.ForwardRefExoticComponent<MenuProps & react.RefAttributes<HTMLDivElement>>;
|
|
61
|
+
interface MenuItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
62
|
+
/** Destructive items use the shared danger semantic token. */
|
|
63
|
+
tone?: 'neutral' | 'danger';
|
|
64
|
+
}
|
|
65
|
+
declare const MenuItem: react.ForwardRefExoticComponent<MenuItemProps & react.RefAttributes<HTMLButtonElement>>;
|
|
66
|
+
declare const MenuLabel: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
|
|
67
|
+
declare const MenuSeparator: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
|
|
68
|
+
|
|
69
|
+
type SelectSize = 'xs' | 'mini' | 'sm' | 'lg';
|
|
70
|
+
interface SelectOption {
|
|
71
|
+
value: string;
|
|
72
|
+
label: ReactNode;
|
|
73
|
+
disabled?: boolean;
|
|
74
|
+
}
|
|
75
|
+
interface SelectProps {
|
|
76
|
+
options: readonly SelectOption[];
|
|
77
|
+
value?: string;
|
|
78
|
+
defaultValue?: string;
|
|
79
|
+
onValueChange?: (value: string) => void;
|
|
80
|
+
open?: boolean;
|
|
81
|
+
defaultOpen?: boolean;
|
|
82
|
+
onOpenChange?: (open: boolean) => void;
|
|
83
|
+
placeholder?: ReactNode;
|
|
84
|
+
size?: SelectSize;
|
|
85
|
+
disabled?: boolean;
|
|
86
|
+
required?: boolean;
|
|
87
|
+
name?: string;
|
|
88
|
+
id?: string;
|
|
89
|
+
'aria-label'?: string;
|
|
90
|
+
'aria-labelledby'?: string;
|
|
91
|
+
contentClassName?: string;
|
|
92
|
+
}
|
|
93
|
+
declare function Select({ 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, contentClassName, defaultOpen, defaultValue, disabled, id, name, onOpenChange, onValueChange, open, options, placeholder, required, size, value, }: SelectProps): react_jsx_runtime.JSX.Element;
|
|
94
|
+
|
|
95
|
+
type TooltipSide = 'top' | 'right' | 'bottom' | 'left';
|
|
96
|
+
type TooltipAlign = 'start' | 'center' | 'end';
|
|
97
|
+
interface TooltipProps {
|
|
98
|
+
/** The trigger element. It must be able to receive a ref. */
|
|
99
|
+
children: ReactElement;
|
|
100
|
+
/** Content announced and displayed by the tooltip. */
|
|
101
|
+
content: ReactNode;
|
|
102
|
+
/** Controlled open state. */
|
|
103
|
+
open?: boolean;
|
|
104
|
+
/** Initial state when the tooltip is uncontrolled. */
|
|
105
|
+
defaultOpen?: boolean;
|
|
106
|
+
/** Called whenever the open state changes. */
|
|
107
|
+
onOpenChange?: (open: boolean) => void;
|
|
108
|
+
/** Delay before opening from pointer hover, in milliseconds. */
|
|
109
|
+
delayDuration?: number;
|
|
110
|
+
/** Preferred placement relative to the trigger. */
|
|
111
|
+
side?: TooltipSide;
|
|
112
|
+
/** Alignment along the selected side. */
|
|
113
|
+
align?: TooltipAlign;
|
|
114
|
+
/** Gap between the trigger and content. */
|
|
115
|
+
sideOffset?: number;
|
|
116
|
+
/** Extra class for a one-off content customization. */
|
|
117
|
+
contentClassName?: string;
|
|
118
|
+
}
|
|
119
|
+
declare function Tooltip({ align, children, content, contentClassName, defaultOpen, delayDuration, onOpenChange, open, side, sideOffset, }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
120
|
+
|
|
121
|
+
interface UiThemeProps extends HTMLAttributes<HTMLDivElement> {
|
|
122
|
+
/** Theme name contributed by an installed theme package. */
|
|
123
|
+
name: string;
|
|
124
|
+
}
|
|
125
|
+
declare const UiTheme: react.ForwardRefExoticComponent<UiThemeProps & react.RefAttributes<HTMLDivElement>>;
|
|
126
|
+
|
|
127
|
+
export { Button, type ButtonProps, type ButtonSize, type ButtonTone, type ButtonVariant, Dropdown, type DropdownAlign, DropdownCheckboxItem, type DropdownCheckboxItemProps, DropdownItem, type DropdownItemProps, DropdownLabel, type DropdownProps, DropdownSeparator, type DropdownSide, Input, type InputProps, type InputSize, Menu, MenuItem, type MenuItemProps, MenuLabel, type MenuProps, MenuSeparator, Select, type SelectOption, type SelectProps, type SelectSize, Tooltip, type TooltipAlign, type TooltipProps, type TooltipSide, UiTheme, type UiThemeProps };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ButtonHTMLAttributes, ReactElement, ReactNode, ComponentPropsWithoutRef, InputHTMLAttributes, HTMLAttributes } from 'react';
|
|
3
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
4
|
+
import * as DropdownPrimitive from '@radix-ui/react-dropdown-menu';
|
|
5
|
+
|
|
6
|
+
type ButtonVariant = 'primary' | 'secondary' | 'ghost';
|
|
7
|
+
type ButtonSize = 'xs' | 'mini' | 'sm' | 'lg';
|
|
8
|
+
type ButtonTone = 'neutral' | 'danger';
|
|
9
|
+
interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
10
|
+
/** The visual hierarchy of the action. */
|
|
11
|
+
variant?: ButtonVariant;
|
|
12
|
+
/** The control height and horizontal spacing. */
|
|
13
|
+
size?: ButtonSize;
|
|
14
|
+
/** The semantic intent of the action. */
|
|
15
|
+
tone?: ButtonTone;
|
|
16
|
+
/** Prevents repeated interaction and exposes a busy state to assistive tech. */
|
|
17
|
+
loading?: boolean;
|
|
18
|
+
}
|
|
19
|
+
declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
|
|
20
|
+
|
|
21
|
+
type DropdownSide = 'top' | 'right' | 'bottom' | 'left';
|
|
22
|
+
type DropdownAlign = 'start' | 'center' | 'end';
|
|
23
|
+
interface DropdownProps {
|
|
24
|
+
/** The element that opens the dropdown. It must accept a ref. */
|
|
25
|
+
trigger: ReactElement;
|
|
26
|
+
children: ReactNode;
|
|
27
|
+
open?: boolean;
|
|
28
|
+
defaultOpen?: boolean;
|
|
29
|
+
onOpenChange?: (open: boolean) => void;
|
|
30
|
+
side?: DropdownSide;
|
|
31
|
+
align?: DropdownAlign;
|
|
32
|
+
sideOffset?: number;
|
|
33
|
+
modal?: boolean;
|
|
34
|
+
contentClassName?: string;
|
|
35
|
+
}
|
|
36
|
+
declare function Dropdown({ align, children, contentClassName, defaultOpen, modal, onOpenChange, open, side, sideOffset, trigger, }: DropdownProps): react_jsx_runtime.JSX.Element;
|
|
37
|
+
interface DropdownItemProps extends ComponentPropsWithoutRef<typeof DropdownPrimitive.Item> {
|
|
38
|
+
tone?: 'neutral' | 'danger';
|
|
39
|
+
}
|
|
40
|
+
declare const DropdownItem: react.ForwardRefExoticComponent<DropdownItemProps & react.RefAttributes<HTMLDivElement>>;
|
|
41
|
+
declare const DropdownLabel: react.ForwardRefExoticComponent<Omit<DropdownPrimitive.DropdownMenuLabelProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
42
|
+
declare const DropdownSeparator: react.ForwardRefExoticComponent<Omit<DropdownPrimitive.DropdownMenuSeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
43
|
+
interface DropdownCheckboxItemProps extends ComponentPropsWithoutRef<typeof DropdownPrimitive.CheckboxItem> {
|
|
44
|
+
}
|
|
45
|
+
declare const DropdownCheckboxItem: react.ForwardRefExoticComponent<DropdownCheckboxItemProps & react.RefAttributes<HTMLDivElement>>;
|
|
46
|
+
|
|
47
|
+
type InputSize = 'xs' | 'mini' | 'sm' | 'lg';
|
|
48
|
+
interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
|
|
49
|
+
/** The control height and horizontal spacing. */
|
|
50
|
+
size?: InputSize;
|
|
51
|
+
/** Exposes an invalid state visually and to assistive technology. */
|
|
52
|
+
invalid?: boolean;
|
|
53
|
+
}
|
|
54
|
+
declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
|
|
55
|
+
|
|
56
|
+
interface MenuProps extends HTMLAttributes<HTMLDivElement> {
|
|
57
|
+
/** Whether arrow-key focus wraps from the last item to the first. */
|
|
58
|
+
loop?: boolean;
|
|
59
|
+
}
|
|
60
|
+
declare const Menu: react.ForwardRefExoticComponent<MenuProps & react.RefAttributes<HTMLDivElement>>;
|
|
61
|
+
interface MenuItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
62
|
+
/** Destructive items use the shared danger semantic token. */
|
|
63
|
+
tone?: 'neutral' | 'danger';
|
|
64
|
+
}
|
|
65
|
+
declare const MenuItem: react.ForwardRefExoticComponent<MenuItemProps & react.RefAttributes<HTMLButtonElement>>;
|
|
66
|
+
declare const MenuLabel: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
|
|
67
|
+
declare const MenuSeparator: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
|
|
68
|
+
|
|
69
|
+
type SelectSize = 'xs' | 'mini' | 'sm' | 'lg';
|
|
70
|
+
interface SelectOption {
|
|
71
|
+
value: string;
|
|
72
|
+
label: ReactNode;
|
|
73
|
+
disabled?: boolean;
|
|
74
|
+
}
|
|
75
|
+
interface SelectProps {
|
|
76
|
+
options: readonly SelectOption[];
|
|
77
|
+
value?: string;
|
|
78
|
+
defaultValue?: string;
|
|
79
|
+
onValueChange?: (value: string) => void;
|
|
80
|
+
open?: boolean;
|
|
81
|
+
defaultOpen?: boolean;
|
|
82
|
+
onOpenChange?: (open: boolean) => void;
|
|
83
|
+
placeholder?: ReactNode;
|
|
84
|
+
size?: SelectSize;
|
|
85
|
+
disabled?: boolean;
|
|
86
|
+
required?: boolean;
|
|
87
|
+
name?: string;
|
|
88
|
+
id?: string;
|
|
89
|
+
'aria-label'?: string;
|
|
90
|
+
'aria-labelledby'?: string;
|
|
91
|
+
contentClassName?: string;
|
|
92
|
+
}
|
|
93
|
+
declare function Select({ 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, contentClassName, defaultOpen, defaultValue, disabled, id, name, onOpenChange, onValueChange, open, options, placeholder, required, size, value, }: SelectProps): react_jsx_runtime.JSX.Element;
|
|
94
|
+
|
|
95
|
+
type TooltipSide = 'top' | 'right' | 'bottom' | 'left';
|
|
96
|
+
type TooltipAlign = 'start' | 'center' | 'end';
|
|
97
|
+
interface TooltipProps {
|
|
98
|
+
/** The trigger element. It must be able to receive a ref. */
|
|
99
|
+
children: ReactElement;
|
|
100
|
+
/** Content announced and displayed by the tooltip. */
|
|
101
|
+
content: ReactNode;
|
|
102
|
+
/** Controlled open state. */
|
|
103
|
+
open?: boolean;
|
|
104
|
+
/** Initial state when the tooltip is uncontrolled. */
|
|
105
|
+
defaultOpen?: boolean;
|
|
106
|
+
/** Called whenever the open state changes. */
|
|
107
|
+
onOpenChange?: (open: boolean) => void;
|
|
108
|
+
/** Delay before opening from pointer hover, in milliseconds. */
|
|
109
|
+
delayDuration?: number;
|
|
110
|
+
/** Preferred placement relative to the trigger. */
|
|
111
|
+
side?: TooltipSide;
|
|
112
|
+
/** Alignment along the selected side. */
|
|
113
|
+
align?: TooltipAlign;
|
|
114
|
+
/** Gap between the trigger and content. */
|
|
115
|
+
sideOffset?: number;
|
|
116
|
+
/** Extra class for a one-off content customization. */
|
|
117
|
+
contentClassName?: string;
|
|
118
|
+
}
|
|
119
|
+
declare function Tooltip({ align, children, content, contentClassName, defaultOpen, delayDuration, onOpenChange, open, side, sideOffset, }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
120
|
+
|
|
121
|
+
interface UiThemeProps extends HTMLAttributes<HTMLDivElement> {
|
|
122
|
+
/** Theme name contributed by an installed theme package. */
|
|
123
|
+
name: string;
|
|
124
|
+
}
|
|
125
|
+
declare const UiTheme: react.ForwardRefExoticComponent<UiThemeProps & react.RefAttributes<HTMLDivElement>>;
|
|
126
|
+
|
|
127
|
+
export { Button, type ButtonProps, type ButtonSize, type ButtonTone, type ButtonVariant, Dropdown, type DropdownAlign, DropdownCheckboxItem, type DropdownCheckboxItemProps, DropdownItem, type DropdownItemProps, DropdownLabel, type DropdownProps, DropdownSeparator, type DropdownSide, Input, type InputProps, type InputSize, Menu, MenuItem, type MenuItemProps, MenuLabel, type MenuProps, MenuSeparator, Select, type SelectOption, type SelectProps, type SelectSize, Tooltip, type TooltipAlign, type TooltipProps, type TooltipSide, UiTheme, type UiThemeProps };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,410 @@
|
|
|
1
|
+
// src/components/button/button.tsx
|
|
2
|
+
import { forwardRef } from "react";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
var Button = forwardRef(
|
|
5
|
+
function Button2({
|
|
6
|
+
className,
|
|
7
|
+
children,
|
|
8
|
+
disabled,
|
|
9
|
+
loading = false,
|
|
10
|
+
size = "sm",
|
|
11
|
+
tone = "neutral",
|
|
12
|
+
type = "button",
|
|
13
|
+
variant = "primary",
|
|
14
|
+
...props
|
|
15
|
+
}, ref) {
|
|
16
|
+
const classes = ["ui-button", className].filter(Boolean).join(" ");
|
|
17
|
+
return /* @__PURE__ */ jsxs(
|
|
18
|
+
"button",
|
|
19
|
+
{
|
|
20
|
+
...props,
|
|
21
|
+
ref,
|
|
22
|
+
type,
|
|
23
|
+
className: classes,
|
|
24
|
+
disabled: disabled || loading,
|
|
25
|
+
"aria-busy": loading || void 0,
|
|
26
|
+
"data-slot": "root",
|
|
27
|
+
"data-variant": variant,
|
|
28
|
+
"data-size": size,
|
|
29
|
+
"data-tone": tone,
|
|
30
|
+
"data-loading": loading ? "" : void 0,
|
|
31
|
+
children: [
|
|
32
|
+
loading ? /* @__PURE__ */ jsx("span", { className: "ui-button__spinner", "data-slot": "spinner", "aria-hidden": "true" }) : null,
|
|
33
|
+
/* @__PURE__ */ jsx("span", { className: "ui-button__label", "data-slot": "label", children })
|
|
34
|
+
]
|
|
35
|
+
}
|
|
36
|
+
);
|
|
37
|
+
}
|
|
38
|
+
);
|
|
39
|
+
|
|
40
|
+
// src/components/dropdown/dropdown.tsx
|
|
41
|
+
import * as DropdownPrimitive from "@radix-ui/react-dropdown-menu";
|
|
42
|
+
import { forwardRef as forwardRef3 } from "react";
|
|
43
|
+
|
|
44
|
+
// src/theme/ui-theme.tsx
|
|
45
|
+
import { createContext, forwardRef as forwardRef2, useContext } from "react";
|
|
46
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
47
|
+
var UiThemeContext = createContext(void 0);
|
|
48
|
+
function useUiThemeName() {
|
|
49
|
+
return useContext(UiThemeContext);
|
|
50
|
+
}
|
|
51
|
+
var UiTheme = forwardRef2(
|
|
52
|
+
function UiTheme2({ className, name, ...props }, ref) {
|
|
53
|
+
const classes = ["ui-theme", className].filter(Boolean).join(" ");
|
|
54
|
+
return /* @__PURE__ */ jsx2(UiThemeContext.Provider, { value: name, children: /* @__PURE__ */ jsx2(
|
|
55
|
+
"div",
|
|
56
|
+
{
|
|
57
|
+
...props,
|
|
58
|
+
ref,
|
|
59
|
+
className: classes,
|
|
60
|
+
"data-ui-theme": name,
|
|
61
|
+
"data-slot": "theme-root"
|
|
62
|
+
}
|
|
63
|
+
) });
|
|
64
|
+
}
|
|
65
|
+
);
|
|
66
|
+
|
|
67
|
+
// src/components/dropdown/dropdown.tsx
|
|
68
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
69
|
+
function Dropdown({
|
|
70
|
+
align = "start",
|
|
71
|
+
children,
|
|
72
|
+
contentClassName,
|
|
73
|
+
defaultOpen,
|
|
74
|
+
modal = true,
|
|
75
|
+
onOpenChange,
|
|
76
|
+
open,
|
|
77
|
+
side = "bottom",
|
|
78
|
+
sideOffset = 8,
|
|
79
|
+
trigger
|
|
80
|
+
}) {
|
|
81
|
+
const themeName = useUiThemeName();
|
|
82
|
+
const rootProps = {
|
|
83
|
+
modal,
|
|
84
|
+
...open === void 0 ? {} : { open },
|
|
85
|
+
...defaultOpen === void 0 ? {} : { defaultOpen },
|
|
86
|
+
...onOpenChange === void 0 ? {} : { onOpenChange }
|
|
87
|
+
};
|
|
88
|
+
const classes = ["ui-dropdown", contentClassName].filter(Boolean).join(" ");
|
|
89
|
+
return /* @__PURE__ */ jsxs2(DropdownPrimitive.Root, { ...rootProps, children: [
|
|
90
|
+
/* @__PURE__ */ jsx3(DropdownPrimitive.Trigger, { asChild: true, children: trigger }),
|
|
91
|
+
/* @__PURE__ */ jsx3(DropdownPrimitive.Portal, { children: /* @__PURE__ */ jsxs2(
|
|
92
|
+
DropdownPrimitive.Content,
|
|
93
|
+
{
|
|
94
|
+
className: classes,
|
|
95
|
+
"data-slot": "content",
|
|
96
|
+
"data-ui-theme": themeName,
|
|
97
|
+
side,
|
|
98
|
+
align,
|
|
99
|
+
sideOffset,
|
|
100
|
+
collisionPadding: 8,
|
|
101
|
+
children: [
|
|
102
|
+
children,
|
|
103
|
+
/* @__PURE__ */ jsx3(DropdownPrimitive.Arrow, { className: "ui-dropdown__arrow", "data-slot": "arrow" })
|
|
104
|
+
]
|
|
105
|
+
}
|
|
106
|
+
) })
|
|
107
|
+
] });
|
|
108
|
+
}
|
|
109
|
+
var DropdownItem = forwardRef3(
|
|
110
|
+
function DropdownItem2({ className, tone = "neutral", ...props }, ref) {
|
|
111
|
+
const classes = ["ui-menu__item", "ui-dropdown__item", className].filter(Boolean).join(" ");
|
|
112
|
+
return /* @__PURE__ */ jsx3(
|
|
113
|
+
DropdownPrimitive.Item,
|
|
114
|
+
{
|
|
115
|
+
...props,
|
|
116
|
+
ref,
|
|
117
|
+
className: classes,
|
|
118
|
+
"data-slot": "item",
|
|
119
|
+
"data-tone": tone
|
|
120
|
+
}
|
|
121
|
+
);
|
|
122
|
+
}
|
|
123
|
+
);
|
|
124
|
+
var DropdownLabel = forwardRef3(function DropdownLabel2({ className, ...props }, ref) {
|
|
125
|
+
const classes = ["ui-menu__label", className].filter(Boolean).join(" ");
|
|
126
|
+
return /* @__PURE__ */ jsx3(
|
|
127
|
+
DropdownPrimitive.Label,
|
|
128
|
+
{
|
|
129
|
+
...props,
|
|
130
|
+
ref,
|
|
131
|
+
className: classes,
|
|
132
|
+
"data-slot": "label"
|
|
133
|
+
}
|
|
134
|
+
);
|
|
135
|
+
});
|
|
136
|
+
var DropdownSeparator = forwardRef3(function DropdownSeparator2({ className, ...props }, ref) {
|
|
137
|
+
const classes = ["ui-menu__separator", className].filter(Boolean).join(" ");
|
|
138
|
+
return /* @__PURE__ */ jsx3(
|
|
139
|
+
DropdownPrimitive.Separator,
|
|
140
|
+
{
|
|
141
|
+
...props,
|
|
142
|
+
ref,
|
|
143
|
+
className: classes,
|
|
144
|
+
"data-slot": "separator"
|
|
145
|
+
}
|
|
146
|
+
);
|
|
147
|
+
});
|
|
148
|
+
var DropdownCheckboxItem = forwardRef3(function DropdownCheckboxItem2({ children, className, ...props }, ref) {
|
|
149
|
+
const classes = [
|
|
150
|
+
"ui-menu__item",
|
|
151
|
+
"ui-dropdown__item",
|
|
152
|
+
"ui-dropdown__checkbox-item",
|
|
153
|
+
className
|
|
154
|
+
].filter(Boolean).join(" ");
|
|
155
|
+
return /* @__PURE__ */ jsxs2(
|
|
156
|
+
DropdownPrimitive.CheckboxItem,
|
|
157
|
+
{
|
|
158
|
+
...props,
|
|
159
|
+
ref,
|
|
160
|
+
className: classes,
|
|
161
|
+
"data-slot": "checkbox-item",
|
|
162
|
+
children: [
|
|
163
|
+
/* @__PURE__ */ jsx3(
|
|
164
|
+
DropdownPrimitive.ItemIndicator,
|
|
165
|
+
{
|
|
166
|
+
className: "ui-dropdown__indicator",
|
|
167
|
+
"data-slot": "indicator",
|
|
168
|
+
children: "\u2713"
|
|
169
|
+
}
|
|
170
|
+
),
|
|
171
|
+
children
|
|
172
|
+
]
|
|
173
|
+
}
|
|
174
|
+
);
|
|
175
|
+
});
|
|
176
|
+
|
|
177
|
+
// src/components/input/input.tsx
|
|
178
|
+
import { forwardRef as forwardRef4 } from "react";
|
|
179
|
+
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
180
|
+
var Input = forwardRef4(
|
|
181
|
+
function Input2({
|
|
182
|
+
"aria-invalid": ariaInvalid,
|
|
183
|
+
className,
|
|
184
|
+
invalid = false,
|
|
185
|
+
size = "sm",
|
|
186
|
+
...props
|
|
187
|
+
}, ref) {
|
|
188
|
+
const classes = ["ui-input", className].filter(Boolean).join(" ");
|
|
189
|
+
return /* @__PURE__ */ jsx4(
|
|
190
|
+
"input",
|
|
191
|
+
{
|
|
192
|
+
...props,
|
|
193
|
+
ref,
|
|
194
|
+
className: classes,
|
|
195
|
+
"aria-invalid": ariaInvalid ?? (invalid || void 0),
|
|
196
|
+
"data-slot": "root",
|
|
197
|
+
"data-size": size,
|
|
198
|
+
"data-invalid": invalid ? "" : void 0
|
|
199
|
+
}
|
|
200
|
+
);
|
|
201
|
+
}
|
|
202
|
+
);
|
|
203
|
+
|
|
204
|
+
// src/components/menu/menu.tsx
|
|
205
|
+
import * as RovingFocus from "@radix-ui/react-roving-focus";
|
|
206
|
+
import { forwardRef as forwardRef5 } from "react";
|
|
207
|
+
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
208
|
+
var Menu = forwardRef5(
|
|
209
|
+
function Menu2({ className, loop = true, ...props }, ref) {
|
|
210
|
+
const classes = ["ui-menu", className].filter(Boolean).join(" ");
|
|
211
|
+
return /* @__PURE__ */ jsx5(RovingFocus.Root, { asChild: true, orientation: "vertical", loop, children: /* @__PURE__ */ jsx5(
|
|
212
|
+
"div",
|
|
213
|
+
{
|
|
214
|
+
...props,
|
|
215
|
+
ref,
|
|
216
|
+
role: "menu",
|
|
217
|
+
className: classes,
|
|
218
|
+
"data-slot": "root"
|
|
219
|
+
}
|
|
220
|
+
) });
|
|
221
|
+
}
|
|
222
|
+
);
|
|
223
|
+
var MenuItem = forwardRef5(
|
|
224
|
+
function MenuItem2({ className, disabled, tone = "neutral", type = "button", ...props }, ref) {
|
|
225
|
+
const classes = ["ui-menu__item", className].filter(Boolean).join(" ");
|
|
226
|
+
return /* @__PURE__ */ jsx5(RovingFocus.Item, { asChild: true, focusable: !disabled, children: /* @__PURE__ */ jsx5(
|
|
227
|
+
"button",
|
|
228
|
+
{
|
|
229
|
+
...props,
|
|
230
|
+
ref,
|
|
231
|
+
type,
|
|
232
|
+
role: "menuitem",
|
|
233
|
+
className: classes,
|
|
234
|
+
disabled,
|
|
235
|
+
"data-slot": "item",
|
|
236
|
+
"data-tone": tone
|
|
237
|
+
}
|
|
238
|
+
) });
|
|
239
|
+
}
|
|
240
|
+
);
|
|
241
|
+
var MenuLabel = forwardRef5(
|
|
242
|
+
function MenuLabel2({ className, ...props }, ref) {
|
|
243
|
+
const classes = ["ui-menu__label", className].filter(Boolean).join(" ");
|
|
244
|
+
return /* @__PURE__ */ jsx5("div", { ...props, ref, className: classes, "data-slot": "label" });
|
|
245
|
+
}
|
|
246
|
+
);
|
|
247
|
+
var MenuSeparator = forwardRef5(function MenuSeparator2({ className, ...props }, ref) {
|
|
248
|
+
const classes = ["ui-menu__separator", className].filter(Boolean).join(" ");
|
|
249
|
+
return /* @__PURE__ */ jsx5(
|
|
250
|
+
"div",
|
|
251
|
+
{
|
|
252
|
+
...props,
|
|
253
|
+
ref,
|
|
254
|
+
role: "separator",
|
|
255
|
+
className: classes,
|
|
256
|
+
"data-slot": "separator"
|
|
257
|
+
}
|
|
258
|
+
);
|
|
259
|
+
});
|
|
260
|
+
|
|
261
|
+
// src/components/select/select.tsx
|
|
262
|
+
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
263
|
+
import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
264
|
+
function Select({
|
|
265
|
+
"aria-label": ariaLabel,
|
|
266
|
+
"aria-labelledby": ariaLabelledby,
|
|
267
|
+
contentClassName,
|
|
268
|
+
defaultOpen,
|
|
269
|
+
defaultValue,
|
|
270
|
+
disabled,
|
|
271
|
+
id,
|
|
272
|
+
name,
|
|
273
|
+
onOpenChange,
|
|
274
|
+
onValueChange,
|
|
275
|
+
open,
|
|
276
|
+
options,
|
|
277
|
+
placeholder = "Select an option",
|
|
278
|
+
required,
|
|
279
|
+
size = "sm",
|
|
280
|
+
value
|
|
281
|
+
}) {
|
|
282
|
+
const themeName = useUiThemeName();
|
|
283
|
+
const rootProps = {
|
|
284
|
+
...value === void 0 ? {} : { value },
|
|
285
|
+
...defaultValue === void 0 ? {} : { defaultValue },
|
|
286
|
+
...onValueChange === void 0 ? {} : { onValueChange },
|
|
287
|
+
...open === void 0 ? {} : { open },
|
|
288
|
+
...defaultOpen === void 0 ? {} : { defaultOpen },
|
|
289
|
+
...onOpenChange === void 0 ? {} : { onOpenChange },
|
|
290
|
+
...disabled === void 0 ? {} : { disabled },
|
|
291
|
+
...required === void 0 ? {} : { required },
|
|
292
|
+
...name === void 0 ? {} : { name }
|
|
293
|
+
};
|
|
294
|
+
const contentClasses = ["ui-select__content", contentClassName].filter(Boolean).join(" ");
|
|
295
|
+
return /* @__PURE__ */ jsxs3(SelectPrimitive.Root, { ...rootProps, children: [
|
|
296
|
+
/* @__PURE__ */ jsxs3(
|
|
297
|
+
SelectPrimitive.Trigger,
|
|
298
|
+
{
|
|
299
|
+
id,
|
|
300
|
+
className: "ui-select__trigger",
|
|
301
|
+
"data-slot": "trigger",
|
|
302
|
+
"data-size": size,
|
|
303
|
+
"aria-label": ariaLabel,
|
|
304
|
+
"aria-labelledby": ariaLabelledby,
|
|
305
|
+
children: [
|
|
306
|
+
/* @__PURE__ */ jsx6(SelectPrimitive.Value, { placeholder }),
|
|
307
|
+
/* @__PURE__ */ jsx6(SelectPrimitive.Icon, { className: "ui-select__icon", "data-slot": "icon", children: "\u25BE" })
|
|
308
|
+
]
|
|
309
|
+
}
|
|
310
|
+
),
|
|
311
|
+
/* @__PURE__ */ jsx6(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx6(
|
|
312
|
+
SelectPrimitive.Content,
|
|
313
|
+
{
|
|
314
|
+
className: contentClasses,
|
|
315
|
+
"data-slot": "content",
|
|
316
|
+
"data-ui-theme": themeName,
|
|
317
|
+
position: "popper",
|
|
318
|
+
sideOffset: 6,
|
|
319
|
+
collisionPadding: 8,
|
|
320
|
+
children: /* @__PURE__ */ jsx6(
|
|
321
|
+
SelectPrimitive.Viewport,
|
|
322
|
+
{
|
|
323
|
+
className: "ui-select__viewport",
|
|
324
|
+
"data-slot": "viewport",
|
|
325
|
+
children: options.map((option) => /* @__PURE__ */ jsxs3(
|
|
326
|
+
SelectPrimitive.Item,
|
|
327
|
+
{
|
|
328
|
+
value: option.value,
|
|
329
|
+
...option.disabled === void 0 ? {} : { disabled: option.disabled },
|
|
330
|
+
className: "ui-select__item",
|
|
331
|
+
"data-slot": "item",
|
|
332
|
+
children: [
|
|
333
|
+
/* @__PURE__ */ jsx6(SelectPrimitive.ItemText, { children: option.label }),
|
|
334
|
+
/* @__PURE__ */ jsx6(
|
|
335
|
+
SelectPrimitive.ItemIndicator,
|
|
336
|
+
{
|
|
337
|
+
className: "ui-select__indicator",
|
|
338
|
+
"data-slot": "indicator",
|
|
339
|
+
children: "\u2713"
|
|
340
|
+
}
|
|
341
|
+
)
|
|
342
|
+
]
|
|
343
|
+
},
|
|
344
|
+
option.value
|
|
345
|
+
))
|
|
346
|
+
}
|
|
347
|
+
)
|
|
348
|
+
}
|
|
349
|
+
) })
|
|
350
|
+
] });
|
|
351
|
+
}
|
|
352
|
+
|
|
353
|
+
// src/components/tooltip/tooltip.tsx
|
|
354
|
+
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
355
|
+
import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
356
|
+
function Tooltip({
|
|
357
|
+
align = "center",
|
|
358
|
+
children,
|
|
359
|
+
content,
|
|
360
|
+
contentClassName,
|
|
361
|
+
defaultOpen,
|
|
362
|
+
delayDuration = 350,
|
|
363
|
+
onOpenChange,
|
|
364
|
+
open,
|
|
365
|
+
side = "top",
|
|
366
|
+
sideOffset = 8
|
|
367
|
+
}) {
|
|
368
|
+
const themeName = useUiThemeName();
|
|
369
|
+
const rootProps = {
|
|
370
|
+
...open === void 0 ? {} : { open },
|
|
371
|
+
...defaultOpen === void 0 ? {} : { defaultOpen },
|
|
372
|
+
...onOpenChange === void 0 ? {} : { onOpenChange }
|
|
373
|
+
};
|
|
374
|
+
const classes = ["ui-tooltip", contentClassName].filter(Boolean).join(" ");
|
|
375
|
+
return /* @__PURE__ */ jsx7(TooltipPrimitive.Provider, { delayDuration, children: /* @__PURE__ */ jsxs4(TooltipPrimitive.Root, { ...rootProps, children: [
|
|
376
|
+
/* @__PURE__ */ jsx7(TooltipPrimitive.Trigger, { asChild: true, children }),
|
|
377
|
+
/* @__PURE__ */ jsx7(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs4(
|
|
378
|
+
TooltipPrimitive.Content,
|
|
379
|
+
{
|
|
380
|
+
className: classes,
|
|
381
|
+
"data-slot": "content",
|
|
382
|
+
"data-ui-theme": themeName,
|
|
383
|
+
side,
|
|
384
|
+
align,
|
|
385
|
+
sideOffset,
|
|
386
|
+
children: [
|
|
387
|
+
content,
|
|
388
|
+
/* @__PURE__ */ jsx7(TooltipPrimitive.Arrow, { className: "ui-tooltip__arrow", "data-slot": "arrow" })
|
|
389
|
+
]
|
|
390
|
+
}
|
|
391
|
+
) })
|
|
392
|
+
] }) });
|
|
393
|
+
}
|
|
394
|
+
export {
|
|
395
|
+
Button,
|
|
396
|
+
Dropdown,
|
|
397
|
+
DropdownCheckboxItem,
|
|
398
|
+
DropdownItem,
|
|
399
|
+
DropdownLabel,
|
|
400
|
+
DropdownSeparator,
|
|
401
|
+
Input,
|
|
402
|
+
Menu,
|
|
403
|
+
MenuItem,
|
|
404
|
+
MenuLabel,
|
|
405
|
+
MenuSeparator,
|
|
406
|
+
Select,
|
|
407
|
+
Tooltip,
|
|
408
|
+
UiTheme
|
|
409
|
+
};
|
|
410
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/button/button.tsx","../src/components/dropdown/dropdown.tsx","../src/theme/ui-theme.tsx","../src/components/input/input.tsx","../src/components/menu/menu.tsx","../src/components/select/select.tsx","../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport type { ButtonHTMLAttributes } from 'react';\n\nexport type ButtonVariant = 'primary' | 'secondary' | 'ghost';\nexport type ButtonSize = 'xs' | 'mini' | 'sm' | 'lg';\nexport type ButtonTone = 'neutral' | 'danger';\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n /** The visual hierarchy of the action. */\n variant?: ButtonVariant;\n /** The control height and horizontal spacing. */\n size?: ButtonSize;\n /** The semantic intent of the action. */\n tone?: ButtonTone;\n /** Prevents repeated interaction and exposes a busy state to assistive tech. */\n loading?: boolean;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n className,\n children,\n disabled,\n loading = false,\n size = 'sm',\n tone = 'neutral',\n type = 'button',\n variant = 'primary',\n ...props\n },\n ref,\n ) {\n const classes = ['ui-button', className].filter(Boolean).join(' ');\n\n return (\n <button\n {...props}\n ref={ref}\n type={type}\n className={classes}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n data-slot=\"root\"\n data-variant={variant}\n data-size={size}\n data-tone={tone}\n data-loading={loading ? '' : undefined}\n >\n {loading ? (\n <span className=\"ui-button__spinner\" data-slot=\"spinner\" aria-hidden=\"true\" />\n ) : null}\n <span className=\"ui-button__label\" data-slot=\"label\">\n {children}\n </span>\n </button>\n );\n },\n);\n\n","import * as DropdownPrimitive from '@radix-ui/react-dropdown-menu';\nimport { forwardRef } from 'react';\nimport type { ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react';\nimport { useUiThemeName } from '../../theme/ui-theme';\n\nexport type DropdownSide = 'top' | 'right' | 'bottom' | 'left';\nexport type DropdownAlign = 'start' | 'center' | 'end';\n\nexport interface DropdownProps {\n /** The element that opens the dropdown. It must accept a ref. */\n trigger: ReactElement;\n children: ReactNode;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n side?: DropdownSide;\n align?: DropdownAlign;\n sideOffset?: number;\n modal?: boolean;\n contentClassName?: string;\n}\n\nexport function Dropdown({\n align = 'start',\n children,\n contentClassName,\n defaultOpen,\n modal = true,\n onOpenChange,\n open,\n side = 'bottom',\n sideOffset = 8,\n trigger,\n}: DropdownProps) {\n const themeName = useUiThemeName();\n const rootProps: DropdownPrimitive.DropdownMenuProps = {\n modal,\n ...(open === undefined ? {} : { open }),\n ...(defaultOpen === undefined ? {} : { defaultOpen }),\n ...(onOpenChange === undefined ? {} : { onOpenChange }),\n };\n const classes = ['ui-dropdown', contentClassName].filter(Boolean).join(' ');\n\n return (\n <DropdownPrimitive.Root {...rootProps}>\n <DropdownPrimitive.Trigger asChild>{trigger}</DropdownPrimitive.Trigger>\n <DropdownPrimitive.Portal>\n <DropdownPrimitive.Content\n className={classes}\n data-slot=\"content\"\n data-ui-theme={themeName}\n side={side}\n align={align}\n sideOffset={sideOffset}\n collisionPadding={8}\n >\n {children}\n <DropdownPrimitive.Arrow className=\"ui-dropdown__arrow\" data-slot=\"arrow\" />\n </DropdownPrimitive.Content>\n </DropdownPrimitive.Portal>\n </DropdownPrimitive.Root>\n );\n}\n\nexport interface DropdownItemProps\n extends ComponentPropsWithoutRef<typeof DropdownPrimitive.Item> {\n tone?: 'neutral' | 'danger';\n}\n\nexport const DropdownItem = forwardRef<HTMLDivElement, DropdownItemProps>(\n function DropdownItem(\n { className, tone = 'neutral', ...props },\n ref,\n ) {\n const classes = ['ui-menu__item', 'ui-dropdown__item', className]\n .filter(Boolean)\n .join(' ');\n return (\n <DropdownPrimitive.Item\n {...props}\n ref={ref}\n className={classes}\n data-slot=\"item\"\n data-tone={tone}\n />\n );\n },\n);\n\nexport const DropdownLabel = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<typeof DropdownPrimitive.Label>\n>(function DropdownLabel({ className, ...props }, ref) {\n const classes = ['ui-menu__label', className].filter(Boolean).join(' ');\n return (\n <DropdownPrimitive.Label\n {...props}\n ref={ref}\n className={classes}\n data-slot=\"label\"\n />\n );\n});\n\nexport const DropdownSeparator = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<typeof DropdownPrimitive.Separator>\n>(function DropdownSeparator({ className, ...props }, ref) {\n const classes = ['ui-menu__separator', className].filter(Boolean).join(' ');\n return (\n <DropdownPrimitive.Separator\n {...props}\n ref={ref}\n className={classes}\n data-slot=\"separator\"\n />\n );\n});\n\nexport interface DropdownCheckboxItemProps\n extends ComponentPropsWithoutRef<typeof DropdownPrimitive.CheckboxItem> {}\n\nexport const DropdownCheckboxItem = forwardRef<\n HTMLDivElement,\n DropdownCheckboxItemProps\n>(function DropdownCheckboxItem({ children, className, ...props }, ref) {\n const classes = [\n 'ui-menu__item',\n 'ui-dropdown__item',\n 'ui-dropdown__checkbox-item',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n return (\n <DropdownPrimitive.CheckboxItem\n {...props}\n ref={ref}\n className={classes}\n data-slot=\"checkbox-item\"\n >\n <DropdownPrimitive.ItemIndicator\n className=\"ui-dropdown__indicator\"\n data-slot=\"indicator\"\n >\n ✓\n </DropdownPrimitive.ItemIndicator>\n {children}\n </DropdownPrimitive.CheckboxItem>\n );\n});\n\n","import { createContext, forwardRef, useContext } from 'react';\nimport type { HTMLAttributes } from 'react';\n\nexport interface UiThemeProps extends HTMLAttributes<HTMLDivElement> {\n /** Theme name contributed by an installed theme package. */\n name: string;\n}\n\nconst UiThemeContext = createContext<string | undefined>(undefined);\n\nexport function useUiThemeName() {\n return useContext(UiThemeContext);\n}\n\nexport const UiTheme = forwardRef<HTMLDivElement, UiThemeProps>(\n function UiTheme({ className, name, ...props }, ref) {\n const classes = ['ui-theme', className].filter(Boolean).join(' ');\n\n return (\n <UiThemeContext.Provider value={name}>\n <div\n {...props}\n ref={ref}\n className={classes}\n data-ui-theme={name}\n data-slot=\"theme-root\"\n />\n </UiThemeContext.Provider>\n );\n },\n);\n","import { forwardRef } from 'react';\nimport type { InputHTMLAttributes } from 'react';\n\nexport type InputSize = 'xs' | 'mini' | 'sm' | 'lg';\n\nexport interface InputProps\n extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {\n /** The control height and horizontal spacing. */\n size?: InputSize;\n /** Exposes an invalid state visually and to assistive technology. */\n invalid?: boolean;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n function Input(\n {\n 'aria-invalid': ariaInvalid,\n className,\n invalid = false,\n size = 'sm',\n ...props\n },\n ref,\n ) {\n const classes = ['ui-input', className].filter(Boolean).join(' ');\n\n return (\n <input\n {...props}\n ref={ref}\n className={classes}\n aria-invalid={ariaInvalid ?? (invalid || undefined)}\n data-slot=\"root\"\n data-size={size}\n data-invalid={invalid ? '' : undefined}\n />\n );\n },\n);\n\n","import * as RovingFocus from '@radix-ui/react-roving-focus';\nimport { forwardRef } from 'react';\nimport type { ButtonHTMLAttributes, HTMLAttributes } from 'react';\n\nexport interface MenuProps extends HTMLAttributes<HTMLDivElement> {\n /** Whether arrow-key focus wraps from the last item to the first. */\n loop?: boolean;\n}\n\nexport const Menu = forwardRef<HTMLDivElement, MenuProps>(\n function Menu({ className, loop = true, ...props }, ref) {\n const classes = ['ui-menu', className].filter(Boolean).join(' ');\n\n return (\n <RovingFocus.Root asChild orientation=\"vertical\" loop={loop}>\n <div\n {...props}\n ref={ref}\n role=\"menu\"\n className={classes}\n data-slot=\"root\"\n />\n </RovingFocus.Root>\n );\n },\n);\n\nexport interface MenuItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n /** Destructive items use the shared danger semantic token. */\n tone?: 'neutral' | 'danger';\n}\n\nexport const MenuItem = forwardRef<HTMLButtonElement, MenuItemProps>(\n function MenuItem(\n { className, disabled, tone = 'neutral', type = 'button', ...props },\n ref,\n ) {\n const classes = ['ui-menu__item', className].filter(Boolean).join(' ');\n\n return (\n <RovingFocus.Item asChild focusable={!disabled}>\n <button\n {...props}\n ref={ref}\n type={type}\n role=\"menuitem\"\n className={classes}\n disabled={disabled}\n data-slot=\"item\"\n data-tone={tone}\n />\n </RovingFocus.Item>\n );\n },\n);\n\nexport const MenuLabel = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(\n function MenuLabel({ className, ...props }, ref) {\n const classes = ['ui-menu__label', className].filter(Boolean).join(' ');\n return <div {...props} ref={ref} className={classes} data-slot=\"label\" />;\n },\n);\n\nexport const MenuSeparator = forwardRef<\n HTMLDivElement,\n HTMLAttributes<HTMLDivElement>\n>(function MenuSeparator({ className, ...props }, ref) {\n const classes = ['ui-menu__separator', className].filter(Boolean).join(' ');\n return (\n <div\n {...props}\n ref={ref}\n role=\"separator\"\n className={classes}\n data-slot=\"separator\"\n />\n );\n});\n\n","import * as SelectPrimitive from '@radix-ui/react-select';\nimport type { ReactNode } from 'react';\nimport { useUiThemeName } from '../../theme/ui-theme';\n\nexport type SelectSize = 'xs' | 'mini' | 'sm' | 'lg';\n\nexport interface SelectOption {\n value: string;\n label: ReactNode;\n disabled?: boolean;\n}\n\nexport interface SelectProps {\n options: readonly SelectOption[];\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n placeholder?: ReactNode;\n size?: SelectSize;\n disabled?: boolean;\n required?: boolean;\n name?: string;\n id?: string;\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n contentClassName?: string;\n}\n\nexport function Select({\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n contentClassName,\n defaultOpen,\n defaultValue,\n disabled,\n id,\n name,\n onOpenChange,\n onValueChange,\n open,\n options,\n placeholder = 'Select an option',\n required,\n size = 'sm',\n value,\n}: SelectProps) {\n const themeName = useUiThemeName();\n const rootProps: SelectPrimitive.SelectProps = {\n ...(value === undefined ? {} : { value }),\n ...(defaultValue === undefined ? {} : { defaultValue }),\n ...(onValueChange === undefined ? {} : { onValueChange }),\n ...(open === undefined ? {} : { open }),\n ...(defaultOpen === undefined ? {} : { defaultOpen }),\n ...(onOpenChange === undefined ? {} : { onOpenChange }),\n ...(disabled === undefined ? {} : { disabled }),\n ...(required === undefined ? {} : { required }),\n ...(name === undefined ? {} : { name }),\n };\n const contentClasses = ['ui-select__content', contentClassName]\n .filter(Boolean)\n .join(' ');\n\n return (\n <SelectPrimitive.Root {...rootProps}>\n <SelectPrimitive.Trigger\n id={id}\n className=\"ui-select__trigger\"\n data-slot=\"trigger\"\n data-size={size}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby}\n >\n <SelectPrimitive.Value placeholder={placeholder} />\n <SelectPrimitive.Icon className=\"ui-select__icon\" data-slot=\"icon\">\n ▾\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n className={contentClasses}\n data-slot=\"content\"\n data-ui-theme={themeName}\n position=\"popper\"\n sideOffset={6}\n collisionPadding={8}\n >\n <SelectPrimitive.Viewport\n className=\"ui-select__viewport\"\n data-slot=\"viewport\"\n >\n {options.map((option) => (\n <SelectPrimitive.Item\n key={option.value}\n value={option.value}\n {...(option.disabled === undefined\n ? {}\n : { disabled: option.disabled })}\n className=\"ui-select__item\"\n data-slot=\"item\"\n >\n <SelectPrimitive.ItemText>{option.label}</SelectPrimitive.ItemText>\n <SelectPrimitive.ItemIndicator\n className=\"ui-select__indicator\"\n data-slot=\"indicator\"\n >\n ✓\n </SelectPrimitive.ItemIndicator>\n </SelectPrimitive.Item>\n ))}\n </SelectPrimitive.Viewport>\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n </SelectPrimitive.Root>\n );\n}\n","import * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport type { ReactElement, ReactNode } from 'react';\nimport { useUiThemeName } from '../../theme/ui-theme';\n\nexport type TooltipSide = 'top' | 'right' | 'bottom' | 'left';\nexport type TooltipAlign = 'start' | 'center' | 'end';\n\nexport interface TooltipProps {\n /** The trigger element. It must be able to receive a ref. */\n children: ReactElement;\n /** Content announced and displayed by the tooltip. */\n content: ReactNode;\n /** Controlled open state. */\n open?: boolean;\n /** Initial state when the tooltip is uncontrolled. */\n defaultOpen?: boolean;\n /** Called whenever the open state changes. */\n onOpenChange?: (open: boolean) => void;\n /** Delay before opening from pointer hover, in milliseconds. */\n delayDuration?: number;\n /** Preferred placement relative to the trigger. */\n side?: TooltipSide;\n /** Alignment along the selected side. */\n align?: TooltipAlign;\n /** Gap between the trigger and content. */\n sideOffset?: number;\n /** Extra class for a one-off content customization. */\n contentClassName?: string;\n}\n\nexport function Tooltip({\n align = 'center',\n children,\n content,\n contentClassName,\n defaultOpen,\n delayDuration = 350,\n onOpenChange,\n open,\n side = 'top',\n sideOffset = 8,\n}: TooltipProps) {\n const themeName = useUiThemeName();\n const rootProps: TooltipPrimitive.TooltipProps = {\n ...(open === undefined ? {} : { open }),\n ...(defaultOpen === undefined ? {} : { defaultOpen }),\n ...(onOpenChange === undefined ? {} : { onOpenChange }),\n };\n const classes = ['ui-tooltip', contentClassName].filter(Boolean).join(' ');\n\n return (\n <TooltipPrimitive.Provider delayDuration={delayDuration}>\n <TooltipPrimitive.Root {...rootProps}>\n <TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Content\n className={classes}\n data-slot=\"content\"\n data-ui-theme={themeName}\n side={side}\n align={align}\n sideOffset={sideOffset}\n >\n {content}\n <TooltipPrimitive.Arrow className=\"ui-tooltip__arrow\" data-slot=\"arrow\" />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.Provider>\n );\n}\n"],"mappings":"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","names":["Button","forwardRef","forwardRef","jsx","UiTheme","jsx","jsxs","forwardRef","DropdownItem","DropdownLabel","DropdownSeparator","DropdownCheckboxItem","forwardRef","jsx","Input","forwardRef","jsx","Menu","MenuItem","MenuLabel","MenuSeparator","jsx","jsxs","jsx","jsxs"]}
|
package/package.json
ADDED
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@easyv/theme-variables-react",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "Accessible React components powered by EasyV theme variables",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"sideEffects": false,
|
|
7
|
+
"main": "./dist/index.cjs",
|
|
8
|
+
"module": "./dist/index.js",
|
|
9
|
+
"types": "./dist/index.d.ts",
|
|
10
|
+
"exports": {
|
|
11
|
+
".": {
|
|
12
|
+
"types": "./dist/index.d.ts",
|
|
13
|
+
"import": "./dist/index.js",
|
|
14
|
+
"require": "./dist/index.cjs"
|
|
15
|
+
}
|
|
16
|
+
},
|
|
17
|
+
"files": [
|
|
18
|
+
"dist"
|
|
19
|
+
],
|
|
20
|
+
"publishConfig": {
|
|
21
|
+
"access": "public"
|
|
22
|
+
},
|
|
23
|
+
"dependencies": {
|
|
24
|
+
"@radix-ui/react-dropdown-menu": "2.1.18",
|
|
25
|
+
"@radix-ui/react-roving-focus": "1.1.13",
|
|
26
|
+
"@radix-ui/react-select": "2.3.1",
|
|
27
|
+
"@radix-ui/react-tooltip": "1.2.10"
|
|
28
|
+
},
|
|
29
|
+
"peerDependencies": {
|
|
30
|
+
"react": ">=18.2",
|
|
31
|
+
"react-dom": ">=18.2"
|
|
32
|
+
},
|
|
33
|
+
"devDependencies": {
|
|
34
|
+
"@testing-library/jest-dom": "6.6.3",
|
|
35
|
+
"@testing-library/react": "16.1.0",
|
|
36
|
+
"@testing-library/user-event": "14.5.2",
|
|
37
|
+
"@types/react": "18.3.18",
|
|
38
|
+
"@types/react-dom": "18.3.5",
|
|
39
|
+
"@vitejs/plugin-react": "4.3.4",
|
|
40
|
+
"jsdom": "25.0.1",
|
|
41
|
+
"react": "18.3.1",
|
|
42
|
+
"react-dom": "18.3.1",
|
|
43
|
+
"tsup": "8.3.5",
|
|
44
|
+
"typescript": "5.7.3",
|
|
45
|
+
"vite": "5.4.14",
|
|
46
|
+
"vitest": "2.1.8"
|
|
47
|
+
},
|
|
48
|
+
"scripts": {
|
|
49
|
+
"build": "tsup",
|
|
50
|
+
"test": "vitest run",
|
|
51
|
+
"test:watch": "vitest",
|
|
52
|
+
"typecheck": "tsc --noEmit"
|
|
53
|
+
}
|
|
54
|
+
}
|