@neuctra/ui 0.2.1 → 0.2.3
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/components/basic/Accordation.d.ts +27 -18
- package/dist/components/basic/Alert.d.ts +15 -2
- package/dist/components/basic/Avatar.d.ts +5 -3
- package/dist/components/basic/Badge.d.ts +3 -3
- package/dist/components/basic/Button.d.ts +15 -17
- package/dist/components/basic/Card.d.ts +7 -49
- package/dist/components/basic/CheckRadioInput.d.ts +3 -1
- package/dist/components/basic/Container.d.ts +28 -26
- package/dist/components/basic/Drawer.d.ts +20 -11
- package/dist/components/basic/Flexbox.d.ts +18 -10
- package/dist/components/basic/GridView.d.ts +7 -5
- package/dist/components/basic/Image.d.ts +31 -6
- package/dist/components/basic/Input.d.ts +18 -10
- package/dist/components/basic/List.d.ts +11 -3
- package/dist/components/basic/Modal.d.ts +15 -2
- package/dist/components/basic/Section.d.ts +36 -0
- package/dist/components/basic/Stack.d.ts +27 -0
- package/dist/components/basic/Table.d.ts +18 -54
- package/dist/components/basic/Tabs.d.ts +28 -28
- package/dist/components/basic/Text.d.ts +19 -32
- package/dist/index.cjs.js +68 -223
- package/dist/index.cjs.js.map +1 -0
- package/dist/index.d.ts +17 -19
- package/dist/index.es.js +3169 -6313
- package/dist/index.es.js.map +1 -0
- package/dist/src/components/avatar/AvatarGroup.js +9 -0
- package/dist/src/components/avatar/AvatarWithStatus.js +18 -0
- package/dist/src/components/basic/Accordation.js +74 -0
- package/dist/src/components/basic/Alert.js +126 -0
- package/dist/src/components/basic/AudioGallery.js +425 -0
- package/dist/src/components/basic/AudioPlayer.js +116 -0
- package/dist/src/components/basic/Avatar.js +181 -0
- package/dist/src/components/basic/Badge.js +66 -0
- package/dist/src/components/basic/Button.js +101 -0
- package/dist/src/components/basic/Card.js +45 -0
- package/dist/src/components/basic/CheckRadioInput.js +83 -0
- package/dist/src/components/basic/Container.js +45 -0
- package/dist/src/components/basic/Drawer.js +94 -0
- package/dist/src/components/basic/DropDown.js +316 -0
- package/dist/src/components/basic/Flexbox.js +67 -0
- package/dist/src/components/basic/GridView.js +51 -0
- package/dist/src/components/basic/Image.js +95 -0
- package/dist/src/components/basic/Input.js +123 -0
- package/dist/src/components/basic/List.js +71 -0
- package/dist/src/components/basic/Modal.js +88 -0
- package/dist/src/components/basic/Section.js +100 -0
- package/dist/src/components/basic/Stack.js +75 -0
- package/dist/src/components/basic/Table.js +32 -0
- package/dist/src/components/basic/Tabs.js +149 -0
- package/dist/src/components/basic/Text.js +117 -0
- package/dist/src/index.js +44 -0
- package/dist/types/src/components/basic/Accordation.d.ts +44 -0
- package/dist/types/{components → src/components}/basic/Alert.d.ts +15 -2
- package/dist/types/{components → src/components}/basic/Avatar.d.ts +5 -3
- package/dist/types/{components → src/components}/basic/Badge.d.ts +3 -3
- package/dist/types/src/components/basic/Button.d.ts +26 -0
- package/dist/types/src/components/basic/Card.d.ts +28 -0
- package/dist/types/{components → src/components}/basic/CheckRadioInput.d.ts +3 -1
- package/dist/types/src/components/basic/Container.d.ts +32 -0
- package/dist/types/src/components/basic/Drawer.d.ts +33 -0
- package/dist/types/src/components/basic/Flexbox.d.ts +25 -0
- package/dist/types/{components → src/components}/basic/GridView.d.ts +7 -5
- package/dist/types/src/components/basic/Image.d.ts +58 -0
- package/dist/types/{components → src/components}/basic/Input.d.ts +18 -10
- package/dist/types/{components → src/components}/basic/List.d.ts +11 -3
- package/dist/types/src/components/basic/Modal.d.ts +24 -0
- package/dist/types/src/components/basic/Section.d.ts +36 -0
- package/dist/types/src/components/basic/Stack.d.ts +27 -0
- package/dist/types/src/components/basic/Table.d.ts +23 -0
- package/dist/types/src/components/basic/Tabs.d.ts +47 -0
- package/dist/types/src/components/basic/Text.d.ts +26 -0
- package/dist/types/{index.d.ts → src/index.d.ts} +17 -19
- package/dist/types/vite.config.d.ts +2 -0
- package/dist/ui.css +1 -1
- package/dist/vite.config.js +34 -0
- package/package.json +2 -1
- package/dist/components/basic/ImageGallery.d.ts +0 -21
- package/dist/components/basic/VideoGallery.d.ts +0 -136
- package/dist/components/basic/VideoPlayer.d.ts +0 -36
- package/dist/types/components/basic/Accordation.d.ts +0 -35
- package/dist/types/components/basic/Button.d.ts +0 -28
- package/dist/types/components/basic/Card.d.ts +0 -70
- package/dist/types/components/basic/Container.d.ts +0 -30
- package/dist/types/components/basic/Drawer.d.ts +0 -24
- package/dist/types/components/basic/Flexbox.d.ts +0 -17
- package/dist/types/components/basic/Image.d.ts +0 -33
- package/dist/types/components/basic/ImageGallery.d.ts +0 -21
- package/dist/types/components/basic/Modal.d.ts +0 -11
- package/dist/types/components/basic/Table.d.ts +0 -59
- package/dist/types/components/basic/Tabs.d.ts +0 -47
- package/dist/types/components/basic/Text.d.ts +0 -39
- package/dist/types/components/basic/VideoGallery.d.ts +0 -136
- package/dist/types/components/basic/VideoPlayer.d.ts +0 -36
- /package/dist/types/{components → src/components}/avatar/AvatarGroup.d.ts +0 -0
- /package/dist/types/{components → src/components}/avatar/AvatarWithStatus.d.ts +0 -0
- /package/dist/types/{components → src/components}/basic/AudioGallery.d.ts +0 -0
- /package/dist/types/{components → src/components}/basic/AudioPlayer.d.ts +0 -0
- /package/dist/types/{components → src/components}/basic/DropDown.d.ts +0 -0
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
type ScreenSize = "sm" | "md" | "lg";
|
|
3
|
+
type ResponsiveValue<T> = T | Partial<Record<ScreenSize, T>>;
|
|
4
|
+
interface StackProps {
|
|
5
|
+
direction?: ResponsiveValue<"vertical" | "horizontal">;
|
|
6
|
+
gap?: ResponsiveValue<number | string>;
|
|
7
|
+
align?: ResponsiveValue<"flex-start" | "flex-end" | "center" | "stretch" | "baseline">;
|
|
8
|
+
justify?: ResponsiveValue<"flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly">;
|
|
9
|
+
wrap?: ResponsiveValue<"nowrap" | "wrap" | "wrap-reverse">;
|
|
10
|
+
padding?: ResponsiveValue<number | string>;
|
|
11
|
+
margin?: ResponsiveValue<number | string>;
|
|
12
|
+
width?: ResponsiveValue<string>;
|
|
13
|
+
maxWidth?: ResponsiveValue<string>;
|
|
14
|
+
height?: ResponsiveValue<string>;
|
|
15
|
+
backgroundColor?: ResponsiveValue<string>;
|
|
16
|
+
borderRadius?: ResponsiveValue<string>;
|
|
17
|
+
border?: ResponsiveValue<string>;
|
|
18
|
+
boxShadow?: ResponsiveValue<string>;
|
|
19
|
+
overflow?: ResponsiveValue<"visible" | "hidden" | "auto" | "scroll">;
|
|
20
|
+
style?: React.CSSProperties;
|
|
21
|
+
className?: string;
|
|
22
|
+
children: React.ReactNode;
|
|
23
|
+
}
|
|
24
|
+
export declare const Stack: React.FC<StackProps>;
|
|
25
|
+
export declare const HStack: React.FC<StackProps>;
|
|
26
|
+
export declare const VStack: React.FC<StackProps>;
|
|
27
|
+
export {};
|
|
@@ -1,59 +1,23 @@
|
|
|
1
|
-
import { default as React, ReactNode } from 'react';
|
|
2
|
-
interface Column {
|
|
3
|
-
key: string;
|
|
4
|
-
label: string;
|
|
5
|
-
sortable?: boolean;
|
|
6
|
-
icon?: ReactNode;
|
|
7
|
-
width?: string | number;
|
|
8
|
-
align?: "left" | "center" | "right";
|
|
9
|
-
headerClassName?: string;
|
|
10
|
-
cellClassName?: string;
|
|
11
|
-
render?: (value: any, row: Record<string, any>) => ReactNode;
|
|
12
|
-
}
|
|
1
|
+
import { default as React, ReactNode, CSSProperties } from 'react';
|
|
13
2
|
interface TableProps {
|
|
14
|
-
|
|
15
|
-
|
|
3
|
+
children: ReactNode;
|
|
4
|
+
style?: CSSProperties;
|
|
5
|
+
className?: string;
|
|
6
|
+
}
|
|
7
|
+
interface TableSectionProps {
|
|
8
|
+
children: ReactNode;
|
|
9
|
+
style?: CSSProperties;
|
|
10
|
+
className?: string;
|
|
11
|
+
}
|
|
12
|
+
interface TableCellProps {
|
|
13
|
+
children: ReactNode;
|
|
14
|
+
style?: CSSProperties;
|
|
16
15
|
className?: string;
|
|
17
|
-
pagination?: boolean;
|
|
18
|
-
rowsPerPage?: number;
|
|
19
|
-
colors?: {
|
|
20
|
-
headerBg?: string;
|
|
21
|
-
headerText?: string;
|
|
22
|
-
rowBg?: string;
|
|
23
|
-
rowText?: string;
|
|
24
|
-
borderColor?: string;
|
|
25
|
-
hoverBg?: string;
|
|
26
|
-
paginationBg?: string;
|
|
27
|
-
paginationText?: string;
|
|
28
|
-
evenRowBg?: string;
|
|
29
|
-
selectedRowBg?: string;
|
|
30
|
-
};
|
|
31
|
-
borderRadius?: {
|
|
32
|
-
table?: string;
|
|
33
|
-
header?: string;
|
|
34
|
-
pagination?: string;
|
|
35
|
-
};
|
|
36
|
-
sortable?: boolean;
|
|
37
|
-
defaultSort?: {
|
|
38
|
-
column: string;
|
|
39
|
-
direction: "asc" | "desc";
|
|
40
|
-
};
|
|
41
|
-
bodyAlign?: "left" | "center" | "right";
|
|
42
|
-
headerAlign?: "left" | "center" | "right";
|
|
43
|
-
rowSelection?: {
|
|
44
|
-
enabled?: boolean;
|
|
45
|
-
onSelect?: (selectedRows: Record<string, any>[]) => void;
|
|
46
|
-
selectionColumnWidth?: string;
|
|
47
|
-
selectionColumnHeader?: ReactNode;
|
|
48
|
-
};
|
|
49
|
-
emptyState?: ReactNode;
|
|
50
|
-
onRowClick?: (row: Record<string, any>, index: number) => void;
|
|
51
|
-
rowClassName?: (row: Record<string, any>, index: number) => string;
|
|
52
|
-
cellPadding?: string;
|
|
53
|
-
headerCellPadding?: string;
|
|
54
|
-
stickyHeader?: boolean;
|
|
55
|
-
maxHeight?: string;
|
|
56
|
-
scrollShadow?: boolean;
|
|
57
16
|
}
|
|
58
17
|
export declare const Table: React.FC<TableProps>;
|
|
18
|
+
export declare const THead: React.FC<TableSectionProps>;
|
|
19
|
+
export declare const TBody: React.FC<TableSectionProps>;
|
|
20
|
+
export declare const TRow: React.FC<TableSectionProps>;
|
|
21
|
+
export declare const TH: React.FC<TableCellProps>;
|
|
22
|
+
export declare const TD: React.FC<TableCellProps>;
|
|
59
23
|
export {};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { default as React, CSSProperties } from 'react';
|
|
2
|
+
/** 🧩 Types */
|
|
2
3
|
interface TabItem {
|
|
3
4
|
label: React.ReactNode;
|
|
4
5
|
content: React.ReactNode;
|
|
@@ -6,42 +7,41 @@ interface TabItem {
|
|
|
6
7
|
disabled?: boolean;
|
|
7
8
|
ariaLabel?: string;
|
|
8
9
|
}
|
|
9
|
-
interface
|
|
10
|
+
interface TabsProps {
|
|
10
11
|
tabs: TabItem[];
|
|
11
12
|
defaultActive?: number;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
tabsWidth?: string | number;
|
|
23
|
-
tabGap?: number;
|
|
24
|
-
tabPadding?: string;
|
|
25
|
-
tabBorderRadius?: number;
|
|
13
|
+
position?: "top" | "left" | "right";
|
|
14
|
+
variant?: "solid" | "outline" | "underline";
|
|
15
|
+
fullWidth?: boolean;
|
|
16
|
+
gap?: number;
|
|
17
|
+
radius?: number;
|
|
18
|
+
padding?: string;
|
|
19
|
+
transitionDuration?: number;
|
|
20
|
+
elevation?: number;
|
|
21
|
+
bordered?: boolean;
|
|
22
|
+
/** 🎨 Colors */
|
|
26
23
|
primaryColor?: string;
|
|
27
|
-
textColor?: string;
|
|
28
24
|
backgroundColor?: string;
|
|
29
|
-
|
|
25
|
+
textColor?: string;
|
|
26
|
+
hoverColor?: string;
|
|
27
|
+
activeColor?: string;
|
|
28
|
+
borderColor?: string;
|
|
30
29
|
disabledColor?: string;
|
|
30
|
+
/** 📱 Responsive */
|
|
31
31
|
responsiveBreakpoint?: number;
|
|
32
32
|
showDrawerLabel?: string;
|
|
33
33
|
drawerIcon?: React.ReactNode;
|
|
34
|
-
|
|
34
|
+
/** ⚙️ Callbacks */
|
|
35
35
|
onTabChange?: (index: number) => void;
|
|
36
|
-
|
|
37
|
-
|
|
36
|
+
/** 🧱 Classes and Styles */
|
|
37
|
+
className?: string;
|
|
38
|
+
style?: CSSProperties;
|
|
39
|
+
tabClassName?: string;
|
|
40
|
+
contentClassName?: string;
|
|
41
|
+
activeTabStyle?: CSSProperties;
|
|
42
|
+
inactiveTabStyle?: CSSProperties;
|
|
43
|
+
contentStyle?: CSSProperties;
|
|
38
44
|
}
|
|
39
|
-
|
|
40
|
-
export declare const
|
|
41
|
-
export declare const RightTabs: React.FC<TabsBaseProps>;
|
|
42
|
-
export declare const Tabs: {
|
|
43
|
-
Left: React.FC<TabsBaseProps>;
|
|
44
|
-
Top: React.FC<TabsBaseProps>;
|
|
45
|
-
Right: React.FC<TabsBaseProps>;
|
|
46
|
-
};
|
|
45
|
+
/** 💎 Modern, Fully Customizable Tabs */
|
|
46
|
+
export declare const Tabs: React.FC<TabsProps>;
|
|
47
47
|
export {};
|
|
@@ -1,39 +1,26 @@
|
|
|
1
|
-
import { default as React
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
/** 🎯 Limit to only HTML elements to avoid SVG union explosion */
|
|
3
|
+
type HTMLElementTag = keyof HTMLElementTagNameMap;
|
|
4
|
+
type TextProps<T extends HTMLElementTag = "p"> = {
|
|
5
|
+
as?: T;
|
|
4
6
|
children: React.ReactNode;
|
|
5
|
-
className?: string;
|
|
6
7
|
color?: string;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
textTransform?: "uppercase" | "lowercase" | "capitalize" | "none";
|
|
12
|
-
lineHeight?: string;
|
|
13
|
-
letterSpacing?: string;
|
|
14
|
-
maxWidth?: string;
|
|
15
|
-
padding?: string;
|
|
16
|
-
margin?: string;
|
|
17
|
-
borderRadius?: string;
|
|
18
|
-
boxShadow?: string;
|
|
19
|
-
shadowColor?: string;
|
|
20
|
-
wordBreak?: "normal" | "break-word" | "break-all" | "keep-all";
|
|
8
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | string;
|
|
9
|
+
weight?: React.CSSProperties["fontWeight"];
|
|
10
|
+
align?: React.CSSProperties["textAlign"];
|
|
11
|
+
transform?: React.CSSProperties["textTransform"];
|
|
21
12
|
italic?: boolean;
|
|
22
|
-
bold?: boolean;
|
|
23
13
|
underline?: boolean;
|
|
24
14
|
strikethrough?: boolean;
|
|
25
|
-
selectable?: boolean;
|
|
26
15
|
truncate?: boolean;
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
16
|
+
selectable?: boolean;
|
|
17
|
+
hoverable?: boolean;
|
|
18
|
+
darkMode?: boolean;
|
|
19
|
+
baseColor?: string;
|
|
20
|
+
className?: string;
|
|
21
|
+
style?: React.CSSProperties;
|
|
33
22
|
onClick?: () => void;
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
export declare const Text: React.FC<TextProps>;
|
|
39
|
-
export {};
|
|
23
|
+
} & Omit<React.HTMLAttributes<HTMLElementTagNameMap[HTMLElementTag]>, "color" | "style">;
|
|
24
|
+
/** 💬 Main Component (HTML-only tags) */
|
|
25
|
+
export declare function Text<T extends HTMLElementTag = "p">({ as, children, color, size, weight, align, transform, italic, underline, strikethrough, truncate, selectable, hoverable, onClick, darkMode, baseColor, className, style, ...rest }: TextProps<T>): React.DetailedReactHTMLElement<React.PropsWithoutRef<React.ComponentProps<T>>, HTMLElement>;
|
|
26
|
+
export default Text;
|