@modul/mbui 0.0.13-beta-pv-53036-91768058 → 0.0.13-beta-pv-53036-3e26be0c

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.
Files changed (18) hide show
  1. package/dist/Button/Button.d.ts +1 -1
  2. package/dist/Calendar/Calendar.d.ts +8 -0
  3. package/dist/Calendar/Calendar.js +43 -0
  4. package/dist/Calendar/Calendar.js.map +1 -0
  5. package/dist/Calendar/index.d.ts +1 -0
  6. package/dist/Calendar/index.js +6 -0
  7. package/dist/Calendar/index.js.map +1 -0
  8. package/dist/Chip/Chip.d.ts +1 -1
  9. package/dist/Input-OTP/Input.d.ts +4 -4
  10. package/dist/index.d.ts +2 -1
  11. package/dist/index.js +3 -1
  12. package/dist/index.js.map +1 -1
  13. package/package.json +2 -1
  14. package/src/Calendar/Calendar.tsx +59 -0
  15. package/src/Calendar/index.ts +1 -0
  16. package/src/Datepicker/Datepicker.tsx +41 -0
  17. package/src/Datepicker/index.ts +1 -0
  18. package/src/index.ts +4 -0
package/dist/Button/Button.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { type VariantProps } from 'class-variance-authority';
3
3
  declare const buttonVariants: (props?: {
4
- variant?: "outline" | "success" | "primary" | "secondary" | "primary-outline" | "ghost";
4
+ variant?: "primary" | "secondary" | "success" | "primary-outline" | "outline" | "ghost";
5
5
  size?: "lg" | "md" | "sm" | "xs" | "xxs";
6
6
  } & import("class-variance-authority/dist/types").ClassProp) => string;
7
7
  export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
