@mbao01/common 0.0.45 → 0.0.47

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 (70) hide show
  1. package/dist/types/components/Chart/helpers.d.ts +3 -1
  2. package/dist/types/components/Chart/stories/args/index.d.ts +63 -0
  3. package/dist/types/components/DragAndDrop/Draggable/Draggable.d.ts +29 -0
  4. package/dist/types/components/DragAndDrop/Draggable/Draggable.example.d.ts +24 -0
  5. package/dist/types/components/DragAndDrop/Draggable/constants.d.ts +9 -0
  6. package/dist/types/components/DragAndDrop/Draggable/index.d.ts +1 -0
  7. package/dist/types/components/DragAndDrop/Draggable/types.d.ts +41 -0
  8. package/dist/types/components/DragAndDrop/Droppable/Droppable.d.ts +2 -0
  9. package/dist/types/components/DragAndDrop/Droppable/Droppable.example.d.ts +10 -0
  10. package/dist/types/components/DragAndDrop/Droppable/constants.d.ts +5 -0
  11. package/dist/types/components/DragAndDrop/Droppable/index.d.ts +1 -0
  12. package/dist/types/components/DragAndDrop/Droppable/types.d.ts +4 -0
  13. package/dist/types/components/DragAndDrop/Sortable/Sortable.d.ts +2 -0
  14. package/dist/types/components/DragAndDrop/Sortable/Sortable.example.d.ts +6 -0
  15. package/dist/types/components/DragAndDrop/Sortable/constants.d.ts +4 -0
  16. package/dist/types/components/DragAndDrop/Sortable/index.d.ts +1 -0
  17. package/dist/types/components/DragAndDrop/Sortable/types.d.ts +7 -0
  18. package/dist/types/components/DragAndDrop/index.d.ts +3 -0
  19. package/dist/types/components/Form/DatetimeInput/DatetimeInput.d.ts +1 -1
  20. package/dist/types/components/Menu/Menubar/Menubar.d.ts +42 -0
  21. package/dist/types/components/Menu/Menubar/types.d.ts +1 -0
  22. package/dist/types/components/Widget/InternalWidgetsContext.d.ts +2 -0
  23. package/dist/types/components/Widget/Widget.d.ts +2 -0
  24. package/dist/types/components/Widget/Widgets.example.d.ts +1 -0
  25. package/dist/types/components/Widget/WidgetsContext.d.ts +2 -0
  26. package/dist/types/components/Widget/hooks/index.d.ts +2 -0
  27. package/dist/types/components/Widget/hooks/useWidget/index.d.ts +1 -0
  28. package/dist/types/components/Widget/hooks/useWidget/useWidget.d.ts +7 -0
  29. package/dist/types/components/Widget/hooks/useWidgets/index.d.ts +1 -0
  30. package/dist/types/components/Widget/hooks/useWidgets/useWidgets.d.ts +1 -0
  31. package/dist/types/components/Widget/index.d.ts +3 -0
  32. package/dist/types/components/Widget/modifiers/index.d.ts +1 -0
  33. package/dist/types/components/Widget/modifiers/restrictToElement.d.ts +2 -0
  34. package/dist/types/components/Widget/types.d.ts +28 -0
  35. package/dist/types/index.d.ts +2 -0
  36. package/package.json +63 -59
  37. package/src/components/Chart/helpers.ts +14 -8
  38. package/src/components/Chart/stories/args/index.ts +12 -12
  39. package/src/components/DragAndDrop/Draggable/Draggable.example.tsx +147 -0
  40. package/src/components/DragAndDrop/Draggable/Draggable.tsx +161 -0
  41. package/src/components/DragAndDrop/Draggable/constants.ts +47 -0
  42. package/src/components/DragAndDrop/Draggable/index.ts +1 -0
  43. package/src/components/DragAndDrop/Draggable/types.ts +56 -0
  44. package/src/components/DragAndDrop/Droppable/Droppable.example.tsx +86 -0
  45. package/src/components/DragAndDrop/Droppable/Droppable.tsx +38 -0
  46. package/src/components/DragAndDrop/Droppable/constants.ts +15 -0
  47. package/src/components/DragAndDrop/Droppable/index.ts +1 -0
  48. package/src/components/DragAndDrop/Droppable/types.ts +7 -0
  49. package/src/components/DragAndDrop/Sortable/Sortable.example.tsx +61 -0
  50. package/src/components/DragAndDrop/Sortable/Sortable.tsx +65 -0
  51. package/src/components/DragAndDrop/Sortable/constants.ts +12 -0
  52. package/src/components/DragAndDrop/Sortable/index.ts +1 -0
  53. package/src/components/DragAndDrop/Sortable/types.ts +11 -0
  54. package/src/components/DragAndDrop/index.ts +3 -0
  55. package/src/components/Menu/Menubar/Menubar.tsx +5 -1
  56. package/src/components/Menu/Menubar/types.ts +2 -0
  57. package/src/components/Widget/InternalWidgetsContext.tsx +4 -0
  58. package/src/components/Widget/Widget.tsx +17 -0
  59. package/src/components/Widget/Widgets.example.tsx +118 -0
  60. package/src/components/Widget/WidgetsContext.tsx +97 -0
  61. package/src/components/Widget/hooks/index.ts +2 -0
  62. package/src/components/Widget/hooks/useWidget/index.ts +1 -0
  63. package/src/components/Widget/hooks/useWidget/useWidget.ts +21 -0
  64. package/src/components/Widget/hooks/useWidgets/index.ts +1 -0
  65. package/src/components/Widget/hooks/useWidgets/useWidgets.ts +12 -0
  66. package/src/components/Widget/index.ts +3 -0
  67. package/src/components/Widget/modifiers/index.ts +1 -0
  68. package/src/components/Widget/modifiers/restrictToElement.ts +8 -0
  69. package/src/components/Widget/types.ts +30 -0
  70. package/src/index.ts +2 -0
