@mlw-packages/react-components 1.3.11 → 1.3.12
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.css +6 -0
- package/dist/index.d.mts +16 -20
- package/dist/index.d.ts +16 -20
- package/dist/index.js +7 -5
- package/dist/index.mjs +7 -5
- package/package.json +1 -1
package/dist/index.css
CHANGED
|
@@ -582,6 +582,9 @@ body {
|
|
|
582
582
|
.mr-5 {
|
|
583
583
|
margin-right: 1.25rem;
|
|
584
584
|
}
|
|
585
|
+
.mt-0\.5 {
|
|
586
|
+
margin-top: 0.125rem;
|
|
587
|
+
}
|
|
585
588
|
.mt-1 {
|
|
586
589
|
margin-top: 0.25rem;
|
|
587
590
|
}
|
|
@@ -801,6 +804,9 @@ body {
|
|
|
801
804
|
.w-4 {
|
|
802
805
|
width: 1rem;
|
|
803
806
|
}
|
|
807
|
+
.w-40 {
|
|
808
|
+
width: 10rem;
|
|
809
|
+
}
|
|
804
810
|
.w-44 {
|
|
805
811
|
width: 11rem;
|
|
806
812
|
}
|
package/dist/index.d.mts
CHANGED
|
@@ -3,6 +3,7 @@ import * as React$1 from 'react';
|
|
|
3
3
|
import React__default from 'react';
|
|
4
4
|
import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
|
|
5
5
|
import * as AvatarPrimitive from '@radix-ui/react-avatar';
|
|
6
|
+
import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
|
|
6
7
|
import { VariantProps } from 'class-variance-authority';
|
|
7
8
|
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
|
|
8
9
|
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
@@ -45,12 +46,10 @@ declare const AvatarBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive
|
|
|
45
46
|
declare const AvatarImageBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React$1.RefAttributes<HTMLImageElement>, "ref"> & React$1.RefAttributes<HTMLImageElement>>;
|
|
46
47
|
declare const AvatarFallbackBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
|
|
47
48
|
|
|
48
|
-
declare const buttonVariantsBase: (props?: (
|
|
49
|
-
variant
|
|
50
|
-
size
|
|
51
|
-
}
|
|
52
|
-
className?: string;
|
|
53
|
-
}) | undefined) => string;
|
|
49
|
+
declare const buttonVariantsBase: (props?: ({
|
|
50
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
|
|
51
|
+
size?: "default" | "sm" | "lg" | "icon" | null | undefined;
|
|
52
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
54
53
|
interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariantsBase> {
|
|
55
54
|
asChild?: boolean;
|
|
56
55
|
}
|
|
@@ -275,11 +274,9 @@ declare const SheetTriggerBase: React$1.ForwardRefExoticComponent<DialogPrimitiv
|
|
|
275
274
|
declare const SheetCloseBase: React$1.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
276
275
|
declare const SheetPortalBase: React$1.FC<DialogPrimitive.DialogPortalProps>;
|
|
277
276
|
declare const SheetOverlayBase: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
278
|
-
declare const sheetVariants: (props?: (
|
|
279
|
-
side
|
|
280
|
-
}
|
|
281
|
-
className?: string;
|
|
282
|
-
}) | undefined) => string;
|
|
277
|
+
declare const sheetVariants: (props?: ({
|
|
278
|
+
side?: "bottom" | "left" | "right" | "top" | null | undefined;
|
|
279
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
283
280
|
interface SheetContentProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof sheetVariants> {
|
|
284
281
|
}
|
|
285
282
|
declare const SheetContentBase: React$1.ForwardRefExoticComponent<SheetContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
@@ -342,12 +339,10 @@ declare const SidebarMenuButtonBase: React$1.ForwardRefExoticComponent<Omit<Reac
|
|
|
342
339
|
asChild?: boolean;
|
|
343
340
|
isActive?: boolean;
|
|
344
341
|
tooltip?: string | React$1.ComponentProps<typeof TooltipContentBase>;
|
|
345
|
-
} &
|
|
346
|
-
variant
|
|
347
|
-
size
|
|
348
|
-
}> &
|
|
349
|
-
className?: string;
|
|
350
|
-
}, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
342
|
+
} & VariantProps<(props?: ({
|
|
343
|
+
variant?: "default" | "outline" | null | undefined;
|
|
344
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
345
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
351
346
|
declare const SidebarMenuActionBase: React$1.ForwardRefExoticComponent<Omit<React$1.ClassAttributes<HTMLButtonElement> & React$1.ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
352
347
|
asChild?: boolean;
|
|
353
348
|
showOnHover?: boolean;
|
|
@@ -460,20 +455,21 @@ interface ComboboxProps<T extends string> {
|
|
|
460
455
|
items: ComboboxItem<T>[];
|
|
461
456
|
selected: ComboboxItem<T>["value"] | null;
|
|
462
457
|
onChange: (value: ComboboxItem<T>["value"] | null) => void;
|
|
458
|
+
className?: string;
|
|
463
459
|
placeholder?: string;
|
|
464
460
|
searchPlaceholder?: string;
|
|
465
461
|
label?: string;
|
|
466
462
|
labelClassname?: string;
|
|
467
463
|
}
|
|
468
|
-
declare function Combobox<T extends string>({ items, selected, onChange, placeholder, searchPlaceholder, label, labelClassname }: ComboboxProps<T>): react_jsx_runtime.JSX.Element;
|
|
464
|
+
declare function Combobox<T extends string>({ items, selected, onChange, className, placeholder, searchPlaceholder, label, labelClassname }: ComboboxProps<T>): react_jsx_runtime.JSX.Element;
|
|
469
465
|
|
|
470
466
|
interface MultiComboboxProps<T extends string> extends Omit<ComboboxProps<T>, "selected" | "onChange"> {
|
|
471
|
-
label?: string;
|
|
472
467
|
selected: T[];
|
|
473
468
|
onChange: (value: T[]) => void;
|
|
469
|
+
label?: string;
|
|
474
470
|
labelClassname?: string;
|
|
475
471
|
}
|
|
476
|
-
declare function MultiCombobox<T extends string>({ items, selected, onChange, placeholder, searchPlaceholder, label, labelClassname, }: MultiComboboxProps<T>): react_jsx_runtime.JSX.Element;
|
|
472
|
+
declare function MultiCombobox<T extends string>({ items, selected, onChange, className, placeholder, searchPlaceholder, label, labelClassname, }: MultiComboboxProps<T>): react_jsx_runtime.JSX.Element;
|
|
477
473
|
|
|
478
474
|
interface SelectItem$1<T extends string> {
|
|
479
475
|
label: string;
|
package/dist/index.d.ts
CHANGED
|
@@ -3,6 +3,7 @@ import * as React$1 from 'react';
|
|
|
3
3
|
import React__default from 'react';
|
|
4
4
|
import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
|
|
5
5
|
import * as AvatarPrimitive from '@radix-ui/react-avatar';
|
|
6
|
+
import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
|
|
6
7
|
import { VariantProps } from 'class-variance-authority';
|
|
7
8
|
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
|
|
8
9
|
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
@@ -45,12 +46,10 @@ declare const AvatarBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive
|
|
|
45
46
|
declare const AvatarImageBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React$1.RefAttributes<HTMLImageElement>, "ref"> & React$1.RefAttributes<HTMLImageElement>>;
|
|
46
47
|
declare const AvatarFallbackBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
|
|
47
48
|
|
|
48
|
-
declare const buttonVariantsBase: (props?: (
|
|
49
|
-
variant
|
|
50
|
-
size
|
|
51
|
-
}
|
|
52
|
-
className?: string;
|
|
53
|
-
}) | undefined) => string;
|
|
49
|
+
declare const buttonVariantsBase: (props?: ({
|
|
50
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
|
|
51
|
+
size?: "default" | "sm" | "lg" | "icon" | null | undefined;
|
|
52
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
54
53
|
interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariantsBase> {
|
|
55
54
|
asChild?: boolean;
|
|
56
55
|
}
|
|
@@ -275,11 +274,9 @@ declare const SheetTriggerBase: React$1.ForwardRefExoticComponent<DialogPrimitiv
|
|
|
275
274
|
declare const SheetCloseBase: React$1.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
276
275
|
declare const SheetPortalBase: React$1.FC<DialogPrimitive.DialogPortalProps>;
|
|
277
276
|
declare const SheetOverlayBase: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
278
|
-
declare const sheetVariants: (props?: (
|
|
279
|
-
side
|
|
280
|
-
}
|
|
281
|
-
className?: string;
|
|
282
|
-
}) | undefined) => string;
|
|
277
|
+
declare const sheetVariants: (props?: ({
|
|
278
|
+
side?: "bottom" | "left" | "right" | "top" | null | undefined;
|
|
279
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
283
280
|
interface SheetContentProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof sheetVariants> {
|
|
284
281
|
}
|
|
285
282
|
declare const SheetContentBase: React$1.ForwardRefExoticComponent<SheetContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
@@ -342,12 +339,10 @@ declare const SidebarMenuButtonBase: React$1.ForwardRefExoticComponent<Omit<Reac
|
|
|
342
339
|
asChild?: boolean;
|
|
343
340
|
isActive?: boolean;
|
|
344
341
|
tooltip?: string | React$1.ComponentProps<typeof TooltipContentBase>;
|
|
345
|
-
} &
|
|
346
|
-
variant
|
|
347
|
-
size
|
|
348
|
-
}> &
|
|
349
|
-
className?: string;
|
|
350
|
-
}, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
342
|
+
} & VariantProps<(props?: ({
|
|
343
|
+
variant?: "default" | "outline" | null | undefined;
|
|
344
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
345
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
351
346
|
declare const SidebarMenuActionBase: React$1.ForwardRefExoticComponent<Omit<React$1.ClassAttributes<HTMLButtonElement> & React$1.ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
352
347
|
asChild?: boolean;
|
|
353
348
|
showOnHover?: boolean;
|
|
@@ -460,20 +455,21 @@ interface ComboboxProps<T extends string> {
|
|
|
460
455
|
items: ComboboxItem<T>[];
|
|
461
456
|
selected: ComboboxItem<T>["value"] | null;
|
|
462
457
|
onChange: (value: ComboboxItem<T>["value"] | null) => void;
|
|
458
|
+
className?: string;
|
|
463
459
|
placeholder?: string;
|
|
464
460
|
searchPlaceholder?: string;
|
|
465
461
|
label?: string;
|
|
466
462
|
labelClassname?: string;
|
|
467
463
|
}
|
|
468
|
-
declare function Combobox<T extends string>({ items, selected, onChange, placeholder, searchPlaceholder, label, labelClassname }: ComboboxProps<T>): react_jsx_runtime.JSX.Element;
|
|
464
|
+
declare function Combobox<T extends string>({ items, selected, onChange, className, placeholder, searchPlaceholder, label, labelClassname }: ComboboxProps<T>): react_jsx_runtime.JSX.Element;
|
|
469
465
|
|
|
470
466
|
interface MultiComboboxProps<T extends string> extends Omit<ComboboxProps<T>, "selected" | "onChange"> {
|
|
471
|
-
label?: string;
|
|
472
467
|
selected: T[];
|
|
473
468
|
onChange: (value: T[]) => void;
|
|
469
|
+
label?: string;
|
|
474
470
|
labelClassname?: string;
|
|
475
471
|
}
|
|
476
|
-
declare function MultiCombobox<T extends string>({ items, selected, onChange, placeholder, searchPlaceholder, label, labelClassname, }: MultiComboboxProps<T>): react_jsx_runtime.JSX.Element;
|
|
472
|
+
declare function MultiCombobox<T extends string>({ items, selected, onChange, className, placeholder, searchPlaceholder, label, labelClassname, }: MultiComboboxProps<T>): react_jsx_runtime.JSX.Element;
|
|
477
473
|
|
|
478
474
|
interface SelectItem$1<T extends string> {
|
|
479
475
|
label: string;
|
package/dist/index.js
CHANGED
|
@@ -1446,8 +1446,8 @@ function ComboboxBase({
|
|
|
1446
1446
|
errorMessage && "border-red-500"
|
|
1447
1447
|
),
|
|
1448
1448
|
children: [
|
|
1449
|
-
|
|
1450
|
-
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.CaretDown, { size: 16, className: "mt-
|
|
1449
|
+
renderSelected,
|
|
1450
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.CaretDown, { size: 16, className: "mt-0.5" })
|
|
1451
1451
|
]
|
|
1452
1452
|
}
|
|
1453
1453
|
)
|
|
@@ -1498,6 +1498,7 @@ function Combobox({
|
|
|
1498
1498
|
items,
|
|
1499
1499
|
selected,
|
|
1500
1500
|
onChange,
|
|
1501
|
+
className,
|
|
1501
1502
|
placeholder,
|
|
1502
1503
|
searchPlaceholder,
|
|
1503
1504
|
label,
|
|
@@ -1517,7 +1518,7 @@ function Combobox({
|
|
|
1517
1518
|
},
|
|
1518
1519
|
[selected, onChange]
|
|
1519
1520
|
);
|
|
1520
|
-
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
|
|
1521
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: cn("flex flex-col gap-1 w-full min-w-[150px]", className), children: [
|
|
1521
1522
|
label && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(LabelBase_default, { className: labelClassname, children: label }),
|
|
1522
1523
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1523
1524
|
ComboboxBase,
|
|
@@ -1540,6 +1541,7 @@ function MultiCombobox({
|
|
|
1540
1541
|
items,
|
|
1541
1542
|
selected,
|
|
1542
1543
|
onChange,
|
|
1544
|
+
className,
|
|
1543
1545
|
placeholder,
|
|
1544
1546
|
searchPlaceholder,
|
|
1545
1547
|
label,
|
|
@@ -1596,7 +1598,7 @@ function MultiCombobox({
|
|
|
1596
1598
|
));
|
|
1597
1599
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex flex-wrap gap-2", children: items2 });
|
|
1598
1600
|
}, [handleSelection, placeholder, selectedItems]);
|
|
1599
|
-
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
|
|
1601
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: cn("flex flex-col gap-1 w-full min-w-[150px]", className), children: [
|
|
1600
1602
|
label && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(LabelBase_default, { className: labelClassname, children: label }),
|
|
1601
1603
|
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1602
1604
|
ComboboxBase,
|
|
@@ -3133,7 +3135,7 @@ var SwitchBase = React24.forwardRef(({ className, ...props }, ref) => {
|
|
|
3133
3135
|
...props,
|
|
3134
3136
|
ref,
|
|
3135
3137
|
className: cn(
|
|
3136
|
-
"peer relative inline-flex
|
|
3138
|
+
"peer relative inline-flex w-12 cursor-pointer items-center rounded-full border-2 border-transparent shadow-md transition-colors duration-300 ease-in-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input data-[state=checked]:shadow-[0_0_15px_4px_var(--tw-shadow-color)] data-[state=checked]:shadow-primary/30",
|
|
3137
3139
|
className
|
|
3138
3140
|
),
|
|
3139
3141
|
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
package/dist/index.mjs
CHANGED
|
@@ -1253,8 +1253,8 @@ function ComboboxBase({
|
|
|
1253
1253
|
errorMessage && "border-red-500"
|
|
1254
1254
|
),
|
|
1255
1255
|
children: [
|
|
1256
|
-
|
|
1257
|
-
/* @__PURE__ */ jsx16(CaretDown, { size: 16, className: "mt-
|
|
1256
|
+
renderSelected,
|
|
1257
|
+
/* @__PURE__ */ jsx16(CaretDown, { size: 16, className: "mt-0.5" })
|
|
1258
1258
|
]
|
|
1259
1259
|
}
|
|
1260
1260
|
)
|
|
@@ -1305,6 +1305,7 @@ function Combobox({
|
|
|
1305
1305
|
items,
|
|
1306
1306
|
selected,
|
|
1307
1307
|
onChange,
|
|
1308
|
+
className,
|
|
1308
1309
|
placeholder,
|
|
1309
1310
|
searchPlaceholder,
|
|
1310
1311
|
label,
|
|
@@ -1324,7 +1325,7 @@ function Combobox({
|
|
|
1324
1325
|
},
|
|
1325
1326
|
[selected, onChange]
|
|
1326
1327
|
);
|
|
1327
|
-
return /* @__PURE__ */ jsxs10("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
|
|
1328
|
+
return /* @__PURE__ */ jsxs10("div", { className: cn("flex flex-col gap-1 w-full min-w-[150px]", className), children: [
|
|
1328
1329
|
label && /* @__PURE__ */ jsx17(LabelBase_default, { className: labelClassname, children: label }),
|
|
1329
1330
|
/* @__PURE__ */ jsx17(
|
|
1330
1331
|
ComboboxBase,
|
|
@@ -1347,6 +1348,7 @@ function MultiCombobox({
|
|
|
1347
1348
|
items,
|
|
1348
1349
|
selected,
|
|
1349
1350
|
onChange,
|
|
1351
|
+
className,
|
|
1350
1352
|
placeholder,
|
|
1351
1353
|
searchPlaceholder,
|
|
1352
1354
|
label,
|
|
@@ -1403,7 +1405,7 @@ function MultiCombobox({
|
|
|
1403
1405
|
));
|
|
1404
1406
|
return /* @__PURE__ */ jsx18("div", { className: "flex flex-wrap gap-2", children: items2 });
|
|
1405
1407
|
}, [handleSelection, placeholder, selectedItems]);
|
|
1406
|
-
return /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
|
|
1408
|
+
return /* @__PURE__ */ jsxs11("div", { className: cn("flex flex-col gap-1 w-full min-w-[150px]", className), children: [
|
|
1407
1409
|
label && /* @__PURE__ */ jsx18(LabelBase_default, { className: labelClassname, children: label }),
|
|
1408
1410
|
/* @__PURE__ */ jsx18(
|
|
1409
1411
|
ComboboxBase,
|
|
@@ -2944,7 +2946,7 @@ var SwitchBase = React24.forwardRef(({ className, ...props }, ref) => {
|
|
|
2944
2946
|
...props,
|
|
2945
2947
|
ref,
|
|
2946
2948
|
className: cn(
|
|
2947
|
-
"peer relative inline-flex
|
|
2949
|
+
"peer relative inline-flex w-12 cursor-pointer items-center rounded-full border-2 border-transparent shadow-md transition-colors duration-300 ease-in-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input data-[state=checked]:shadow-[0_0_15px_4px_var(--tw-shadow-color)] data-[state=checked]:shadow-primary/30",
|
|
2948
2950
|
className
|
|
2949
2951
|
),
|
|
2950
2952
|
children: /* @__PURE__ */ jsx34(
|