package/dist/Calendar/Calendar.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ import * as React from 'react';
2
+ import { DayPicker } from 'react-day-picker';
3
+ export declare type CalendarProps = React.ComponentProps<typeof DayPicker>;
4
+ declare function Calendar({ className, classNames, showOutsideDays, ...props }: CalendarProps): React.JSX.Element;
5
+ declare namespace Calendar {
6
+ var displayName: string;
7
+ }
8
+ export { Calendar };
package/dist/Calendar/Calendar.js ADDED
@@ -0,0 +1,43 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.Calendar = void 0;
4
+ const tslib_1 = require("tslib");
5
+ const React = (0, tslib_1.__importStar)(require("react"));
6
+ const react_day_picker_1 = require("react-day-picker");
7
+ const utils_1 = require("../@/lib/utils");
8
+ const Button_1 = require("../Button");
9
+ function Calendar({ className, classNames, showOutsideDays = true, ...props }) {
10
+ return (React.createElement(react_day_picker_1.DayPicker, { showOutsideDays: showOutsideDays, className: (0, utils_1.cn)('p-3', className), classNames: {
11
+ months: 'flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0',
12
+ month: 'space-y-4',
13
+ caption: 'flex justify-center pt-1 relative items-center',
14
+ caption_label: 'text-sm font-medium',
15
+ nav: 'space-x-1 flex items-center',
16
+ nav_button: (0, utils_1.cn)((0, Button_1.buttonVariants)({ variant: 'outline' }), 'h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100'),
17
+ nav_button_previous: 'absolute left-1',
18
+ nav_button_next: 'absolute right-1',
19
+ table: 'w-full border-collapse space-y-1',
20
+ head_row: 'flex',
21
+ head_cell: 'text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]',
22
+ row: 'flex w-full mt-2',
23
+ cell: (0, utils_1.cn)('relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected].day-range-end)]:rounded-r-md', props.mode === 'range'
24
+ ? '[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md'
25
+ : '[&:has([aria-selected])]:rounded-md'),
26
+ day: (0, utils_1.cn)((0, Button_1.buttonVariants)({ variant: 'ghost' }), 'h-8 w-8 p-0 font-normal aria-selected:opacity-100'),
27
+ day_range_start: 'day-range-start',
28
+ day_range_end: 'day-range-end',
29
+ day_selected: 'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',
30
+ day_today: 'bg-accent text-accent-foreground',
31
+ day_outside: 'day-outside text-muted-foreground opacity-50 aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30',
32
+ day_disabled: 'text-muted-foreground opacity-50',
33
+ day_range_middle: 'aria-selected:bg-accent aria-selected:text-accent-foreground',
34
+ day_hidden: 'invisible',
35
+ ...classNames,
36
+ }, components: {
37
+ // IconLeft: ({ ...props }) => <Left className="w-4 h-4" />,
38
+ // IconRight: ({ ...props }) => <Right className="w-4 h-4" />,
39
+ }, ...props }));
40
+ }
41
+ exports.Calendar = Calendar;
42
+ Calendar.displayName = 'Calendar';
43
+ //# sourceMappingURL=Calendar.js.map
package/dist/Calendar/Calendar.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Calendar.js","sourceRoot":"","sources":["../../src/Calendar/Calendar.tsx"],"names":[],"mappings":";;;;AAAA,0DAA8B;AAC9B,uDAA4C;AAC5C,0CAAmC;AACnC,sCAA0C;AAK1C,SAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,eAAe,GAAG,IAAI,EAAE,GAAG,KAAK,EAAiB;IAC3F,OAAO,CACN,oBAAC,4BAAS,IACT,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,IAAA,UAAE,EAAC,KAAK,EAAE,SAAS,CAAC,EAC/B,UAAU,EAAE;YACX,MAAM,EAAE,+DAA+D;YACvE,KAAK,EAAE,WAAW;YAClB,OAAO,EAAE,gDAAgD;YACzD,aAAa,EAAE,qBAAqB;YACpC,GAAG,EAAE,6BAA6B;YAClC,UAAU,EAAE,IAAA,UAAE,EACb,IAAA,uBAAc,EAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,EACtC,yDAAyD,CACzD;YACD,mBAAmB,EAAE,iBAAiB;YACtC,eAAe,EAAE,kBAAkB;YACnC,KAAK,EAAE,kCAAkC;YACzC,QAAQ,EAAE,MAAM;YAChB,SAAS,EAAE,gEAAgE;YAC3E,GAAG,EAAE,kBAAkB;YACvB,IAAI,EAAE,IAAA,UAAE,EACP,mNAAmN,EACnN,KAAK,CAAC,IAAI,KAAK,OAAO;gBACrB,CAAC,CAAC,sKAAsK;gBACxK,CAAC,CAAC,qCAAqC,CACxC;YACD,GAAG,EAAE,IAAA,UAAE,EAAC,IAAA,uBAAc,EAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,mDAAmD,CAAC;YAClG,eAAe,EAAE,iBAAiB;YAClC,aAAa,EAAE,eAAe;YAC9B,YAAY,EACX,kIAAkI;YACnI,SAAS,EAAE,kCAAkC;YAC7C,WAAW,EACV,uIAAuI;YACxI,YAAY,EAAE,kCAAkC;YAChD,gBAAgB,EAAE,8DAA8D;YAChF,UAAU,EAAE,WAAW;YACvB,GAAG,UAAU;SACb,EACD,UAAU,EAAE;QACX,4DAA4D;QAC5D,8DAA8D;SAC9D,KACG,KAAK,GACR,CACF,CAAA;AACF,CAAC;AAGQ,4BAAQ;AAFjB,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAA"}
package/dist/Calendar/index.d.ts ADDED
@@ -0,0 +1 @@
1
+ export { Calendar } from './Calendar';
package/dist/Calendar/index.js ADDED
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.Calendar = void 0;
4
+ var Calendar_1 = require("./Calendar");
5
+ Object.defineProperty(exports, "Calendar", { enumerable: true, get: function () { return Calendar_1.Calendar; } });
6
+ //# sourceMappingURL=index.js.map
package/dist/Calendar/index.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Calendar/index.ts"],"names":[],"mappings":";;;AAAA,uCAAqC;AAA5B,oGAAA,QAAQ,OAAA"}
package/dist/Chip/Chip.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { type VariantProps } from 'class-variance-authority';
3
3
  declare const chipVariants: (props?: {
4
- variant?: "outline" | "success" | "primary" | "secondary" | "primary-outline" | "ghost";
4
+ variant?: "primary" | "secondary" | "success" | "primary-outline" | "outline" | "ghost";
5
5
  size?: "lg" | "md" | "sm" | "xs" | "xxs";
6
6
  } & import("class-variance-authority/dist/types").ClassProp) => string;