@@ -1,5 +1,7 @@
1
+ import { NameType, Payload as TooltipPayload, ValueType } from 'recharts/types/component/DefaultTooltipContent';
2
+ import { Payload as LegendPayload } from 'recharts/types/component/DefaultLegendContent';
1
3
  import { ChartConfig } from './types';
2
- export declare const getPayloadConfigFromPayload: (config: ChartConfig, payload: unknown, key: string) => ({
4
+ export declare const getPayloadConfigFromPayload: (config: ChartConfig, payload: LegendPayload | TooltipPayload<ValueType, NameType>, key: string) => ({
3
5
  label?: import('react').ReactNode;
4
6
  icon?: import('react').ComponentType;
5
7
  } & ({
@@ -0,0 +1,63 @@
1
+ import { AreaProps, BarProps, LineProps, PieProps, RadarProps, RadialBarProps, XAxisProps, YAxisProps } from 'recharts';
2
+ import { ArgTypes } from '@storybook/react';
3
+ import { CategoricalChartProps } from 'recharts/types/chart/generateCategoricalChart';
4
+ import { Flatten, OmitSVGElement } from './types';
5
+ type AxisProps = {
6
+ xAxis: OmitSVGElement<XAxisProps>;
7
+ yAxis: OmitSVGElement<YAxisProps>;
8
+ };
9
+ export type BarChartProps = {
10
+ bar: OmitSVGElement<BarProps>;
11
+ barChart: CategoricalChartProps;
12
+ } & AxisProps;
13
+ export type BarChartArgs = Partial<Flatten<BarChartProps>> & {};
14
+ export declare const barChartArgs: ArgTypes;
15
+ export type LineChartProps = {
16
+ line: OmitSVGElement<LineProps>;
17
+ lineChart: CategoricalChartProps;
18
+ } & AxisProps;
19
+ export type LineChartArgs = Partial<Flatten<LineChartProps>> & {};
20
+ export declare const lineChartArgs: ArgTypes;
21
+ export type AreaChartProps = {
22
+ area: OmitSVGElement<AreaProps>;
23
+ areaChart: CategoricalChartProps;
24
+ } & AxisProps;
25
+ export type AreaChartArgs = Partial<Flatten<AreaChartProps>> & {};
26
+ export declare const areaArgKey: {
27
+ area: "area";
28
+ areaChart: "areaChart";
29
+ xAxis: "xAxis";
30
+ yAxis: "yAxis";
31
+ };
32
+ export declare const areaChartArgs: ArgTypes;
33
+ export type PieChartProps = {
34
+ pie: OmitSVGElement<PieProps>;
35
+ pieChart: CategoricalChartProps;
36
+ };
37
+ export type PieChartArgs = Partial<Flatten<PieChartProps>> & {};
38
+ export declare const pieArgKey: {
39
+ pie: "pie";
40
+ pieChart: "pieChart";
41
+ };
42
+ export declare const pieChartArgs: ArgTypes;
43
+ export type RadialBarChartProps = {
44
+ radialBar: OmitSVGElement<RadialBarProps>;
45
+ radialBarChart: CategoricalChartProps;
46
+ };
47
+ export type RadialBarChartArgs = Partial<Flatten<RadialBarChartProps>> & {};
48
+ export declare const radialBarArgKey: {
49
+ radialBar: "radialBar";
50
+ radialBarChart: "radialBarChart";
51
+ };
52
+ export declare const radialBarChartArgs: ArgTypes;
53
+ export type RadarChartProps = {
54
+ radar: OmitSVGElement<RadarProps>;
55
+ radarChart: CategoricalChartProps;
56
+ };
57
+ export type RadarChartArgs = Partial<Flatten<RadarChartProps>> & {};
58
+ export declare const radarArgKey: {
59
+ radar: "radar";
60
+ radarChart: "radarChart";
61
+ };
62
+ export declare const radarChartArgs: ArgTypes;
63
+ export {};
@@ -0,0 +1,29 @@
1
+ import { CSSProperties, Ref } from 'react';
2
+ import { DraggableOverlayProps, DraggableProps } from './types';
3
+ declare const Draggable: {
4
+ ({ id, axis, data, disabled, attributes, style, handle, className, ...props }: DraggableProps): import("react/jsx-runtime").JSX.Element;
5
+ Root: import('react').ForwardRefExoticComponent<Partial<{
6
+ axis: import('./types').DraggableAxis;
7
+ style: CSSProperties;
8
+ handle: import('./types').DraggableHandleElement;
9
+ actions: (args: Partial<import('./types').DraggableActionsArgs>) => import('react').ReactNode;
10
+ }> & import('react').HTMLAttributes<HTMLDivElement> & Partial<{
11
+ isDragOverlay: boolean;
12
+ isDragging: boolean;
13
+ listeners: import('@dnd-kit/core').DraggableSyntheticListeners;
14
+ transform: import('@dnd-kit/utilities').Transform | null;
15
+ activatorNodeRef: Ref<HTMLElement>;
16
+ }> & import('react').RefAttributes<HTMLDivElement>>;
17
+ Action: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLButtonElement> & {
18
+ active?: Partial<{
19
+ fill: string;
20
+ background: string;
21
+ }>;
22
+ cursor?: CSSProperties["cursor"];
23
+ } & import('react').RefAttributes<HTMLElement>>;
24
+ Overlay: {
25
+ ({ axis, dropAnimation, className, ...props }: DraggableOverlayProps): import('react').ReactPortal;
26
+ displayName: string;
27
+ };
28
+ };
29
+ export { Draggable };
@@ -0,0 +1,24 @@
1
+ import { DropAnimation, Modifiers, PointerActivationConstraint } from '@dnd-kit/core';
2
+ import { CSSProperties } from 'react';
3
+ import { DraggableAxis, DraggableHandleElement } from './types';
4
+ type DraggableExampleProps = Partial<{
5
+ activationConstraint: PointerActivationConstraint;
6
+ axis: DraggableAxis;
7
+ handle: DraggableHandleElement;
8
+ modifiers: Modifiers;
9
+ buttonStyle: CSSProperties;
10
+ label: string;
11
+ }>;
12
+ export declare const DraggableExample: ({ activationConstraint, axis, handle, modifiers, label, }: DraggableExampleProps) => import("react/jsx-runtime").JSX.Element;
13
+ export declare const DraggableSnapToGridExample: () => import("react/jsx-runtime").JSX.Element;
14
+ type DraggableOverlayExampleProps = Partial<{
15
+ activationConstraint: PointerActivationConstraint;
16
+ axis: DraggableAxis;
17
+ handle: DraggableHandleElement;
18
+ modifiers: Modifiers;
19
+ label: string;
20
+ dragOverlayModifiers: Modifiers;
21
+ dropAnimation: DropAnimation | null;
22
+ }>;
23
+ export declare const DraggableOverlayExample: ({ axis, dropAnimation, handle, label, modifiers, }: DraggableOverlayExampleProps) => import("react/jsx-runtime").JSX.Element;
24
+ export {};
@@ -0,0 +1,9 @@
1
+ import { DropAnimation } from '@dnd-kit/core';
2
+ export declare const DROP_ANIMATION_CONFIG: DropAnimation;
3
+ export declare const getDraggableClasses: (props?: ({
4
+ isDragging?: boolean | null | undefined;
5
+ } & import('class-variance-authority/types').ClassProp) | undefined) => string;
6
+ export declare const getDraggableRootClasses: (props?: ({
7
+ isDragging?: boolean | null | undefined;
8
+ isDragOverlay?: boolean | null | undefined;
9
+ } & import('class-variance-authority/types').ClassProp) | undefined) => string;
@@ -0,0 +1 @@
1
+ export { Draggable } from './Draggable';
@@ -0,0 +1,41 @@
1
+ import { DraggableSyntheticListeners, DragOverlayProps, DropAnimation, UseDraggableArguments } from '@dnd-kit/core';
2
+ import { CSSProperties, ReactNode, Ref } from 'react';
3
+ import { Transform } from '@dnd-kit/utilities';
4
+ export declare enum DraggableAxis {
5
+ All = 0,
6
+ Vertical = 1,
7
+ Horizontal = 2
8
+ }
9
+ export type DraggableHandleElement = JSX.Element | null;
10
+ export type DraggableActionsArgs = {
11
+ draggable: {
12
+ ref: Ref<HTMLElement> | undefined;
13
+ listeners: DraggableSyntheticListeners;
14
+ };
15
+ };
16
+ type BaseDraggableProps = Partial<{
17
+ axis: DraggableAxis;
18
+ style: CSSProperties;
19
+ handle: DraggableHandleElement;
20
+ actions: (args: Partial<DraggableActionsArgs>) => ReactNode;
21
+ }> & React.HTMLAttributes<HTMLDivElement>;
22
+ export type DraggableProps = BaseDraggableProps & UseDraggableArguments;
23
+ export type DraggableRootProps = BaseDraggableProps & Partial<{
24
+ isDragOverlay: boolean;
25
+ isDragging: boolean;
26
+ listeners: DraggableSyntheticListeners;
27
+ transform: Transform | null;
28
+ activatorNodeRef: Ref<HTMLElement>;
29
+ }>;
30
+ export type DraggableActionProps = React.HTMLAttributes<HTMLButtonElement> & {
31
+ active?: Partial<{
32
+ fill: string;
33
+ background: string;
34
+ }>;
35
+ cursor?: CSSProperties["cursor"];
36
+ };
37
+ export type DraggableOverlayProps = {
38
+ axis?: DraggableRootProps["axis"];
39
+ dropAnimation?: DropAnimation | null;
40
+ } & DragOverlayProps;
41
+ export {};
@@ -0,0 +1,2 @@
1
+ import { DroppableProps } from './types';
2
+ export declare const Droppable: ({ children, id, disabled, data, resizeObserverConfig, isDragging, className, ...props }: DroppableProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,10 @@
1
+ import { Modifiers, UniqueIdentifier } from '@dnd-kit/core';
2
+ type CollisionDetectionType = "rectIntersection" | "closestCenter" | "closestCorners" | "pointerWithin";
3
+ type DroppableExampleProps = {
4
+ collisionDetection?: CollisionDetectionType;
5
+ containers?: UniqueIdentifier[];
6
+ modifiers?: Modifiers;
7
+ };
8
+ export declare const DroppableExample: ({ containers, collisionDetection, modifiers, }: DroppableExampleProps) => import("react/jsx-runtime").JSX.Element;
9
+ export declare const CollisionDetectionAlgorithmsDroppableExample: ({ collisionDetection, ...props }: DroppableExampleProps) => import("react/jsx-runtime").JSX.Element;
10
+ export {};
@@ -0,0 +1,5 @@
1
+ export declare const getDroppableClasses: (props?: ({
2
+ isDragging?: boolean | null | undefined;
3
+ isOver?: boolean | null | undefined;
4
+ isEmpty?: boolean | null | undefined;
5
+ } & import('class-variance-authority/types').ClassProp) | undefined) => string;
@@ -0,0 +1 @@
1
+ export { Droppable } from './Droppable';
@@ -0,0 +1,4 @@
1
+ import { UseDroppableArguments } from '@dnd-kit/core';
2
+ export type DroppableProps = Omit<React.HTMLAttributes<HTMLDivElement>, "id"> & UseDroppableArguments & Partial<{
3
+ isDragging: boolean;
4
+ }>;
@@ -0,0 +1,2 @@
1
+ import { SortableProps } from './types';
2
+ export declare const Sortable: ({ id, data, style, className, children, disabled, attributes, resizeObserverConfig, animateLayoutChanges, getNewIndex, strategy, transition, ...props }: SortableProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,6 @@
1
+ import { SortableProps } from './types';
2
+ type SortableExampleProps = Partial<SortableProps> & {
3
+ hasDraggableOverlay?: boolean;
4
+ };
5
+ export declare const SortableExample: ({ hasDraggableOverlay, ...props }: SortableExampleProps) => import("react/jsx-runtime").JSX.Element;
6
+ export {};
@@ -0,0 +1,4 @@
1
+ export declare const getSortableClasses: (props?: ({
2
+ isDragging?: boolean | null | undefined;
3
+ isSorting?: boolean | null | undefined;
4
+ } & import('class-variance-authority/types').ClassProp) | undefined) => string;
@@ -0,0 +1 @@
1
+ export { Sortable } from './Sortable';
@@ -0,0 +1,7 @@
1
+ import { UseSortableArguments } from '@dnd-kit/sortable';
2
+ import { CSSProperties } from 'react';
3
+ import { DraggableAxis, DraggableRootProps } from '../Draggable/types';
4
+ export type SortableProps = Omit<React.HTMLAttributes<HTMLDivElement>, "id"> & UseSortableArguments & Pick<DraggableRootProps, "handle" | "actions"> & Partial<{
5
+ axis: DraggableAxis;
6
+ style: CSSProperties;
7
+ }>;
@@ -0,0 +1,3 @@
1
+ export { Draggable } from './Draggable';
2
+ export { Droppable } from './Droppable';
3
+ export { Sortable } from './Sortable';
@@ -53,7 +53,7 @@ export declare const DatetimeInput: import('react').ForwardRefExoticComponent<{
53
53
  modifiers?: Record<string, import('react-day-picker').Matcher | import('react-day-picker').Matcher[] | undefined> | undefined;
54
54
  labels?: Partial<import('react-day-picker').Labels> | undefined;
55
55
  formatters?: Partial<import('react-day-picker').Formatters> | undefined;
56
- locale?: Partial<import('react-day-picker').Locale> | undefined;
56
+ locale?: Partial<import('date-fns').Locale> | undefined;
57
57
  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;
58
58
  firstWeekContainsDate?: (1 | 4) | undefined;
59
59
  useAdditionalWeekYearTokens?: boolean | undefined;
@@ -0,0 +1,42 @@
1
+ import { MenubarMenuProps, MenubarProps, MenubarShortcutProps } from './types';
2
+ import * as MenubarPrimitive from "@radix-ui/react-menubar";
3
+ declare const Menubar: {
4
+ ({ className, ...props }: MenubarProps): import("react/jsx-runtime").JSX.Element;
5
+ displayName: string | undefined;
6
+ Menu: {
7
+ (props: MenubarMenuProps): import("react/jsx-runtime").JSX.Element;
8
+ displayName: string;
9
+ };
10
+ Group: import('react').ForwardRefExoticComponent<MenubarPrimitive.MenubarGroupProps & import('react').RefAttributes<HTMLDivElement>>;
11
+ Portal: import('react').FC<MenubarPrimitive.MenubarPortalProps>;
12
+ Sub: import('react').FC<MenubarPrimitive.MenubarSubProps>;
13
+ RadioGroup: import('react').ForwardRefExoticComponent<MenubarPrimitive.MenubarRadioGroupProps & import('react').RefAttributes<HTMLDivElement>>;
14
+ Trigger: import('react').ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarTriggerProps & import('react').RefAttributes<HTMLButtonElement>, "ref"> & {
15
+ variant?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | "base" | undefined;
16
+ } & import('react').RefAttributes<HTMLButtonElement>>;
17
+ Content: import('react').ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarContentProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {} & import('react').RefAttributes<HTMLDivElement>>;
18
+ Item: import('react').ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarItemProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
19
+ variant?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | "base" | undefined;
20
+ inset?: boolean | undefined;
21
+ } & import('react').RefAttributes<HTMLDivElement>>;
22
+ Separator: import('react').ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarSeparatorProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {} & import('react').RefAttributes<HTMLDivElement>>;
23
+ Label: import('react').ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarLabelProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
24
+ inset?: boolean | undefined;
25
+ } & import('react').RefAttributes<HTMLDivElement>>;
26
+ CheckboxItem: import('react').ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarCheckboxItemProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
27
+ variant?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | "base" | undefined;
28
+ } & import('react').RefAttributes<HTMLDivElement>>;
29
+ RadioItem: import('react').ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarRadioItemProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
30
+ variant?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | "base" | undefined;
31
+ } & import('react').RefAttributes<HTMLDivElement>>;
32
+ SubContent: import('react').ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarSubContentProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {} & import('react').RefAttributes<HTMLDivElement>>;
33
+ SubTrigger: import('react').ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarSubTriggerProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
34
+ variant?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | "base" | undefined;
35
+ inset?: boolean | undefined;
36
+ } & import('react').RefAttributes<HTMLDivElement>>;
37
+ Shortcut: {
38
+ ({ className, ...props }: MenubarShortcutProps): import("react/jsx-runtime").JSX.Element;
39
+ displayname: string;
40
+ };
41
+ };
42
+ export { Menubar };
@@ -2,6 +2,7 @@ import { VariantProps } from '../../../libs';
2
2
  import { getMenubarCheckboxItemClasses, getMenubarContentClasses, getMenubarItemClasses, getMenubarLabelClasses, getMenubarRadioItemClasses, getMenubarSeparatorClasses, getMenubarShortcutClasses, getMenubarSubContentClasses, getMenubarSubTriggerClasses, getMenubarTriggerClasses } from './constants';
3
3
  import * as MenubarPrimitive from "@radix-ui/react-menubar";
4
4
  export type MenubarProps = React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Root>;
5
+ export type MenubarMenuProps = React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Menu>;
5
6
  export type MenubarTriggerProps = React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Trigger> & VariantProps<typeof getMenubarTriggerClasses>;
6
7
  export type MenubarSubTriggerProps = React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubTrigger> & VariantProps<typeof getMenubarSubTriggerClasses>;
7
8
  export type MenubarContentProps = React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Content> & VariantProps<typeof getMenubarContentClasses>;
@@ -0,0 +1,2 @@
1
+ import { InternalWidgetsContextProps } from './types';
2
+ export declare const InternalWidgetsContext: import('react').Context<InternalWidgetsContextProps | null>;
@@ -0,0 +1,2 @@
1
+ import { WidgetProps } from './types';
2
+ export declare const Widget: ({ id, children, actions, ...props }: WidgetProps) => import("react/jsx-runtime").JSX.Element | null;
@@ -0,0 +1 @@
1
+ export declare const WidgetsExample: () => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,2 @@
1
+ import { WidgetsContextProps } from './types';
2
+ export declare const WidgetsContext: ({ children, initialWidgets }: WidgetsContextProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,2 @@
1
+ export { useWidget } from './useWidget';
2
+ export { useWidgets } from './useWidgets';
@@ -0,0 +1 @@
1
+ export { useWidget } from './useWidget';
@@ -0,0 +1,7 @@
1
+ import { UniqueIdentifier } from '@dnd-kit/core';
2
+ export declare const useWidget: (id: UniqueIdentifier) => {
3
+ widget: import('@dnd-kit/core').Data<{
4
+ id: UniqueIdentifier;
5
+ }> | undefined;
6
+ deleteWidget: () => void;
7
+ };
@@ -0,0 +1 @@
1
+ export { useWidgets } from './useWidgets';
@@ -0,0 +1 @@
1
+ export declare const useWidgets: () => import('../../types').InternalWidgetsContextProps;
@@ -0,0 +1,3 @@
1
+ export * from './hooks';
2
+ export { Widget } from './Widget';
3
+ export { WidgetsContext } from './WidgetsContext';
@@ -0,0 +1 @@
1
+ export { restrictToElement } from './restrictToElement';
@@ -0,0 +1,2 @@
1
+ import { Modifier } from '@dnd-kit/core';
2
+ export declare const restrictToElement: (rect: DOMRect | null | undefined) => Modifier;
@@ -0,0 +1,28 @@
1
+ import { Data, UniqueIdentifier } from '@dnd-kit/core';
2
+ import { ReactNode } from 'react';
3
+ import { DraggableActionsArgs } from '../DragAndDrop/Draggable/types';
4
+ import { SortableProps } from '../DragAndDrop/Sortable/types';
5
+ export type Widget = Data<{
6
+ id: UniqueIdentifier;
7
+ }>;
8
+ type WidgetActions = (args: Partial<DraggableActionsArgs> & {
9
+ deleteWidget: () => void;
10
+ }) => ReactNode;
11
+ export type WidgetProps = Omit<SortableProps, "actions"> & {
12
+ actions?: WidgetActions;
13
+ };
14
+ export type WidgetsContextProps = {
15
+ children?: ReactNode;
16
+ initialWidgets?: Widget[];
17
+ };
18
+ export type InternalWidgetsContextProps = {
19
+ widgets: Data<{
20
+ id: UniqueIdentifier;
21
+ }>[];
22
+ addWidget: (widget: Widget, insertIndex?: number) => void;
23
+ addWidgets: (widgets: Widget[], startIndex?: number) => void;
24
+ deleteWidget: (widget: Widget) => void;
25
+ deleteWidgets: (widgets: Widget[]) => void;
26
+ resetWidgets: () => void;
27
+ };
28
+ export {};
@@ -35,8 +35,10 @@ export * from './components/Skeleton';
35
35
  export * from './components/Tooltip';
36
36
  /** composable */
37
37
  export * from './components/AlertDialog';
38
+ export * from './components/Chart';
38
39
  export * from './components/Command';
39
40
  export * from './components/Dialog';
40
41
  export * from './components/HoverCard';
41
42
  export * from './components/Popover';
42
43
  export * from './components/Slot';
44
+ export * from './components/Widget';
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mbao01/common",
3
3
  "private": false,
4
- "version": "0.0.45",
4
+ "version": "0.0.47",
5
5
  "type": "module",
6
6
  "author": "Ayomide Bakare",
7
7
  "license": "MIT",
@@ -62,88 +62,92 @@
62
62
  "test:coverage": "vitest run --coverage",
63
63
  "test:ui": "vitest --ui",
64
64
  "test:visual": "test-storybook --url http://127.0.0.1:6006",
65
- "test:visual:coverage": "test-storybook --coverage",
65
+ "test:visual:coverage": "test-storybook --coverage --url http://127.0.0.1:6006",
66
66
  "test:visual:ci": "test-storybook --ci --verbose --url http://127.0.0.1:6006",
67
- "test:visual:watch": "test-storybook --watch",
67
+ "test:visual:watch": "test-storybook --watch --url http://127.0.0.1:6006",
68
68
  "test:watch": "vitest"
69
69
  },
70
70
  "dependencies": {
71
- "@radix-ui/react-accordion": "^1.2.0",
72
- "@radix-ui/react-alert-dialog": "^1.1.1",
73
- "@radix-ui/react-avatar": "^1.1.0",
74
- "@radix-ui/react-checkbox": "^1.1.1",
75
- "@radix-ui/react-collapsible": "^1.1.0",
76
- "@radix-ui/react-context-menu": "^2.2.1",
77
- "@radix-ui/react-dialog": "^1.1.1",
78
- "@radix-ui/react-dropdown-menu": "^2.1.1",
79
- "@radix-ui/react-hover-card": "^1.1.1",
71
+ "@dnd-kit/core": "^6.1.0",
72
+ "@dnd-kit/modifiers": "^7.0.0",
73
+ "@dnd-kit/sortable": "^8.0.0",
74
+ "@dnd-kit/utilities": "^3.2.2",
75
+ "@radix-ui/react-accordion": "^1.2.1",
76
+ "@radix-ui/react-alert-dialog": "^1.1.2",
77
+ "@radix-ui/react-avatar": "^1.1.1",
78
+ "@radix-ui/react-checkbox": "^1.1.2",
79
+ "@radix-ui/react-collapsible": "^1.1.1",
80
+ "@radix-ui/react-context-menu": "^2.2.2",
81
+ "@radix-ui/react-dialog": "^1.1.2",
82
+ "@radix-ui/react-dropdown-menu": "^2.1.2",
83
+ "@radix-ui/react-hover-card": "^1.1.2",
80
84
  "@radix-ui/react-icons": "^1.3.0",
81
85
  "@radix-ui/react-label": "^2.1.0",
82
- "@radix-ui/react-menubar": "^1.1.1",
83
- "@radix-ui/react-navigation-menu": "^1.2.0",
84
- "@radix-ui/react-popover": "^1.1.1",
86
+ "@radix-ui/react-menubar": "^1.1.2",
87
+ "@radix-ui/react-navigation-menu": "^1.2.1",
88
+ "@radix-ui/react-popover": "^1.1.2",
85
89
  "@radix-ui/react-progress": "^1.1.0",
86
- "@radix-ui/react-scroll-area": "^1.1.0",
87
- "@radix-ui/react-select": "^2.1.1",
90
+ "@radix-ui/react-scroll-area": "^1.2.0",
91
+ "@radix-ui/react-select": "^2.1.2",
88
92
  "@radix-ui/react-separator": "^1.1.0",
89
- "@radix-ui/react-slider": "^1.2.0",
93
+ "@radix-ui/react-slider": "^1.2.1",
90
94
  "@radix-ui/react-slot": "^1.1.0",
91
- "@radix-ui/react-tabs": "^1.1.0",
95
+ "@radix-ui/react-tabs": "^1.1.1",
92
96
  "@radix-ui/react-toggle": "^1.1.0",
93
97
  "@radix-ui/react-toggle-group": "^1.1.0",
94
- "@radix-ui/react-tooltip": "^1.1.2",
98
+ "@radix-ui/react-tooltip": "^1.1.3",
95
99
  "@tailwindcss/typography": "^0.5.15",
96
100
  "chrono-node": "^2.7.7",
97
101
  "class-variance-authority": "^0.7.0",
98
102
  "clsx": "^2.1.1",
99
103
  "cmdk": "^1.0.0",
100
- "daisyui": "^4.12.10",
104
+ "daisyui": "^4.12.13",
101
105
  "embla-carousel-react": "^8.3.0",
102
- "react-dropzone": "^14.2.3",
106
+ "react-dropzone": "^14.2.10",
103
107
  "react-international-phone": "^4.3.0",
104
108
  "react-otp-input": "^3.1.1",
105
- "recharts": "^2.12.7",
109
+ "recharts": "^2.13.0",
106
110
  "sonner": "^1.5.0",
107
- "tailwind-merge": "^2.5.2",
111
+ "tailwind-merge": "^2.5.4",
108
112
  "tailwindcss-animate": "^1.0.7",
109
- "universal-cookie": "^7.2.0",
110
- "vaul": "^1.0.0"
113
+ "universal-cookie": "^7.2.1",
114
+ "vaul": "^1.1.0"
111
115
  },
112
116
  "devDependencies": {
113
117
  "@ianvs/prettier-plugin-sort-imports": "^4.3.1",
114
- "@storybook/addon-a11y": "^8.3.4",
118
+ "@storybook/addon-a11y": "^8.3.6",
115
119
  "@storybook/addon-coverage": "^1.0.4",
116
- "@storybook/addon-essentials": "^8.3.4",
117
- "@storybook/addon-interactions": "^8.3.4",
118
- "@storybook/addon-links": "^8.3.4",
119
- "@storybook/addon-onboarding": "^8.3.4",
120
- "@storybook/addon-storysource": "^8.3.4",
121
- "@storybook/addon-themes": "^8.3.4",
122
- "@storybook/addon-viewport": "^8.3.4",
123
- "@storybook/blocks": "^8.3.4",
124
- "@storybook/react": "^8.3.4",
125
- "@storybook/react-vite": "^8.3.4",
126
- "@storybook/test": "^8.3.4",
120
+ "@storybook/addon-essentials": "^8.3.6",
121
+ "@storybook/addon-interactions": "^8.3.6",
122
+ "@storybook/addon-links": "^8.3.6",
123
+ "@storybook/addon-onboarding": "^8.3.6",
124
+ "@storybook/addon-storysource": "^8.3.6",
125
+ "@storybook/addon-themes": "^8.3.6",
126
+ "@storybook/addon-viewport": "^8.3.6",
127
+ "@storybook/blocks": "^8.3.6",
128
+ "@storybook/react": "^8.3.6",
129
+ "@storybook/react-vite": "^8.3.6",
130
+ "@storybook/test": "^8.3.6",
127
131
  "@storybook/test-runner": "^0.19.1",
128
- "@testing-library/jest-dom": "^6.5.0",
132
+ "@testing-library/jest-dom": "^6.6.2",
129
133
  "@testing-library/react": "^16.0.1",
130
134
  "@testing-library/user-event": "^14.5.2",
131
135
  "@types/jest-image-snapshot": "^6.4.0",
132
- "@types/node": "^22.7.4",
133
- "@types/react": "^18.3.10",
134
- "@types/react-dom": "^18.3.0",
135
- "@typescript-eslint/eslint-plugin": "^8.7.0",
136
- "@typescript-eslint/parser": "^8.7.0",
137
- "@vitejs/plugin-react": "^4.3.1",
138
- "@vitest/coverage-v8": "^2.1.1",
139
- "@vitest/ui": "^2.1.1",
136
+ "@types/node": "^22.7.9",
137
+ "@types/react": "^18.3.12",
138
+ "@types/react-dom": "^18.3.1",
139
+ "@typescript-eslint/eslint-plugin": "^8.11.0",
140
+ "@typescript-eslint/parser": "^8.11.0",
141
+ "@vitejs/plugin-react": "^4.3.3",
142
+ "@vitest/coverage-v8": "^2.1.3",
143
+ "@vitest/ui": "^2.1.3",
140
144
  "autoprefixer": "^10.4.20",
141
145
  "axe-playwright": "^2.0.3",
142
146
  "date-fns": "^4.1.0",
143
147
  "eslint": "^8.57.1",
144
- "eslint-plugin-react": "^7.37.0",
148
+ "eslint-plugin-react": "^7.37.2",
145
149
  "eslint-plugin-react-hooks": "^4.6.2",
146
- "eslint-plugin-react-refresh": "^0.4.12",
150
+ "eslint-plugin-react-refresh": "^0.4.13",
147
151
  "eslint-plugin-storybook": "^0.9.0",
148
152
  "jest-image-snapshot": "^6.4.0",
149
153
  "jsdom": "^25.0.1",
@@ -151,21 +155,21 @@
151
155
  "postcss": "^8.4.47",
152
156
  "prettier": "^3.3.3",
153
157
  "react": "^18.3.1",
154
- "react-day-picker": "^9.1.3",
158
+ "react-day-picker": "^9.2.0",
155
159
  "react-dom": "^18.3.1",
156
- "react-router-dom": "^6.26.2",
157
- "storybook": "^8.3.4",
158
- "tailwindcss": "^3.4.13",
159
- "timescape": "^0.5.2",
160
- "typescript": "^5.6.2",
161
- "vite": "^5.4.8",
162
- "vite-plugin-dts": "^4.2.2",
163
- "vitest": "^2.1.1"
160
+ "react-router-dom": "^6.27.0",
161
+ "storybook": "^8.3.6",
162
+ "tailwindcss": "^3.4.14",
163
+ "timescape": "^0.6.1",
164
+ "typescript": "^5.6.3",
165
+ "vite": "^5.4.10",
166
+ "vite-plugin-dts": "^4.3.0",
167
+ "vitest": "^2.1.3"
164
168
  },
165
169
  "peerDependencies": {
166
170
  "react": "^18.2.0",
167
171
  "react-dom": "^18.2.0",
168
172
  "typescript": "^5.2.2"
169
173
  },
170
- "gitHead": "097691180db90aaf22c9557d1f2f919246b167c1"
174
+ "gitHead": "072705c2bbc597d54185c788469a97cb32ad145f"
171
175
  }