@fairmint/ui 0.1.7 → 0.2.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/components/ErrorFallback/ErrorFallback.d.ts.map +1 -1
- package/dist/components/layout/PageHeader/PageHeader.d.ts.map +1 -1
- package/dist/components/primitives/index.d.ts +19 -0
- package/dist/components/primitives/index.d.ts.map +1 -0
- package/dist/fairmint-ui.cjs +100 -100
- package/dist/fairmint-ui.cjs.map +1 -1
- package/dist/fairmint-ui.js +100 -100
- package/dist/fairmint-ui.js.map +1 -1
- package/dist/theme/index.d.ts +11 -11
- package/package.json +2 -1
package/dist/fairmint-ui.js
CHANGED
|
@@ -17358,6 +17358,105 @@ const Title = factory((_props, ref) => {
|
|
|
17358
17358
|
});
|
|
17359
17359
|
Title.classes = classes$1;
|
|
17360
17360
|
Title.displayName = "@mantine/core/Title";
|
|
17361
|
+
const colors = {
|
|
17362
|
+
/** Primary UI color — buttons, links, active states. */
|
|
17363
|
+
primary: "indigo",
|
|
17364
|
+
/** Fairmint brand blue — gradients, brand elements. */
|
|
17365
|
+
brandBlue: "fairmintBlue",
|
|
17366
|
+
/** Fairmint brand purple — gradients, brand elements. */
|
|
17367
|
+
brandPurple: "fairmintPurple",
|
|
17368
|
+
/** Positive outcome — completed, approved, active. */
|
|
17369
|
+
success: "success",
|
|
17370
|
+
/** Caution — pending, processing, review. */
|
|
17371
|
+
warning: "warning",
|
|
17372
|
+
/** Negative outcome — failed, rejected, cancelled. */
|
|
17373
|
+
error: "error",
|
|
17374
|
+
/** Informational — neutral status messages. */
|
|
17375
|
+
info: "info",
|
|
17376
|
+
/** Neutral gray scale — borders, backgrounds, disabled. */
|
|
17377
|
+
neutral: "gray",
|
|
17378
|
+
/** Accent color 1 for avatar palette. */
|
|
17379
|
+
accent1: "teal",
|
|
17380
|
+
/** Accent color 2 for avatar palette. */
|
|
17381
|
+
accent2: "cyan",
|
|
17382
|
+
/** Accent color 3 for avatar palette. */
|
|
17383
|
+
accent3: "green"
|
|
17384
|
+
};
|
|
17385
|
+
const AVATAR_PALETTE = [
|
|
17386
|
+
colors.primary,
|
|
17387
|
+
colors.brandBlue,
|
|
17388
|
+
colors.brandPurple,
|
|
17389
|
+
colors.success,
|
|
17390
|
+
colors.info,
|
|
17391
|
+
colors.accent1,
|
|
17392
|
+
colors.accent2,
|
|
17393
|
+
colors.accent3
|
|
17394
|
+
];
|
|
17395
|
+
const ActionIcon = forwardRef((props, ref) => /* @__PURE__ */ jsx(ActionIcon$1, { color: colors.primary, variant: "subtle", ...props, ref }));
|
|
17396
|
+
ActionIcon.displayName = "ActionIcon";
|
|
17397
|
+
function Alert(props) {
|
|
17398
|
+
return /* @__PURE__ */ jsx(Alert$1, { ...props });
|
|
17399
|
+
}
|
|
17400
|
+
const Avatar = forwardRef((props, ref) => /* @__PURE__ */ jsx(Avatar$1, { radius: "md", color: colors.primary, ...props, ref }));
|
|
17401
|
+
Avatar.displayName = "Avatar";
|
|
17402
|
+
const Badge = forwardRef((props, ref) => /* @__PURE__ */ jsx(Badge$1, { variant: "light", ...props, ref }));
|
|
17403
|
+
Badge.displayName = "Badge";
|
|
17404
|
+
const Button = forwardRef((props, ref) => /* @__PURE__ */ jsx(Button$1, { color: colors.primary, ...props, ref }));
|
|
17405
|
+
Button.displayName = "Button";
|
|
17406
|
+
const Card = forwardRef((props, ref) => /* @__PURE__ */ jsx(Card$1, { padding: "lg", radius: "xl", withBorder: true, ...props, ref }));
|
|
17407
|
+
Card.displayName = "Card";
|
|
17408
|
+
const Checkbox = forwardRef((props, ref) => /* @__PURE__ */ jsx(Checkbox$1, { color: colors.primary, ...props, ref }));
|
|
17409
|
+
Checkbox.displayName = "Checkbox";
|
|
17410
|
+
function Drawer(props) {
|
|
17411
|
+
return /* @__PURE__ */ jsx(Drawer$1, { position: "right", size: "lg", p: "lg", ...props });
|
|
17412
|
+
}
|
|
17413
|
+
function MenuBase(props) {
|
|
17414
|
+
return /* @__PURE__ */ jsx(Menu$1, { shadow: "md", ...props });
|
|
17415
|
+
}
|
|
17416
|
+
const Menu = Object.assign(MenuBase, {
|
|
17417
|
+
Target: Menu$1.Target,
|
|
17418
|
+
Dropdown: Menu$1.Dropdown,
|
|
17419
|
+
Item: Menu$1.Item,
|
|
17420
|
+
Label: Menu$1.Label,
|
|
17421
|
+
Divider: Menu$1.Divider
|
|
17422
|
+
});
|
|
17423
|
+
function Modal(props) {
|
|
17424
|
+
return /* @__PURE__ */ jsx(Modal$1, { centered: true, radius: "lg", ...props });
|
|
17425
|
+
}
|
|
17426
|
+
const PasswordInput = forwardRef((props, ref) => /* @__PURE__ */ jsx(PasswordInput$1, { size: "md", ...props, ref }));
|
|
17427
|
+
PasswordInput.displayName = "PasswordInput";
|
|
17428
|
+
const Select = forwardRef((props, ref) => /* @__PURE__ */ jsx(Select$1, { size: "md", ...props, ref }));
|
|
17429
|
+
Select.displayName = "Select";
|
|
17430
|
+
function Skeleton(props) {
|
|
17431
|
+
return /* @__PURE__ */ jsx(Skeleton$1, { ...props });
|
|
17432
|
+
}
|
|
17433
|
+
const Switch = forwardRef((props, ref) => /* @__PURE__ */ jsx(Switch$1, { color: colors.primary, ...props, ref }));
|
|
17434
|
+
Switch.displayName = "Switch";
|
|
17435
|
+
function TableBase(props) {
|
|
17436
|
+
return /* @__PURE__ */ jsx(Table$1, { ...props });
|
|
17437
|
+
}
|
|
17438
|
+
const Table = Object.assign(TableBase, {
|
|
17439
|
+
Thead: Table$1.Thead,
|
|
17440
|
+
Tbody: Table$1.Tbody,
|
|
17441
|
+
Tr: Table$1.Tr,
|
|
17442
|
+
Th: Table$1.Th,
|
|
17443
|
+
Td: Table$1.Td,
|
|
17444
|
+
Tfoot: Table$1.Tfoot,
|
|
17445
|
+
Caption: Table$1.Caption
|
|
17446
|
+
});
|
|
17447
|
+
function TabsBase(props) {
|
|
17448
|
+
return /* @__PURE__ */ jsx(Tabs$1, { color: colors.primary, ...props });
|
|
17449
|
+
}
|
|
17450
|
+
const Tabs = Object.assign(TabsBase, {
|
|
17451
|
+
List: Tabs$1.List,
|
|
17452
|
+
Tab: Tabs$1.Tab,
|
|
17453
|
+
Panel: Tabs$1.Panel
|
|
17454
|
+
});
|
|
17455
|
+
const TextInput = forwardRef((props, ref) => /* @__PURE__ */ jsx(TextInput$1, { size: "md", ...props, ref }));
|
|
17456
|
+
TextInput.displayName = "TextInput";
|
|
17457
|
+
function Tooltip(props) {
|
|
17458
|
+
return /* @__PURE__ */ jsx(Tooltip$1, { ...props });
|
|
17459
|
+
}
|
|
17361
17460
|
function ErrorFallback({
|
|
17362
17461
|
title = "Something went wrong",
|
|
17363
17462
|
description = "We've been notified and are working on a fix.",
|
|
@@ -17372,7 +17471,7 @@ function ErrorFallback({
|
|
|
17372
17471
|
return /* @__PURE__ */ jsx(Container, { size: "sm", py: "xl", children: /* @__PURE__ */ jsxs(Stack, { align: "center", gap: "md", children: [
|
|
17373
17472
|
/* @__PURE__ */ jsx(Title, { order: 2, children: title }),
|
|
17374
17473
|
/* @__PURE__ */ jsx(Text, { c: "dimmed", children: description }),
|
|
17375
|
-
/* @__PURE__ */ jsx(Button
|
|
17474
|
+
/* @__PURE__ */ jsx(Button, { onClick: handleAction, children: actionLabel })
|
|
17376
17475
|
] }) });
|
|
17377
17476
|
}
|
|
17378
17477
|
function FairmintLogo({
|
|
@@ -19382,40 +19481,6 @@ Notifications.update = notifications.update;
|
|
|
19382
19481
|
Notifications.clean = notifications.clean;
|
|
19383
19482
|
Notifications.cleanQueue = notifications.cleanQueue;
|
|
19384
19483
|
Notifications.updateState = notifications.updateState;
|
|
19385
|
-
const colors = {
|
|
19386
|
-
/** Primary UI color — buttons, links, active states. */
|
|
19387
|
-
primary: "indigo",
|
|
19388
|
-
/** Fairmint brand blue — gradients, brand elements. */
|
|
19389
|
-
brandBlue: "fairmintBlue",
|
|
19390
|
-
/** Fairmint brand purple — gradients, brand elements. */
|
|
19391
|
-
brandPurple: "fairmintPurple",
|
|
19392
|
-
/** Positive outcome — completed, approved, active. */
|
|
19393
|
-
success: "success",
|
|
19394
|
-
/** Caution — pending, processing, review. */
|
|
19395
|
-
warning: "warning",
|
|
19396
|
-
/** Negative outcome — failed, rejected, cancelled. */
|
|
19397
|
-
error: "error",
|
|
19398
|
-
/** Informational — neutral status messages. */
|
|
19399
|
-
info: "info",
|
|
19400
|
-
/** Neutral gray scale — borders, backgrounds, disabled. */
|
|
19401
|
-
neutral: "gray",
|
|
19402
|
-
/** Accent color 1 for avatar palette. */
|
|
19403
|
-
accent1: "teal",
|
|
19404
|
-
/** Accent color 2 for avatar palette. */
|
|
19405
|
-
accent2: "cyan",
|
|
19406
|
-
/** Accent color 3 for avatar palette. */
|
|
19407
|
-
accent3: "green"
|
|
19408
|
-
};
|
|
19409
|
-
const AVATAR_PALETTE = [
|
|
19410
|
-
colors.primary,
|
|
19411
|
-
colors.brandBlue,
|
|
19412
|
-
colors.brandPurple,
|
|
19413
|
-
colors.success,
|
|
19414
|
-
colors.info,
|
|
19415
|
-
colors.accent1,
|
|
19416
|
-
colors.accent2,
|
|
19417
|
-
colors.accent3
|
|
19418
|
-
];
|
|
19419
19484
|
const indigo = [
|
|
19420
19485
|
"#EEF2FF",
|
|
19421
19486
|
"#E0E7FF",
|
|
@@ -23193,8 +23258,6 @@ ZodEnum.create;
|
|
|
23193
23258
|
ZodPromise.create;
|
|
23194
23259
|
ZodOptional.create;
|
|
23195
23260
|
ZodNullable.create;
|
|
23196
|
-
const TextInput = forwardRef((props, ref) => /* @__PURE__ */ jsx(TextInput$1, { size: "md", ...props, ref }));
|
|
23197
|
-
TextInput.displayName = "TextInput";
|
|
23198
23261
|
const emailSchema = stringType().email("Please enter a valid email address");
|
|
23199
23262
|
function EmailField({ error: error2, ...rest }) {
|
|
23200
23263
|
return /* @__PURE__ */ jsx(
|
|
@@ -24271,8 +24334,6 @@ function FormField({
|
|
|
24271
24334
|
children && description && !inputProps.error && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: description })
|
|
24272
24335
|
] });
|
|
24273
24336
|
}
|
|
24274
|
-
const PasswordInput = forwardRef((props, ref) => /* @__PURE__ */ jsx(PasswordInput$1, { size: "md", ...props, ref }));
|
|
24275
|
-
PasswordInput.displayName = "PasswordInput";
|
|
24276
24337
|
const passwordSchema = stringType().min(8, "Password must be at least 8 characters");
|
|
24277
24338
|
function PasswordField({ error: error2, ...rest }) {
|
|
24278
24339
|
return /* @__PURE__ */ jsx(
|
|
@@ -24322,11 +24383,6 @@ function AnimateIn({
|
|
|
24322
24383
|
};
|
|
24323
24384
|
return /* @__PURE__ */ jsx("div", { style, className, children });
|
|
24324
24385
|
}
|
|
24325
|
-
const Button = forwardRef((props, ref) => /* @__PURE__ */ jsx(Button$1, { color: colors.primary, ...props, ref }));
|
|
24326
|
-
Button.displayName = "Button";
|
|
24327
|
-
function Modal(props) {
|
|
24328
|
-
return /* @__PURE__ */ jsx(Modal$1, { centered: true, radius: "lg", ...props });
|
|
24329
|
-
}
|
|
24330
24386
|
function ConfirmDialog({
|
|
24331
24387
|
title,
|
|
24332
24388
|
message,
|
|
@@ -24407,21 +24463,6 @@ function Currency({ value, precise = false, currency, ...rest }) {
|
|
|
24407
24463
|
}
|
|
24408
24464
|
return /* @__PURE__ */ jsx(Text, { component: "span", ...rest, children: formatted });
|
|
24409
24465
|
}
|
|
24410
|
-
function Skeleton(props) {
|
|
24411
|
-
return /* @__PURE__ */ jsx(Skeleton$1, { ...props });
|
|
24412
|
-
}
|
|
24413
|
-
function TableBase(props) {
|
|
24414
|
-
return /* @__PURE__ */ jsx(Table$1, { ...props });
|
|
24415
|
-
}
|
|
24416
|
-
const Table = Object.assign(TableBase, {
|
|
24417
|
-
Thead: Table$1.Thead,
|
|
24418
|
-
Tbody: Table$1.Tbody,
|
|
24419
|
-
Tr: Table$1.Tr,
|
|
24420
|
-
Th: Table$1.Th,
|
|
24421
|
-
Td: Table$1.Td,
|
|
24422
|
-
Tfoot: Table$1.Tfoot,
|
|
24423
|
-
Caption: Table$1.Caption
|
|
24424
|
-
});
|
|
24425
24466
|
function EmptyState({
|
|
24426
24467
|
icon,
|
|
24427
24468
|
title,
|
|
@@ -24530,9 +24571,6 @@ function DataTable({
|
|
|
24530
24571
|
function DateDisplay({ value, ...rest }) {
|
|
24531
24572
|
return /* @__PURE__ */ jsx(Text, { component: "span", ...rest, children: formatDate(value) });
|
|
24532
24573
|
}
|
|
24533
|
-
function Drawer(props) {
|
|
24534
|
-
return /* @__PURE__ */ jsx(Drawer$1, { position: "right", size: "lg", p: "lg", ...props });
|
|
24535
|
-
}
|
|
24536
24574
|
function DetailDrawer({
|
|
24537
24575
|
title,
|
|
24538
24576
|
opened,
|
|
@@ -24555,8 +24593,6 @@ function DetailDrawer({
|
|
|
24555
24593
|
}
|
|
24556
24594
|
);
|
|
24557
24595
|
}
|
|
24558
|
-
const Avatar = forwardRef((props, ref) => /* @__PURE__ */ jsx(Avatar$1, { radius: "md", color: colors.primary, ...props, ref }));
|
|
24559
|
-
Avatar.displayName = "Avatar";
|
|
24560
24596
|
const DefaultChevronIcon = () => /* @__PURE__ */ jsx(
|
|
24561
24597
|
"svg",
|
|
24562
24598
|
{
|
|
@@ -24651,8 +24687,6 @@ function ListRow({
|
|
|
24651
24687
|
function Percent({ value, decimals = 2, ...rest }) {
|
|
24652
24688
|
return /* @__PURE__ */ jsx(Text, { component: "span", ...rest, children: formatPercent(value, decimals) });
|
|
24653
24689
|
}
|
|
24654
|
-
const ActionIcon = forwardRef((props, ref) => /* @__PURE__ */ jsx(ActionIcon$1, { color: colors.primary, variant: "subtle", ...props, ref }));
|
|
24655
|
-
ActionIcon.displayName = "ActionIcon";
|
|
24656
24690
|
function SearchInput({
|
|
24657
24691
|
value,
|
|
24658
24692
|
onChange,
|
|
@@ -24725,8 +24759,6 @@ function SearchInput({
|
|
|
24725
24759
|
}
|
|
24726
24760
|
);
|
|
24727
24761
|
}
|
|
24728
|
-
const Card = forwardRef((props, ref) => /* @__PURE__ */ jsx(Card$1, { padding: "lg", radius: "xl", withBorder: true, ...props, ref }));
|
|
24729
|
-
Card.displayName = "Card";
|
|
24730
24762
|
function StatCard({
|
|
24731
24763
|
label,
|
|
24732
24764
|
value,
|
|
@@ -24762,8 +24794,6 @@ function StatCard({
|
|
|
24762
24794
|
}
|
|
24763
24795
|
);
|
|
24764
24796
|
}
|
|
24765
|
-
const Badge = forwardRef((props, ref) => /* @__PURE__ */ jsx(Badge$1, { variant: "light", ...props, ref }));
|
|
24766
|
-
Badge.displayName = "Badge";
|
|
24767
24797
|
const DEFAULT_COLOR_MAP = {
|
|
24768
24798
|
active: colors.success,
|
|
24769
24799
|
approved: colors.success,
|
|
@@ -24912,36 +24942,6 @@ function UserMenu({
|
|
|
24912
24942
|
] }, item.id)) })
|
|
24913
24943
|
] });
|
|
24914
24944
|
}
|
|
24915
|
-
function Alert(props) {
|
|
24916
|
-
return /* @__PURE__ */ jsx(Alert$1, { ...props });
|
|
24917
|
-
}
|
|
24918
|
-
const Checkbox = forwardRef((props, ref) => /* @__PURE__ */ jsx(Checkbox$1, { color: colors.primary, ...props, ref }));
|
|
24919
|
-
Checkbox.displayName = "Checkbox";
|
|
24920
|
-
function MenuBase(props) {
|
|
24921
|
-
return /* @__PURE__ */ jsx(Menu$1, { shadow: "md", ...props });
|
|
24922
|
-
}
|
|
24923
|
-
const Menu = Object.assign(MenuBase, {
|
|
24924
|
-
Target: Menu$1.Target,
|
|
24925
|
-
Dropdown: Menu$1.Dropdown,
|
|
24926
|
-
Item: Menu$1.Item,
|
|
24927
|
-
Label: Menu$1.Label,
|
|
24928
|
-
Divider: Menu$1.Divider
|
|
24929
|
-
});
|
|
24930
|
-
const Select = forwardRef((props, ref) => /* @__PURE__ */ jsx(Select$1, { size: "md", ...props, ref }));
|
|
24931
|
-
Select.displayName = "Select";
|
|
24932
|
-
const Switch = forwardRef((props, ref) => /* @__PURE__ */ jsx(Switch$1, { color: colors.primary, ...props, ref }));
|
|
24933
|
-
Switch.displayName = "Switch";
|
|
24934
|
-
function TabsBase(props) {
|
|
24935
|
-
return /* @__PURE__ */ jsx(Tabs$1, { color: colors.primary, ...props });
|
|
24936
|
-
}
|
|
24937
|
-
const Tabs = Object.assign(TabsBase, {
|
|
24938
|
-
List: Tabs$1.List,
|
|
24939
|
-
Tab: Tabs$1.Tab,
|
|
24940
|
-
Panel: Tabs$1.Panel
|
|
24941
|
-
});
|
|
24942
|
-
function Tooltip(props) {
|
|
24943
|
-
return /* @__PURE__ */ jsx(Tooltip$1, { ...props });
|
|
24944
|
-
}
|
|
24945
24945
|
function DocumentRow({
|
|
24946
24946
|
name,
|
|
24947
24947
|
type,
|