@shohojdhara/atomix 0.1.21 → 0.1.24

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 (115) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/NPM_PUBLISHING.md +221 -0
  3. package/README.md +50 -124
  4. package/css.d.ts +0 -0
  5. package/dist/css/atomix.css +1 -1
  6. package/dist/js/628.js +1 -0
  7. package/dist/js/atomix.react.cjs.js +1 -0
  8. package/dist/js/atomix.react.esm.js +1 -1
  9. package/dist/js/atomix.react.umd.js +1 -1
  10. package/dist/js/chunks/cjs/202.6e2b9e63a406ff01b151.js +1 -0
  11. package/dist/js/chunks/cjs/308.86b2e7ea63bf439e01b4.js +1 -0
  12. package/dist/js/chunks/cjs/54.54733c458fc7ced6d9ba.js +1 -0
  13. package/dist/js/chunks/cjs/619.8e6863cb2985a3a109af.js +1 -0
  14. package/dist/js/chunks/cjs/690.17522d562f7ebe2fa7b4.js +1 -0
  15. package/dist/js/chunks/cjs/894.6edddf7d4bf7ccb11e25.js +1 -0
  16. package/dist/js/chunks/cjs/897.74f4c88710fe45c1b9e3.js +1 -0
  17. package/dist/types/components/Breadcrumb/index.d.ts +2 -3
  18. package/dist/types/components/River/index.d.ts +1 -1
  19. package/dist/types/components/Tab/index.d.ts +2 -2
  20. package/dist/types/components/Toggle/index.d.ts +2 -2
  21. package/dist/types/components/Tooltip/index.d.ts +2 -3
  22. package/index.d.ts +3 -0
  23. package/package.json +38 -86
  24. package/src/components/Accordion/index.ts +0 -0
  25. package/src/components/AtomixLogo/index.ts +0 -0
  26. package/src/components/Button/index.ts +0 -0
  27. package/src/components/Navigation/Menu/Menu.stories.tsx +0 -0
  28. package/src/components/Navigation/Nav/Nav.stories.tsx +0 -0
  29. package/src/components/Navigation/README.md +0 -0
  30. package/src/components/Navigation/SideMenu/SideMenu.README.md +0 -0
  31. package/src/components/Navigation/SideMenu/SideMenu.stories.tsx +0 -0
  32. package/src/components/Navigation/SideMenu/SideMenu.tsx +0 -0
  33. package/src/components/Navigation/SideMenu/SideMenuItem.tsx +0 -0
  34. package/src/components/Navigation/SideMenu/SideMenuList.tsx +0 -0
  35. package/src/components/Navigation/scripts/NavbarInteractions.ts +0 -0
  36. package/src/components/Navigation/scripts/SideMenu.ts +0 -0
  37. package/src/components/Navigation/scripts/SideMenuBundle.ts +0 -0
  38. package/src/components/Navigation/scripts/SideMenuInteractions.ts +0 -0
  39. package/src/components/Navigation/scripts/bundle.ts +0 -0
  40. package/src/components/Navigation/scripts/index.ts +0 -0
  41. package/src/components/PhotoViewer/README.md +0 -0
  42. package/src/components/index.ts +0 -0
  43. package/src/docs/atomix-component-guidelines.mdx +0 -0
  44. package/src/index.ts +10 -5
  45. package/src/layouts/index.ts +5 -0
  46. package/src/lib/README.md +0 -0
  47. package/src/lib/composables/useSideMenu.ts +0 -0
  48. package/src/lib/index.ts +6 -6
  49. package/src/styles/01-settings/_settings.animations.scss +7 -2
  50. package/src/styles/01-settings/_settings.box-shadow.scss +9 -5
  51. package/src/styles/01-settings/_settings.button.scss +5 -0
  52. package/src/styles/01-settings/_settings.card.scss +2 -1
  53. package/src/styles/01-settings/_settings.form.scss +3 -0
  54. package/src/styles/01-settings/_settings.navbar.scss +1 -0
  55. package/src/styles/01-settings/_settings.typography.scss +2 -2
  56. package/src/styles/01-settings/_settings.z-layers.scss +19 -1
  57. package/src/styles/css-modules.d.ts +308 -0
  58. package/CONTRIBUTING.md +0 -151
  59. package/NEXTJS_INTEGRATION.md +0 -389
  60. package/babel.config.js +0 -58
  61. package/dist/types/layouts/Grid/Container.d.ts +0 -38
  62. package/dist/types/layouts/Grid/Grid.d.ts +0 -37
  63. package/dist/types/layouts/Grid/GridCol.d.ts +0 -64
  64. package/dist/types/layouts/Grid/Row.d.ts +0 -38
  65. package/dist/types/layouts/Grid/index.d.ts +0 -8
  66. package/dist/types/layouts/MasonryGrid/MasonryGrid.d.ts +0 -71
  67. package/dist/types/layouts/MasonryGrid/MasonryGridItem.d.ts +0 -24
  68. package/dist/types/layouts/MasonryGrid/index.d.ts +0 -4
  69. package/dist/types/layouts/index.d.ts +0 -2
  70. package/dist/types/lib/composables/index.d.ts +0 -30
  71. package/dist/types/lib/composables/useAccordion.d.ts +0 -30
  72. package/dist/types/lib/composables/useBadge.d.ts +0 -10
  73. package/dist/types/lib/composables/useBreadcrumb.d.ts +0 -13
  74. package/dist/types/lib/composables/useButton.d.ts +0 -11
  75. package/dist/types/lib/composables/useCallout.d.ts +0 -11
  76. package/dist/types/lib/composables/useCard.d.ts +0 -8
  77. package/dist/types/lib/composables/useCheckbox.d.ts +0 -11
  78. package/dist/types/lib/composables/useDataTable.d.ts +0 -66
  79. package/dist/types/lib/composables/useDatePicker.d.ts +0 -91
  80. package/dist/types/lib/composables/useDropdown.d.ts +0 -26
  81. package/dist/types/lib/composables/useEdgePanel.d.ts +0 -15
  82. package/dist/types/lib/composables/useForm.d.ts +0 -12
  83. package/dist/types/lib/composables/useFormGroup.d.ts +0 -10
  84. package/dist/types/lib/composables/useHero.d.ts +0 -53
  85. package/dist/types/lib/composables/useInput.d.ts +0 -12
  86. package/dist/types/lib/composables/useMessages.d.ts +0 -38
  87. package/dist/types/lib/composables/useModal.d.ts +0 -40
  88. package/dist/types/lib/composables/useNavbar.d.ts +0 -59
  89. package/dist/types/lib/composables/usePagination.d.ts +0 -13
  90. package/dist/types/lib/composables/usePhotoViewer.d.ts +0 -57
  91. package/dist/types/lib/composables/usePopover.d.ts +0 -30
  92. package/dist/types/lib/composables/useProgress.d.ts +0 -38
  93. package/dist/types/lib/composables/useRadio.d.ts +0 -10
  94. package/dist/types/lib/composables/useRating.d.ts +0 -52
  95. package/dist/types/lib/composables/useRiver.d.ts +0 -107
  96. package/dist/types/lib/composables/useSelect.d.ts +0 -10
  97. package/dist/types/lib/composables/useSideMenu.d.ts +0 -28
  98. package/dist/types/lib/composables/useSpinner.d.ts +0 -10
  99. package/dist/types/lib/composables/useTextarea.d.ts +0 -10
  100. package/dist/types/lib/composables/useTodo.d.ts +0 -18
  101. package/dist/types/lib/constants/components.d.ts +0 -993
  102. package/dist/types/lib/constants/index.d.ts +0 -1
  103. package/dist/types/lib/index.d.ts +0 -6
  104. package/dist/types/lib/types/components.d.ts +0 -2050
  105. package/dist/types/lib/types/index.d.ts +0 -1
  106. package/dist/types/lib/utils/dom.d.ts +0 -26
  107. package/dist/types/lib/utils/icons.d.ts +0 -20
  108. package/dist/types/lib/utils/index.d.ts +0 -3
  109. package/dist/types/lib/utils/useForkRef.d.ts +0 -10
  110. package/examples/nextjs-example.tsx +0 -271
  111. package/implementation-guide.md +0 -505
  112. package/next.config.js +0 -90
  113. package/postcss.config.js +0 -28
  114. package/tsconfig.json +0 -74
  115. package/webpack.config.js +0 -473