7
7
  export interface IChipProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof chipVariants> {
package/dist/Input-OTP/Input.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import * as React from 'react';
2
- declare const InputOTP: React.ForwardRefExoticComponent<(Omit<Omit<React.InputHTMLAttributes<HTMLInputElement>, "textAlign" | "value" | "maxLength" | "onChange" | "onComplete" | "pushPasswordManagerStrategy" | "containerClassName" | "noScriptCSSFallback"> & {
2
+ declare const InputOTP: React.ForwardRefExoticComponent<(Omit<Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "maxLength" | "textAlign" | "onComplete" | "pushPasswordManagerStrategy" | "containerClassName" | "noScriptCSSFallback"> & {
3
3
  value?: string;
4
4
  onChange?: (newValue: string) => unknown;
5
5
  maxLength: number;
6
- textAlign?: "center" | "left" | "right";
6
+ textAlign?: "center" | "right" | "left";
7
7
  onComplete?: (...args: any[]) => unknown;
8
8
  pushPasswordManagerStrategy?: "none" | "increase-width";
9
9
  containerClassName?: string;
@@ -11,11 +11,11 @@ declare const InputOTP: React.ForwardRefExoticComponent<(Omit<Omit<React.InputHT
11
11
  } & {
12
12
  render: (props: import("input-otp").RenderProps) => React.ReactNode;
13
13
  children?: never;
14
- } & React.RefAttributes<HTMLInputElement>, "ref"> | Omit<Omit<React.InputHTMLAttributes<HTMLInputElement>, "textAlign" | "value" | "maxLength" | "onChange" | "onComplete" | "pushPasswordManagerStrategy" | "containerClassName" | "noScriptCSSFallback"> & {
14
+ } & React.RefAttributes<HTMLInputElement>, "ref"> | Omit<Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "maxLength" | "textAlign" | "onComplete" | "pushPasswordManagerStrategy" | "containerClassName" | "noScriptCSSFallback"> & {
15
15
  value?: string;
16
16
  onChange?: (newValue: string) => unknown;
17
17
  maxLength: number;
18
- textAlign?: "center" | "left" | "right";
18
+ textAlign?: "center" | "right" | "left";
19
19
  onComplete?: (...args: any[]) => unknown;
20
20
  pushPasswordManagerStrategy?: "none" | "increase-width";
21
21
  containerClassName?: string;
package/dist/index.d.ts CHANGED
@@ -21,4 +21,5 @@ import { Label } from './Label';
21
21
  import { Textarea } from './Textarea';
22
22
  import { SelectAccountCard } from './Select';
23
23
  import { Form, FormLabel, FormField, FormItem, FormControl, FormDescription, FormMessage } from './Form';
24
- export { Tooltip, Tabs, Slider, Popover, Logo, InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator, Collapsible, CollapsibleTrigger, CollapsibleContent, AccountCollapsible, AccountCollapsibleHeader, AccountCollapsibleTrigger, AccountCollapsibleContent, AccountCollapsibleContentItem, Button, InputField, InputLabel, Audio, cn, Icon, Drawer, DrawerTrigger, DrawerTitle, DrawerClose, DrawerContent, BottomNavigation, BottomNavigationList, BottomNavigationListItem, BottomNavigationLink, Page, Chip, Alert, Switch, Label, Textarea, SelectAccountCard, Form, FormLabel, FormField, FormItem, FormControl, FormDescription, FormMessage, };
24
+ import { Calendar } from './Calendar';
25
+ export { Tooltip, Tabs, Slider, Popover, Logo, InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator, Collapsible, CollapsibleTrigger, CollapsibleContent, AccountCollapsible, AccountCollapsibleHeader, AccountCollapsibleTrigger, AccountCollapsibleContent, AccountCollapsibleContentItem, Button, InputField, InputLabel, Audio, cn, Icon, Drawer, DrawerTrigger, DrawerTitle, DrawerClose, DrawerContent, BottomNavigation, BottomNavigationList, BottomNavigationListItem, BottomNavigationLink, Page, Chip, Alert, Switch, Label, Textarea, SelectAccountCard, Form, FormLabel, FormField, FormItem, FormControl, FormDescription, FormMessage, Calendar, };
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.FormMessage = exports.FormDescription = exports.FormControl = exports.FormItem = exports.FormField = exports.FormLabel = exports.Form = exports.SelectAccountCard = exports.Textarea = exports.Label = exports.Switch = exports.Alert = exports.Chip = exports.Page = exports.BottomNavigationLink = exports.BottomNavigationListItem = exports.BottomNavigationList = exports.BottomNavigation = exports.DrawerContent = exports.DrawerClose = exports.DrawerTitle = exports.DrawerTrigger = exports.Drawer = exports.Icon = exports.cn = exports.Audio = exports.InputLabel = exports.InputField = exports.Button = exports.AccountCollapsibleContentItem = exports.AccountCollapsibleContent = exports.AccountCollapsibleTrigger = exports.AccountCollapsibleHeader = exports.AccountCollapsible = exports.CollapsibleContent = exports.CollapsibleTrigger = exports.Collapsible = exports.InputOTPSeparator = exports.InputOTPSlot = exports.InputOTPGroup = exports.InputOTP = exports.Logo = exports.Popover = exports.Slider = exports.Tabs = exports.Tooltip = void 0;
3
+ exports.Calendar = exports.FormMessage = exports.FormDescription = exports.FormControl = exports.FormItem = exports.FormField = exports.FormLabel = exports.Form = exports.SelectAccountCard = exports.Textarea = exports.Label = exports.Switch = exports.Alert = exports.Chip = exports.Page = exports.BottomNavigationLink = exports.BottomNavigationListItem = exports.BottomNavigationList = exports.BottomNavigation = exports.DrawerContent = exports.DrawerClose = exports.DrawerTitle = exports.DrawerTrigger = exports.Drawer = exports.Icon = exports.cn = exports.Audio = exports.InputLabel = exports.InputField = exports.Button = exports.AccountCollapsibleContentItem = exports.AccountCollapsibleContent = exports.AccountCollapsibleTrigger = exports.AccountCollapsibleHeader = exports.AccountCollapsible = exports.CollapsibleContent = exports.CollapsibleTrigger = exports.Collapsible = exports.InputOTPSeparator = exports.InputOTPSlot = exports.InputOTPGroup = exports.InputOTP = exports.Logo = exports.Popover = exports.Slider = exports.Tabs = exports.Tooltip = void 0;
4
4
  const tslib_1 = require("tslib");
5
5
  const Tooltip_1 = require("./Tooltip");
6
6
  Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return Tooltip_1.Tooltip; } });
@@ -71,4 +71,6 @@ Object.defineProperty(exports, "FormItem", { enumerable: true, get: function ()
71
71
  Object.defineProperty(exports, "FormControl", { enumerable: true, get: function () { return Form_1.FormControl; } });
72
72
  Object.defineProperty(exports, "FormDescription", { enumerable: true, get: function () { return Form_1.FormDescription; } });
73
73
  Object.defineProperty(exports, "FormMessage", { enumerable: true, get: function () { return Form_1.FormMessage; } });
74
+ const Calendar_1 = require("./Calendar");
75
+ Object.defineProperty(exports, "Calendar", { enumerable: true, get: function () { return Calendar_1.Calendar; } });
74
76
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;AAAA,uCAAmC;AAoClC,wFApCQ,iBAAO,OAoCR;AAnCR,iCAA6B;AAoC5B,qFApCQ,WAAI,OAoCR;AAnCL,qCAAiC;AAoChC,uFApCQ,eAAM,OAoCR;AAnCP,uCAAmC;AAoClC,wFApCQ,iBAAO,OAoCR;AAnCR,+DAAyB;AAoCxB,eApCM,cAAI,CAoCN;AAnCL,2CAAsF;AAoCrF,yFApCQ,oBAAQ,OAoCR;AACR,8FArCkB,yBAAa,OAqClB;AACb,6FAtCiC,wBAAY,OAsCjC;AACZ,kGAvC+C,6BAAiB,OAuC/C;AAtClB,yDAK2B;AAqD1B,iGAzDA,mCAAgB,OAyDA;AAChB,qGAzDA,uCAAoB,OAyDA;AACpB,yGAzDA,2CAAwB,OAyDA;AACxB,qGAzDA,uCAAoB,OAyDA;AAvDrB,0DAA8B;AA8C7B,oBAAI;AA7CL,+CAAmF;AAgClF,4FAhCQ,yBAAW,OAgCR;AACX,mGAjCqB,gCAAkB,OAiCrB;AAClB,mGAlCyC,gCAAkB,OAkCzC;AAjCnB,+CAMsB;AA4BrB,mGAjCA,gCAAkB,OAiCA;AAClB,yGAjCA,sCAAwB,OAiCA;AACxB,0GAjCA,uCAAyB,OAiCA;AACzB,0GAjCA,uCAAyB,OAiCA;AACzB,8GAjCA,2CAA6B,OAiCA;AA/B9B,qCAAiC;AAgChC,uFAhCQ,eAAM,OAgCR;AA/BP,mCAA+B;AAkC9B,sFAlCQ,aAAK,OAkCR;AAjCN,yCAAkC;AAkCjC,mFAlCQ,UAAE,OAkCR;AAjCH,qCAAyF;AAmCxF,uFAnCQ,eAAM,OAmCR;AACN,8FApCgB,sBAAa,OAoChB;AACb,4FArC+B,oBAAW,OAqC/B;AACX,4FAtC4C,oBAAW,OAsC5C;AACX,8FAvCyD,sBAAa,OAuCzD;AAtCd,iCAA6B;AA2C5B,qFA3CQ,WAAI,OA2CR;AA1CL,iCAA6B;AA2C5B,qFA3CQ,WAAI,OA2CR;AA1CL,mCAAgD;AA2B/C,2FA3BQ,kBAAU,OA2BR;AACV,2FA5BoB,kBAAU,OA4BpB;AA3BX,mCAA+B;AA0C9B,sFA1CQ,aAAK,OA0CR;AAzCN,qCAAiC;AA0ChC,uFA1CQ,eAAM,OA0CR;AAzCP,mCAA+B;AA0C9B,sFA1CQ,aAAK,OA0CR;AAzCN,yCAAqC;AA0CpC,yFA1CQ,mBAAQ,OA0CR;AAzCT,qCAA4C;AA0C3C,kGA1CQ,0BAAiB,OA0CR;AAzClB,iCAAwG;AA0CvG,qFA1CQ,WAAI,OA0CR;AACJ,0FA3Cc,gBAAS,OA2Cd;AACT,0FA5CyB,gBAAS,OA4CzB;AACT,yFA7CoC,eAAQ,OA6CpC;AACR,4FA9C8C,kBAAW,OA8C9C;AACX,gGA/C2D,sBAAe,OA+C3D;AACf,4FAhD4E,kBAAW,OAgD5E"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;AAAA,uCAAmC;AAsClC,wFAtCQ,iBAAO,OAsCR;AArCR,iCAA6B;AAsC5B,qFAtCQ,WAAI,OAsCR;AArCL,qCAAiC;AAsChC,uFAtCQ,eAAM,OAsCR;AArCP,uCAAmC;AAsClC,wFAtCQ,iBAAO,OAsCR;AArCR,+DAAyB;AAsCxB,eAtCM,cAAI,CAsCN;AArCL,2CAAsF;AAsCrF,yFAtCQ,oBAAQ,OAsCR;AACR,8FAvCkB,yBAAa,OAuClB;AACb,6FAxCiC,wBAAY,OAwCjC;AACZ,kGAzC+C,6BAAiB,OAyC/C;AAxClB,yDAK2B;AAuD1B,iGA3DA,mCAAgB,OA2DA;AAChB,qGA3DA,uCAAoB,OA2DA;AACpB,yGA3DA,2CAAwB,OA2DA;AACxB,qGA3DA,uCAAoB,OA2DA;AAzDrB,0DAA8B;AAgD7B,oBAAI;AA/CL,+CAAmF;AAkClF,4FAlCQ,yBAAW,OAkCR;AACX,mGAnCqB,gCAAkB,OAmCrB;AAClB,mGApCyC,gCAAkB,OAoCzC;AAnCnB,+CAMsB;AA8BrB,mGAnCA,gCAAkB,OAmCA;AAClB,yGAnCA,sCAAwB,OAmCA;AACxB,0GAnCA,uCAAyB,OAmCA;AACzB,0GAnCA,uCAAyB,OAmCA;AACzB,8GAnCA,2CAA6B,OAmCA;AAjC9B,qCAAiC;AAkChC,uFAlCQ,eAAM,OAkCR;AAjCP,mCAA+B;AAoC9B,sFApCQ,aAAK,OAoCR;AAnCN,yCAAkC;AAoCjC,mFApCQ,UAAE,OAoCR;AAnCH,qCAAyF;AAqCxF,uFArCQ,eAAM,OAqCR;AACN,8FAtCgB,sBAAa,OAsChB;AACb,4FAvC+B,oBAAW,OAuC/B;AACX,4FAxC4C,oBAAW,OAwC5C;AACX,8FAzCyD,sBAAa,OAyCzD;AAxCd,iCAA6B;AA6C5B,qFA7CQ,WAAI,OA6CR;AA5CL,iCAA6B;AA6C5B,qFA7CQ,WAAI,OA6CR;AA5CL,mCAAgD;AA6B/C,2FA7BQ,kBAAU,OA6BR;AACV,2FA9BoB,kBAAU,OA8BpB;AA7BX,mCAA+B;AA4C9B,sFA5CQ,aAAK,OA4CR;AA3CN,qCAAiC;AA4ChC,uFA5CQ,eAAM,OA4CR;AA3CP,mCAA+B;AA4C9B,sFA5CQ,aAAK,OA4CR;AA3CN,yCAAqC;AA4CpC,yFA5CQ,mBAAQ,OA4CR;AA3CT,qCAA4C;AA4C3C,kGA5CQ,0BAAiB,OA4CR;AA3ClB,iCAAwG;AA4CvG,qFA5CQ,WAAI,OA4CR;AACJ,0FA7Cc,gBAAS,OA6Cd;AACT,0FA9CyB,gBAAS,OA8CzB;AACT,yFA/CoC,eAAQ,OA+CpC;AACR,4FAhD8C,kBAAW,OAgD9C;AACX,gGAjD2D,sBAAe,OAiD3D;AACf,4FAlD4E,kBAAW,OAkD5E;AAjDZ,yCAAqC;AAkDpC,yFAlDQ,mBAAQ,OAkDR"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@modul/mbui",
3
- "version": "0.0.13-beta-pv-53036-91768058",
3
+ "version": "0.0.13-beta-pv-53036-3e26be0c",
4
4
  "packageManager": "yarn@3.5.1",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",
@@ -40,6 +40,7 @@
40
40
  "input-otp": "1.2.4",
41
41
  "lodash": "4.17.5",
42
42
  "react-datepicker": "4.16.0",
43
+ "react-day-picker": "^9.0.8",
43
44
  "react-hook-form": "7.53.0",
44
45
  "react-imask": "7.1.3",
45
46
  "react-select": "5.8.0",
package/src/Calendar/Calendar.tsx ADDED
@@ -0,0 +1,59 @@
1
+ import * as React from 'react'
2
+ import { DayPicker } from 'react-day-picker'
3
+ import { cn } from '../@/lib/utils'
4
+ import { buttonVariants } from '../Button'
5
+ import { Left, Right } from '../Icon'
6
+
7
+ export type CalendarProps = React.ComponentProps<typeof DayPicker>
8
+
9
+ function Calendar({ className, classNames, showOutsideDays = true, ...props }: CalendarProps) {
10
+ return (
11
+ <DayPicker
12
+ showOutsideDays={showOutsideDays}
13
+ className={cn('p-3', className)}
14
+ classNames={{
15
+ months: 'flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0',
16
+ month: 'space-y-4',
17
+ caption: 'flex justify-center pt-1 relative items-center',
18
+ caption_label: 'text-sm font-medium',
19
+ nav: 'space-x-1 flex items-center',
20
+ nav_button: cn(
21
+ buttonVariants({ variant: 'outline' }),
22
+ 'h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100'
23
+ ),
24
+ nav_button_previous: 'absolute left-1',
25
+ nav_button_next: 'absolute right-1',
26
+ table: 'w-full border-collapse space-y-1',
27
+ head_row: 'flex',
28
+ head_cell: 'text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]',
29
+ row: 'flex w-full mt-2',
30
+ cell: cn(
31
+ 'relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected].day-range-end)]:rounded-r-md',
32
+ props.mode === 'range'
33
+ ? '[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md'
34
+ : '[&:has([aria-selected])]:rounded-md'
35
+ ),
36
+ day: cn(buttonVariants({ variant: 'ghost' }), 'h-8 w-8 p-0 font-normal aria-selected:opacity-100'),
37
+ day_range_start: 'day-range-start',
38
+ day_range_end: 'day-range-end',
39
+ day_selected:
40
+ 'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',
41
+ day_today: 'bg-accent text-accent-foreground',
42
+ day_outside:
43
+ 'day-outside text-muted-foreground opacity-50 aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30',
44
+ day_disabled: 'text-muted-foreground opacity-50',
45
+ day_range_middle: 'aria-selected:bg-accent aria-selected:text-accent-foreground',
46
+ day_hidden: 'invisible',
47
+ ...classNames,
48
+ }}
49
+ components={{
50
+ // IconLeft: ({ ...props }) => <Left className="w-4 h-4" />,
51
+ // IconRight: ({ ...props }) => <Right className="w-4 h-4" />,
52
+ }}
53
+ {...props}
54
+ />
55
+ )
56
+ }
57
+ Calendar.displayName = 'Calendar'
58
+
59
+ export { Calendar }
package/src/Calendar/index.ts ADDED
@@ -0,0 +1 @@
1
+ export { Calendar } from './Calendar'
package/src/Datepicker/Datepicker.tsx ADDED
@@ -0,0 +1,41 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+
5
+ import { format } from "date-fns"
6
+
7
+ import { cn } from "../@/lib/utils"
8
+ import { Button } from "../Button"
9
+ import { Calendar } from "../Calendar"
10
+ import {
11
+ Popover,
12
+ } from "../Popover"
13
+
14
+ export function DatePickerDemo() {
15
+ const [date, setDate] = React.useState<Date>()
16
+
17
+ return (
18
+ <Popover>
19
+ <Popover.Trigger asChild>
20
+ <Button
21
+ variant={"outline"}
22
+ className={cn(
23
+ "w-[240px] justify-start text-left font-normal",
24
+ !date && "text-muted-foreground"
25
+ )}
26
+ >
27
+ {/* <CalendarIcon className="mr-2 w-4 h-4" /> */}
28
+ {date ? format(date, "PPP") : <span>Pick a date</span>}
29
+ </Button>
30
+ </Popover.Trigger>
31
+ <Popover.Content className="p-0 w-auto" align="start">
32
+ <Calendar
33
+ mode="single"
34
+ // selected={date}
35
+ // onSelect={setDate}
36
+ // initialFocus
37
+ />
38
+ </Popover.Content>
39
+ </Popover>
40
+ )
41
+ }
package/src/Datepicker/index.ts ADDED
@@ -0,0 +1 @@
1
+ export { Datepicker } from './Datepicker'
package/src/index.ts CHANGED
@@ -32,6 +32,8 @@ import { Label } from './Label'
32
32
  import { Textarea } from './Textarea'
33
33
  import { SelectAccountCard } from './Select'
34
34
  import { Form, FormLabel, FormField, FormItem, FormControl, FormDescription, FormMessage } from './Form'
35
+ import { Calendar } from './Calendar'
36
+ // import { Datepicker } from './Datepicker'
35
37
 
36
38
  export {
37
39
  Tooltip,
@@ -80,4 +82,6 @@ export {
80
82
  FormControl,
81
83
  FormDescription,
82
84
  FormMessage,
85
+ Calendar,
86
+ // Datepicker,
83
87
  }