@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 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?: (Partial<{
49
- variant: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
50
- size: "default" | "sm" | "lg" | "icon";
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?: (Partial<{
279
- side: "bottom" | "left" | "right" | "top";
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
- } & Partial<{
346
- variant: "default" | "outline";
347
- size: "default" | "sm" | "lg";
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?: (Partial<{
49
- variant: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
50
- size: "default" | "sm" | "lg" | "icon";
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?: (Partial<{
279
- side: "bottom" | "left" | "right" | "top";
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
- } & Partial<{
346
- variant: "default" | "outline";
347
- size: "default" | "sm" | "lg";
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
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex flex-wrap gap-2 flex-1", children: renderSelected }),
1450
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_phosphor_react8.CaretDown, { size: 16, className: "mt-1" })
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 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",
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
- /* @__PURE__ */ jsx16("div", { className: "flex flex-wrap gap-2 flex-1", children: renderSelected }),
1257
- /* @__PURE__ */ jsx16(CaretDown, { size: 16, className: "mt-1" })
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 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",
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(
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mlw-packages/react-components",
3
- "version": "1.3.11",
3
+ "version": "1.3.12",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",