@@ -1,57 +0,0 @@
1
- import React from 'react';
2
- interface UsePhotoViewerProps {
3
- images: (string | {
4
- src: string;
5
- [key: string]: any;
6
- })[];
7
- startIndex?: number;
8
- enableGestures?: boolean;
9
- onImageChange?: (index: number) => void;
10
- onClose?: () => void;
11
- }
12
- export declare const usePhotoViewer: ({ images, startIndex, enableGestures, onImageChange, onClose, }: UsePhotoViewerProps) => {
13
- currentIndex: number;
14
- isModalOpen: boolean;
15
- zoomLevel: number;
16
- imagePosition: {
17
- x: number;
18
- y: number;
19
- };
20
- isDragging: boolean;
21
- isFullscreen: boolean;
22
- rotationAngle: number;
23
- showInfo: boolean;
24
- imageRef: React.MutableRefObject<HTMLImageElement>;
25
- containerRef: React.MutableRefObject<HTMLDivElement>;
26
- isTransitioning: boolean;
27
- setCurrentIndex: React.Dispatch<React.SetStateAction<number>>;
28
- setZoomLevel: (zoom: number | ((prev: number) => number)) => void;
29
- setImagePosition: (position: {
30
- x: number;
31
- y: number;
32
- } | ((prev: {
33
- x: number;
34
- y: number;
35
- }) => {
36
- x: number;
37
- y: number;
38
- })) => void;
39
- setIsDragging: React.Dispatch<React.SetStateAction<boolean>>;
40
- setIsFullscreen: React.Dispatch<React.SetStateAction<boolean>>;
41
- setRotationAngle: (rotation: number | ((prev: number) => number)) => void;
42
- setShowInfo: React.Dispatch<React.SetStateAction<boolean>>;
43
- openModal: () => void;
44
- closeModal: () => void;
45
- goToPrevious: () => void;
46
- goToNext: () => void;
47
- handleWheel: (event: React.WheelEvent<HTMLDivElement>) => void;
48
- handleMouseDown: (event: React.MouseEvent<HTMLDivElement | HTMLImageElement, MouseEvent>) => void;
49
- handleMouseMove: (event: React.MouseEvent<HTMLDivElement | HTMLImageElement, MouseEvent>) => void;
50
- handleMouseUp: () => void;
51
- handleTouchStart: (event: React.TouchEvent<HTMLImageElement | HTMLDivElement>) => void;
52
- handleTouchMove: (event: React.TouchEvent<HTMLImageElement | HTMLDivElement>) => void;
53
- handleTouchEnd: () => void;
54
- handleDoubleClick: (event: React.MouseEvent) => void;
55
- resetImageState: () => void;
56
- };
57
- export {};
@@ -1,30 +0,0 @@
1
- import { RefObject } from 'react';
2
- type PopoverPosition = 'top' | 'bottom' | 'left' | 'right';
3
- type PopoverTrigger = 'click' | 'hover';
4
- interface UsePopoverProps {
5
- position?: PopoverPosition | 'auto';
6
- trigger?: PopoverTrigger;
7
- offset?: number;
8
- delay?: number;
9
- defaultOpen?: boolean;
10
- isOpen?: boolean;
11
- onOpenChange?: (isOpen: boolean) => void;
12
- closeOnClickOutside?: boolean;
13
- closeOnEscape?: boolean;
14
- id?: string;
15
- }
16
- interface UsePopoverResult {
17
- isOpen: boolean;
18
- setIsOpen: (isOpen: boolean) => void;
19
- triggerRef: RefObject<HTMLElement>;
20
- popoverRef: RefObject<HTMLDivElement>;
21
- arrowRef: RefObject<HTMLDivElement>;
22
- popoverId: string;
23
- currentPosition: PopoverPosition;
24
- updatePosition: () => void;
25
- }
26
- /**
27
- * Hook for managing popover state and positioning logic
28
- */
29
- export declare const usePopover: ({ position, trigger, offset, delay, defaultOpen, isOpen: controlledIsOpen, onOpenChange, closeOnClickOutside, closeOnEscape, id, }: UsePopoverProps) => UsePopoverResult;
30
- export default usePopover;
@@ -1,38 +0,0 @@
1
- import { ThemeColor } from '../types/components';
2
- interface UseProgressProps {
3
- /**
4
- * Progress value from 0 to 100
5
- */
6
- value: number;
7
- /**
8
- * Optional color variant
9
- */
10
- variant?: ThemeColor;
11
- /**
12
- * Optional size
13
- */
14
- size?: 'sm' | 'md' | 'lg';
15
- /**
16
- * Optional className for custom styling
17
- */
18
- className?: string;
19
- }
20
- interface UseProgressReturn {
21
- /**
22
- * Computed progress value clamped between 0 and 100
23
- */
24
- progressValue: number;
25
- /**
26
- * CSS properties for the progress component
27
- */
28
- progressStyle: React.CSSProperties;
29
- /**
30
- * CSS classes for the progress component
31
- */
32
- progressClasses: string;
33
- }
34
- /**
35
- * Hook for managing Progress component state and behavior
36
- */
37
- export declare const useProgress: ({ value, variant, size, className, }: UseProgressProps) => UseProgressReturn;
38
- export {};
@@ -1,10 +0,0 @@
1
- import { RadioProps } from '../types/components';
2
- /**
3
- * Radio state and functionality
4
- * @param initialProps - Initial radio properties
5
- * @returns Radio state and methods
6
- */
7
- export declare function useRadio(initialProps?: Partial<RadioProps>): {
8
- defaultProps: Partial<RadioProps>;
9
- generateRadioClass: (props: Partial<RadioProps>) => string;
10
- };
@@ -1,52 +0,0 @@
1
- import type { RatingProps } from '../types/components';
2
- /**
3
- * Props for the useRating hook
4
- */
5
- export type UseRatingProps = Pick<RatingProps, 'value' | 'maxValue' | 'allowHalf' | 'readOnly' | 'onChange'>;
6
- export interface UseRatingReturn {
7
- /**
8
- * Current rating value (controlled or uncontrolled)
9
- */
10
- currentValue: number;
11
- /**
12
- * Value being hovered over
13
- */
14
- hoverValue: number | null;
15
- /**
16
- * Currently focused star index
17
- */
18
- focusedIndex: number | null;
19
- /**
20
- * Handle mouse enter on a star
21
- */
22
- handleMouseEnter: (starValue: number) => void;
23
- /**
24
- * Handle mouse leave from rating component
25
- */
26
- handleMouseLeave: () => void;
27
- /**
28
- * Handle click on a star
29
- */
30
- handleClick: (newValue: number) => void;
31
- /**
32
- * Handle keyboard navigation
33
- */
34
- handleKeyDown: (e: React.KeyboardEvent, index: number) => void;
35
- /**
36
- * Set focus on a specific star
37
- */
38
- setFocused: (index: number | null) => void;
39
- /**
40
- * Set hover value directly
41
- */
42
- setHoverValue: (value: number | null) => void;
43
- /**
44
- * Whether the component is in controlled mode
45
- */
46
- isControlled: boolean;
47
- }
48
- /**
49
- * Hook for managing rating component state and interactions
50
- */
51
- export declare const useRating: ({ value, maxValue, allowHalf, readOnly, onChange, }: UseRatingProps) => UseRatingReturn;
52
- export default useRating;
@@ -1,107 +0,0 @@
1
- import { ReactNode } from 'react';
2
- /**
3
- * River content column interface
4
- */
5
- export interface RiverContentColumn {
6
- /**
7
- * Column type (title or text)
8
- */
9
- type: 'title' | 'text';
10
- /**
11
- * Content for the column
12
- */
13
- content: ReactNode;
14
- }
15
- /**
16
- * River properties interface
17
- */
18
- export interface RiverProps {
19
- /**
20
- * Title of the river section
21
- */
22
- title?: ReactNode;
23
- /**
24
- * Text content (can be a string or array of paragraphs)
25
- */
26
- text?: string | string[];
27
- /**
28
- * Action buttons/links
29
- */
30
- actions?: ReactNode;
31
- /**
32
- * Image source URL
33
- */
34
- imageSrc?: string;
35
- /**
36
- * Image alt text
37
- */
38
- imageAlt?: string;
39
- /**
40
- * Whether to use the center layout
41
- */
42
- center?: boolean;
43
- /**
44
- * Whether to use the breakout layout
45
- */
46
- breakout?: boolean;
47
- /**
48
- * Whether to use the reverse layout (image on right)
49
- */
50
- reverse?: boolean;
51
- /**
52
- * Use content columns instead of simple title/text structure
53
- */
54
- contentColumns?: RiverContentColumn[];
55
- /**
56
- * Additional CSS class
57
- */
58
- className?: string;
59
- /**
60
- * Background image source
61
- */
62
- backgroundImageSrc?: string;
63
- /**
64
- * Whether to show the background overlay
65
- */
66
- showOverlay?: boolean;
67
- /**
68
- * Custom width for the river content
69
- */
70
- contentWidth?: string;
71
- }
72
- /**
73
- * River hook result interface
74
- */
75
- interface UseRiverResult {
76
- /**
77
- * Generate river class names based on props
78
- */
79
- generateRiverClassNames: (baseClassName?: string) => string;
80
- /**
81
- * Generate content class names
82
- */
83
- generateContentClass: () => string;
84
- /**
85
- * Generate visual/image class names
86
- */
87
- generateVisualClass: () => string;
88
- /**
89
- * Determine if the river has a background image
90
- */
91
- hasBackgroundImage: boolean;
92
- /**
93
- * Determine if the river has a foreground image
94
- */
95
- hasForegroundImage: boolean;
96
- /**
97
- * Convert text to array if it's a string
98
- */
99
- textContent: string[];
100
- }
101
- /**
102
- * Hook for River component functionality
103
- * @param initialProps - Initial river props
104
- * @returns River methods and state
105
- */
106
- export declare function useRiver(initialProps?: Partial<RiverProps>): UseRiverResult;
107
- export {};
@@ -1,10 +0,0 @@
1
- import { SelectProps } from '../types/components';
2
- /**
3
- * Select state and functionality
4
- * @param initialProps - Initial select properties
5
- * @returns Select state and methods
6
- */
7
- export declare function useSelect(initialProps?: Partial<SelectProps>): {
8
- defaultProps: Partial<SelectProps>;
9
- generateSelectClass: (props: Partial<SelectProps>) => string;
10
- };
@@ -1,28 +0,0 @@
1
- import { SideMenuProps, SideMenuItemProps } from '../types/components';
2
- /**
3
- * SideMenu state and functionality
4
- * @param initialProps - Initial side menu properties
5
- * @returns SideMenu state and methods
6
- */
7
- export declare function useSideMenu(initialProps?: Partial<SideMenuProps>): {
8
- defaultProps: Partial<SideMenuProps>;
9
- isOpenState: boolean;
10
- wrapperRef: import("react").MutableRefObject<HTMLDivElement>;
11
- innerRef: import("react").MutableRefObject<HTMLDivElement>;
12
- generateSideMenuClass: (props: Partial<SideMenuProps & {
13
- isOpen?: boolean;
14
- }>) => string;
15
- generateWrapperClass: () => string;
16
- handleToggle: () => void;
17
- getCurrentOpenState: () => boolean;
18
- };
19
- /**
20
- * SideMenuItem state and functionality
21
- * @param initialProps - Initial side menu item properties
22
- * @returns SideMenuItem state and methods
23
- */
24
- export declare function useSideMenuItem(initialProps?: Partial<SideMenuItemProps>): {
25
- defaultProps: Partial<SideMenuItemProps>;
26
- generateSideMenuItemClass: () => string;
27
- handleClick: (handler?: (event: React.MouseEvent) => void) => (e: React.MouseEvent) => void;
28
- };
@@ -1,10 +0,0 @@
1
- import { SpinnerProps } from '../types/components';
2
- /**
3
- * Spinner state and functionality
4
- * @param initialProps - Initial spinner properties
5
- * @returns Spinner state and methods
6
- */
7
- export declare function useSpinner(initialProps?: Partial<SpinnerProps>): {
8
- defaultProps: Partial<SpinnerProps>;
9
- generateSpinnerClass: (props: Partial<SpinnerProps>) => string;
10
- };
@@ -1,10 +0,0 @@
1
- import { TextareaProps } from '../types/components';
2
- /**
3
- * Textarea state and functionality
4
- * @param initialProps - Initial textarea properties
5
- * @returns Textarea state and methods
6
- */
7
- export declare function useTextarea(initialProps?: Partial<TextareaProps>): {
8
- defaultProps: Partial<TextareaProps>;
9
- generateTextareaClass: (props: Partial<TextareaProps>) => string;
10
- };
@@ -1,18 +0,0 @@
1
- import { TodoItem, TodoProps } from '../types/components';
2
- /**
3
- * Todo composable hook - manages todo items state and operations
4
- * @param initialProps - Initial todo properties
5
- * @returns Todo state and methods
6
- */
7
- export declare function useTodo(initialProps?: Partial<TodoProps>): {
8
- items: TodoItem[];
9
- inputText: string;
10
- setInputText: import("react").Dispatch<import("react").SetStateAction<string>>;
11
- addTodo: (text: string) => TodoItem | null;
12
- toggleTodo: (id: string) => TodoItem | null;
13
- deleteTodo: (id: string) => boolean;
14
- handleSubmit: (event: React.FormEvent, onAddTodo?: (text: string) => void) => void;
15
- generateTodoClasses: (props: Partial<TodoProps>) => string;
16
- generateItemClasses: (item: TodoItem) => string;
17
- getFilteredItems: (showCompleted?: boolean) => TodoItem[];
18
- };