auxalia-ui-kit 1.3.8 → 1.3.9
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/{chunk-JHCTCLL4.js → chunk-OJQZUU5N.js} +2 -0
- package/dist/index.cjs +33 -19
- package/dist/index.d.cts +6 -6
- package/dist/index.d.ts +6 -6
- package/dist/index.js +32 -20
- package/dist/styles.css +1 -1
- package/dist/tailwind.preset.cjs +2 -0
- package/dist/tailwind.preset.js +1 -1
- package/dist/tokens.css +8 -0
- package/package.json +1 -1
|
@@ -71,6 +71,8 @@ var preset = {
|
|
|
71
71
|
destructive: "var(--color-destructive)",
|
|
72
72
|
"destructive-hover": "var(--color-destructive-hover)",
|
|
73
73
|
"destructive-foreground": "var(--color-destructive-foreground)",
|
|
74
|
+
border: "var(--color-border)",
|
|
75
|
+
"border-input": "var(--color-border-input)",
|
|
74
76
|
// Auxalia specific colors for direct use
|
|
75
77
|
"auxalia-green": auxaliaColors["auxalia-green"],
|
|
76
78
|
"auxalia-blue": auxaliaColors["auxalia-blue"],
|
package/dist/index.cjs
CHANGED
|
@@ -854,12 +854,12 @@ var cardVariants = (0, import_class_variance_authority4.cva)(
|
|
|
854
854
|
{
|
|
855
855
|
variants: {
|
|
856
856
|
variant: {
|
|
857
|
-
default: "bg-card border-
|
|
857
|
+
default: "bg-card border border-border dark:bg-auxalia-blue-500/10 dark:border-auxalia-blue-500/30 shadow-sm hover:shadow-md",
|
|
858
|
+
primary: "bg-card border-primary/10 hover:border-primary/20 dark:border-primary/20 shadow-sm hover:shadow-md",
|
|
858
859
|
outlined: "border-2 border-primary/30 bg-transparent hover:border-primary/50 dark:border-primary/40",
|
|
859
860
|
elevated: "bg-secondary border border-accent/10 shadow-lg hover:shadow-xl",
|
|
860
861
|
success: "bg-auxalia-green-50 border border-auxalia-green-200 dark:bg-auxalia-green-500/10 dark:border-auxalia-green-500/30",
|
|
861
|
-
accent: "bg-auxalia-petrol-50 border border-auxalia-petrol-200 dark:bg-auxalia-petrol-500/10 dark:border-auxalia-petrol-500/30"
|
|
862
|
-
secondary: "bg-auxalia-blue-50 border border-auxalia-blue-200 dark:bg-auxalia-blue-500/10 dark:border-auxalia-blue-500/30"
|
|
862
|
+
accent: "bg-auxalia-petrol-50 border border-auxalia-petrol-200 dark:bg-auxalia-petrol-500/10 dark:border-auxalia-petrol-500/30"
|
|
863
863
|
}
|
|
864
864
|
},
|
|
865
865
|
defaultVariants: {
|
|
@@ -6317,7 +6317,7 @@ var SimpleSearch = ({
|
|
|
6317
6317
|
import_lucide_react4.SearchIcon,
|
|
6318
6318
|
{
|
|
6319
6319
|
size: 16,
|
|
6320
|
-
className: "absolute left-3 top-1/2 -translate-y-1/2 text-
|
|
6320
|
+
className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted"
|
|
6321
6321
|
}
|
|
6322
6322
|
),
|
|
6323
6323
|
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
@@ -6792,17 +6792,23 @@ var ControlledTable = ({
|
|
|
6792
6792
|
onFilterCallback
|
|
6793
6793
|
}
|
|
6794
6794
|
),
|
|
6795
|
-
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "relative overflow-hidden rounded-lg border border-
|
|
6796
|
-
loading && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-
|
|
6795
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "relative overflow-hidden rounded-lg border border-border", children: [
|
|
6796
|
+
loading && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-card/60", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent" }) }),
|
|
6797
6797
|
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("table", { className: "w-full text-sm", children: [
|
|
6798
|
-
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("thead", { className: "border-b bg-
|
|
6798
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("thead", { className: "border-b bg-red-500 text-secondary", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("tr", { children: [
|
|
6799
6799
|
isSelectable && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("th", { className: "w-10 px-3 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6800
6800
|
import_radix_ui3.Checkbox.Root,
|
|
6801
6801
|
{
|
|
6802
6802
|
checked: allSelected,
|
|
6803
6803
|
onCheckedChange: handleSelectAll,
|
|
6804
|
-
className: "flex h-4 w-4 items-center justify-center rounded border border-
|
|
6805
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_radix_ui3.Checkbox.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6804
|
+
className: "flex h-4 w-4 items-center justify-center rounded border border-border-input bg-white data-[state=checked]:border-primary data-[state=checked]:bg-primary",
|
|
6805
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_radix_ui3.Checkbox.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6806
|
+
import_lucide_react6.CheckIcon,
|
|
6807
|
+
{
|
|
6808
|
+
size: 10,
|
|
6809
|
+
className: "text-primary-foreground"
|
|
6810
|
+
}
|
|
6811
|
+
) })
|
|
6806
6812
|
}
|
|
6807
6813
|
) }),
|
|
6808
6814
|
fields.map((field) => {
|
|
@@ -6811,7 +6817,7 @@ var ControlledTable = ({
|
|
|
6811
6817
|
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6812
6818
|
"th",
|
|
6813
6819
|
{
|
|
6814
|
-
className: `px-3 py-3 font-medium ${field.headAlign === "center" ? "text-center" : field.headAlign === "right" ? "text-right" : "text-left"} ${field.sortable ? "cursor-pointer select-none hover:text-
|
|
6820
|
+
className: `px-3 py-3 font-medium ${field.headAlign === "center" ? "text-center" : field.headAlign === "right" ? "text-right" : "text-left"} ${field.sortable ? "cursor-pointer select-none hover:text-primary" : ""}`,
|
|
6815
6821
|
style: { width: field.width },
|
|
6816
6822
|
onClick: () => field.sortable && handleSort(field),
|
|
6817
6823
|
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
|
|
@@ -6834,7 +6840,7 @@ var ControlledTable = ({
|
|
|
6834
6840
|
"td",
|
|
6835
6841
|
{
|
|
6836
6842
|
colSpan: fields.length + (isSelectable ? 1 : 0) + (hasActions ? 1 : 0),
|
|
6837
|
-
className: "px-3 py-8 text-center text-
|
|
6843
|
+
className: "px-3 py-8 text-center text-muted",
|
|
6838
6844
|
children: emptyMessage
|
|
6839
6845
|
}
|
|
6840
6846
|
) }) : tableData.map((record) => {
|
|
@@ -6844,7 +6850,7 @@ var ControlledTable = ({
|
|
|
6844
6850
|
"tr",
|
|
6845
6851
|
{
|
|
6846
6852
|
onClick: () => onRowClick?.(record),
|
|
6847
|
-
className: `border-b last:border-b-0 transition-colors ${onRowClick ? "cursor-pointer" : ""} ${isSelected ? "bg-primary/5" : "hover:bg-
|
|
6853
|
+
className: `border-b last:border-b-0 transition-colors ${onRowClick ? "cursor-pointer" : ""} ${isSelected ? "bg-primary/5" : "hover:bg-surface-hover"}`,
|
|
6848
6854
|
children: [
|
|
6849
6855
|
isSelectable && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6850
6856
|
"td",
|
|
@@ -6859,8 +6865,14 @@ var ControlledTable = ({
|
|
|
6859
6865
|
{
|
|
6860
6866
|
checked: isSelected,
|
|
6861
6867
|
onCheckedChange: () => handleSelectRow(key),
|
|
6862
|
-
className: "flex h-4 w-4 items-center justify-center rounded border border-
|
|
6863
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_radix_ui3.Checkbox.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6868
|
+
className: "flex h-4 w-4 items-center justify-center rounded border border-border-input bg-white data-[state=checked]:border-primary data-[state=checked]:bg-primary",
|
|
6869
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_radix_ui3.Checkbox.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6870
|
+
import_lucide_react6.CheckIcon,
|
|
6871
|
+
{
|
|
6872
|
+
size: 10,
|
|
6873
|
+
className: "text-primary-foreground"
|
|
6874
|
+
}
|
|
6875
|
+
) })
|
|
6864
6876
|
}
|
|
6865
6877
|
)
|
|
6866
6878
|
}
|
|
@@ -6883,7 +6895,7 @@ var ControlledTable = ({
|
|
|
6883
6895
|
withEditAction && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6884
6896
|
"button",
|
|
6885
6897
|
{
|
|
6886
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-
|
|
6898
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-surface-hover",
|
|
6887
6899
|
onClick: () => handleEditAction?.(record.id),
|
|
6888
6900
|
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react6.Edit, { size: 15 })
|
|
6889
6901
|
}
|
|
@@ -6891,7 +6903,7 @@ var ControlledTable = ({
|
|
|
6891
6903
|
withDownloadAction && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6892
6904
|
"button",
|
|
6893
6905
|
{
|
|
6894
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-
|
|
6906
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-surface-hover",
|
|
6895
6907
|
onClick: () => handleDownloadAction?.(record.id),
|
|
6896
6908
|
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react6.Download, { size: 15 })
|
|
6897
6909
|
}
|
|
@@ -6899,7 +6911,7 @@ var ControlledTable = ({
|
|
|
6899
6911
|
withOpenAction && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6900
6912
|
"button",
|
|
6901
6913
|
{
|
|
6902
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-
|
|
6914
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-surface-hover",
|
|
6903
6915
|
onClick: () => {
|
|
6904
6916
|
if (handleOpenAction)
|
|
6905
6917
|
handleOpenAction(record);
|
|
@@ -6914,7 +6926,7 @@ var ControlledTable = ({
|
|
|
6914
6926
|
withCloneAction && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6915
6927
|
"button",
|
|
6916
6928
|
{
|
|
6917
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-
|
|
6929
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-surface-hover",
|
|
6918
6930
|
onClick: () => handleClickIcon?.(record),
|
|
6919
6931
|
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react6.Copy, { size: 15 })
|
|
6920
6932
|
}
|
|
@@ -6922,7 +6934,7 @@ var ControlledTable = ({
|
|
|
6922
6934
|
withRemoveAction && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6923
6935
|
"button",
|
|
6924
6936
|
{
|
|
6925
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded text-destructive hover:bg-
|
|
6937
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded text-destructive hover:bg-destructive/10",
|
|
6926
6938
|
onClick: () => handleRemoveAction?.(record.id),
|
|
6927
6939
|
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react6.Trash2, { size: 15 })
|
|
6928
6940
|
}
|
|
@@ -7025,6 +7037,8 @@ var preset = {
|
|
|
7025
7037
|
destructive: "var(--color-destructive)",
|
|
7026
7038
|
"destructive-hover": "var(--color-destructive-hover)",
|
|
7027
7039
|
"destructive-foreground": "var(--color-destructive-foreground)",
|
|
7040
|
+
border: "var(--color-border)",
|
|
7041
|
+
"border-input": "var(--color-border-input)",
|
|
7028
7042
|
// Auxalia specific colors for direct use
|
|
7029
7043
|
"auxalia-green": auxaliaColors["auxalia-green"],
|
|
7030
7044
|
"auxalia-blue": auxaliaColors["auxalia-blue"],
|
package/dist/index.d.cts
CHANGED
|
@@ -16,7 +16,7 @@ import 'tailwindcss';
|
|
|
16
16
|
|
|
17
17
|
declare const buttonVariants: (props?: {
|
|
18
18
|
variant?: "default" | "outline" | "ghost" | "link";
|
|
19
|
-
color?: "
|
|
19
|
+
color?: "primary" | "secondary" | "accent" | "destructive" | "default";
|
|
20
20
|
size?: "default" | "sm" | "lg" | "icon";
|
|
21
21
|
} & class_variance_authority_types.ClassProp) => string;
|
|
22
22
|
interface ButtonProps extends React.ComponentProps<'button'>, VariantProps<typeof buttonVariants> {
|
|
@@ -30,7 +30,7 @@ declare function CollapsibleTrigger({ ...props }: React.ComponentProps<typeof Co
|
|
|
30
30
|
declare function CollapsibleContent({ ...props }: React.ComponentProps<typeof Collapsible.Content>): react_jsx_runtime.JSX.Element;
|
|
31
31
|
|
|
32
32
|
declare const dropdownMenuItemVariants: (props?: {
|
|
33
|
-
variant?: "
|
|
33
|
+
variant?: "primary" | "secondary" | "accent" | "destructive" | "default";
|
|
34
34
|
} & class_variance_authority_types.ClassProp) => string;
|
|
35
35
|
type DropdownMenuItemVariantProps = VariantProps<typeof dropdownMenuItemVariants>;
|
|
36
36
|
|
|
@@ -105,7 +105,7 @@ declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof Toolti
|
|
|
105
105
|
declare function TooltipContent({ className, sideOffset, children, ...props }: React.ComponentProps<typeof TooltipPrimitive.Content>): react_jsx_runtime.JSX.Element;
|
|
106
106
|
|
|
107
107
|
declare const cardVariants: (props?: {
|
|
108
|
-
variant?: "
|
|
108
|
+
variant?: "primary" | "accent" | "default" | "outlined" | "elevated" | "success";
|
|
109
109
|
} & class_variance_authority_types.ClassProp) => string;
|
|
110
110
|
type CardVariantProps = VariantProps<typeof cardVariants>;
|
|
111
111
|
|
|
@@ -121,11 +121,11 @@ type InputProps = Omit<React.ComponentProps<'input'>, 'size'> & InputVariantProp
|
|
|
121
121
|
declare function Input({ size, variant, className, ...props }: InputProps): react_jsx_runtime.JSX.Element;
|
|
122
122
|
|
|
123
123
|
declare const selectTriggerVariants: (props?: {
|
|
124
|
-
variant?: "
|
|
124
|
+
variant?: "primary" | "secondary" | "accent" | "destructive" | "default" | "error";
|
|
125
125
|
size?: "sm" | "lg" | "md";
|
|
126
126
|
} & class_variance_authority_types.ClassProp) => string;
|
|
127
127
|
declare const selectItemVariants: (props?: {
|
|
128
|
-
variant?: "
|
|
128
|
+
variant?: "primary" | "secondary" | "accent" | "destructive" | "default";
|
|
129
129
|
} & class_variance_authority_types.ClassProp) => string;
|
|
130
130
|
type SelectTriggerVariantProps = VariantProps<typeof selectTriggerVariants>;
|
|
131
131
|
type SelectItemVariantProps = VariantProps<typeof selectItemVariants>;
|
|
@@ -209,7 +209,7 @@ interface QueryParams {
|
|
|
209
209
|
}
|
|
210
210
|
interface TableField {
|
|
211
211
|
id: string;
|
|
212
|
-
label
|
|
212
|
+
label: string;
|
|
213
213
|
sortable?: boolean;
|
|
214
214
|
orderField?: string;
|
|
215
215
|
width?: string | number;
|
package/dist/index.d.ts
CHANGED
|
@@ -16,7 +16,7 @@ import 'tailwindcss';
|
|
|
16
16
|
|
|
17
17
|
declare const buttonVariants: (props?: {
|
|
18
18
|
variant?: "default" | "outline" | "ghost" | "link";
|
|
19
|
-
color?: "
|
|
19
|
+
color?: "primary" | "secondary" | "accent" | "destructive" | "default";
|
|
20
20
|
size?: "default" | "sm" | "lg" | "icon";
|
|
21
21
|
} & class_variance_authority_types.ClassProp) => string;
|
|
22
22
|
interface ButtonProps extends React.ComponentProps<'button'>, VariantProps<typeof buttonVariants> {
|
|
@@ -30,7 +30,7 @@ declare function CollapsibleTrigger({ ...props }: React.ComponentProps<typeof Co
|
|
|
30
30
|
declare function CollapsibleContent({ ...props }: React.ComponentProps<typeof Collapsible.Content>): react_jsx_runtime.JSX.Element;
|
|
31
31
|
|
|
32
32
|
declare const dropdownMenuItemVariants: (props?: {
|
|
33
|
-
variant?: "
|
|
33
|
+
variant?: "primary" | "secondary" | "accent" | "destructive" | "default";
|
|
34
34
|
} & class_variance_authority_types.ClassProp) => string;
|
|
35
35
|
type DropdownMenuItemVariantProps = VariantProps<typeof dropdownMenuItemVariants>;
|
|
36
36
|
|
|
@@ -105,7 +105,7 @@ declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof Toolti
|
|
|
105
105
|
declare function TooltipContent({ className, sideOffset, children, ...props }: React.ComponentProps<typeof TooltipPrimitive.Content>): react_jsx_runtime.JSX.Element;
|
|
106
106
|
|
|
107
107
|
declare const cardVariants: (props?: {
|
|
108
|
-
variant?: "
|
|
108
|
+
variant?: "primary" | "accent" | "default" | "outlined" | "elevated" | "success";
|
|
109
109
|
} & class_variance_authority_types.ClassProp) => string;
|
|
110
110
|
type CardVariantProps = VariantProps<typeof cardVariants>;
|
|
111
111
|
|
|
@@ -121,11 +121,11 @@ type InputProps = Omit<React.ComponentProps<'input'>, 'size'> & InputVariantProp
|
|
|
121
121
|
declare function Input({ size, variant, className, ...props }: InputProps): react_jsx_runtime.JSX.Element;
|
|
122
122
|
|
|
123
123
|
declare const selectTriggerVariants: (props?: {
|
|
124
|
-
variant?: "
|
|
124
|
+
variant?: "primary" | "secondary" | "accent" | "destructive" | "default" | "error";
|
|
125
125
|
size?: "sm" | "lg" | "md";
|
|
126
126
|
} & class_variance_authority_types.ClassProp) => string;
|
|
127
127
|
declare const selectItemVariants: (props?: {
|
|
128
|
-
variant?: "
|
|
128
|
+
variant?: "primary" | "secondary" | "accent" | "destructive" | "default";
|
|
129
129
|
} & class_variance_authority_types.ClassProp) => string;
|
|
130
130
|
type SelectTriggerVariantProps = VariantProps<typeof selectTriggerVariants>;
|
|
131
131
|
type SelectItemVariantProps = VariantProps<typeof selectItemVariants>;
|
|
@@ -209,7 +209,7 @@ interface QueryParams {
|
|
|
209
209
|
}
|
|
210
210
|
interface TableField {
|
|
211
211
|
id: string;
|
|
212
|
-
label
|
|
212
|
+
label: string;
|
|
213
213
|
sortable?: boolean;
|
|
214
214
|
orderField?: string;
|
|
215
215
|
width?: string | number;
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
tailwind_preset_default
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-OJQZUU5N.js";
|
|
4
4
|
|
|
5
5
|
// src/components/Button.tsx
|
|
6
6
|
import * as React from "react";
|
|
@@ -761,12 +761,12 @@ var cardVariants = cva4(
|
|
|
761
761
|
{
|
|
762
762
|
variants: {
|
|
763
763
|
variant: {
|
|
764
|
-
default: "bg-card border-
|
|
764
|
+
default: "bg-card border border-border dark:bg-auxalia-blue-500/10 dark:border-auxalia-blue-500/30 shadow-sm hover:shadow-md",
|
|
765
|
+
primary: "bg-card border-primary/10 hover:border-primary/20 dark:border-primary/20 shadow-sm hover:shadow-md",
|
|
765
766
|
outlined: "border-2 border-primary/30 bg-transparent hover:border-primary/50 dark:border-primary/40",
|
|
766
767
|
elevated: "bg-secondary border border-accent/10 shadow-lg hover:shadow-xl",
|
|
767
768
|
success: "bg-auxalia-green-50 border border-auxalia-green-200 dark:bg-auxalia-green-500/10 dark:border-auxalia-green-500/30",
|
|
768
|
-
accent: "bg-auxalia-petrol-50 border border-auxalia-petrol-200 dark:bg-auxalia-petrol-500/10 dark:border-auxalia-petrol-500/30"
|
|
769
|
-
secondary: "bg-auxalia-blue-50 border border-auxalia-blue-200 dark:bg-auxalia-blue-500/10 dark:border-auxalia-blue-500/30"
|
|
769
|
+
accent: "bg-auxalia-petrol-50 border border-auxalia-petrol-200 dark:bg-auxalia-petrol-500/10 dark:border-auxalia-petrol-500/30"
|
|
770
770
|
}
|
|
771
771
|
},
|
|
772
772
|
defaultVariants: {
|
|
@@ -6247,7 +6247,7 @@ var SimpleSearch = ({
|
|
|
6247
6247
|
SearchIcon,
|
|
6248
6248
|
{
|
|
6249
6249
|
size: 16,
|
|
6250
|
-
className: "absolute left-3 top-1/2 -translate-y-1/2 text-
|
|
6250
|
+
className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted"
|
|
6251
6251
|
}
|
|
6252
6252
|
),
|
|
6253
6253
|
/* @__PURE__ */ jsx26(
|
|
@@ -6722,17 +6722,23 @@ var ControlledTable = ({
|
|
|
6722
6722
|
onFilterCallback
|
|
6723
6723
|
}
|
|
6724
6724
|
),
|
|
6725
|
-
/* @__PURE__ */ jsxs11("div", { className: "relative overflow-hidden rounded-lg border border-
|
|
6726
|
-
loading && /* @__PURE__ */ jsx32("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-
|
|
6725
|
+
/* @__PURE__ */ jsxs11("div", { className: "relative overflow-hidden rounded-lg border border-border", children: [
|
|
6726
|
+
loading && /* @__PURE__ */ jsx32("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-card/60", children: /* @__PURE__ */ jsx32("div", { className: "h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent" }) }),
|
|
6727
6727
|
/* @__PURE__ */ jsx32("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs11("table", { className: "w-full text-sm", children: [
|
|
6728
|
-
/* @__PURE__ */ jsx32("thead", { className: "border-b bg-
|
|
6728
|
+
/* @__PURE__ */ jsx32("thead", { className: "border-b bg-red-500 text-secondary", children: /* @__PURE__ */ jsxs11("tr", { children: [
|
|
6729
6729
|
isSelectable && /* @__PURE__ */ jsx32("th", { className: "w-10 px-3 py-3", children: /* @__PURE__ */ jsx32(
|
|
6730
6730
|
Checkbox.Root,
|
|
6731
6731
|
{
|
|
6732
6732
|
checked: allSelected,
|
|
6733
6733
|
onCheckedChange: handleSelectAll,
|
|
6734
|
-
className: "flex h-4 w-4 items-center justify-center rounded border border-
|
|
6735
|
-
children: /* @__PURE__ */ jsx32(Checkbox.Indicator, { children: /* @__PURE__ */ jsx32(
|
|
6734
|
+
className: "flex h-4 w-4 items-center justify-center rounded border border-border-input bg-white data-[state=checked]:border-primary data-[state=checked]:bg-primary",
|
|
6735
|
+
children: /* @__PURE__ */ jsx32(Checkbox.Indicator, { children: /* @__PURE__ */ jsx32(
|
|
6736
|
+
CheckIcon,
|
|
6737
|
+
{
|
|
6738
|
+
size: 10,
|
|
6739
|
+
className: "text-primary-foreground"
|
|
6740
|
+
}
|
|
6741
|
+
) })
|
|
6736
6742
|
}
|
|
6737
6743
|
) }),
|
|
6738
6744
|
fields.map((field) => {
|
|
@@ -6741,7 +6747,7 @@ var ControlledTable = ({
|
|
|
6741
6747
|
return /* @__PURE__ */ jsx32(
|
|
6742
6748
|
"th",
|
|
6743
6749
|
{
|
|
6744
|
-
className: `px-3 py-3 font-medium ${field.headAlign === "center" ? "text-center" : field.headAlign === "right" ? "text-right" : "text-left"} ${field.sortable ? "cursor-pointer select-none hover:text-
|
|
6750
|
+
className: `px-3 py-3 font-medium ${field.headAlign === "center" ? "text-center" : field.headAlign === "right" ? "text-right" : "text-left"} ${field.sortable ? "cursor-pointer select-none hover:text-primary" : ""}`,
|
|
6745
6751
|
style: { width: field.width },
|
|
6746
6752
|
onClick: () => field.sortable && handleSort(field),
|
|
6747
6753
|
children: /* @__PURE__ */ jsxs11(
|
|
@@ -6764,7 +6770,7 @@ var ControlledTable = ({
|
|
|
6764
6770
|
"td",
|
|
6765
6771
|
{
|
|
6766
6772
|
colSpan: fields.length + (isSelectable ? 1 : 0) + (hasActions ? 1 : 0),
|
|
6767
|
-
className: "px-3 py-8 text-center text-
|
|
6773
|
+
className: "px-3 py-8 text-center text-muted",
|
|
6768
6774
|
children: emptyMessage
|
|
6769
6775
|
}
|
|
6770
6776
|
) }) : tableData.map((record) => {
|
|
@@ -6774,7 +6780,7 @@ var ControlledTable = ({
|
|
|
6774
6780
|
"tr",
|
|
6775
6781
|
{
|
|
6776
6782
|
onClick: () => onRowClick?.(record),
|
|
6777
|
-
className: `border-b last:border-b-0 transition-colors ${onRowClick ? "cursor-pointer" : ""} ${isSelected ? "bg-primary/5" : "hover:bg-
|
|
6783
|
+
className: `border-b last:border-b-0 transition-colors ${onRowClick ? "cursor-pointer" : ""} ${isSelected ? "bg-primary/5" : "hover:bg-surface-hover"}`,
|
|
6778
6784
|
children: [
|
|
6779
6785
|
isSelectable && /* @__PURE__ */ jsx32(
|
|
6780
6786
|
"td",
|
|
@@ -6789,8 +6795,14 @@ var ControlledTable = ({
|
|
|
6789
6795
|
{
|
|
6790
6796
|
checked: isSelected,
|
|
6791
6797
|
onCheckedChange: () => handleSelectRow(key),
|
|
6792
|
-
className: "flex h-4 w-4 items-center justify-center rounded border border-
|
|
6793
|
-
children: /* @__PURE__ */ jsx32(Checkbox.Indicator, { children: /* @__PURE__ */ jsx32(
|
|
6798
|
+
className: "flex h-4 w-4 items-center justify-center rounded border border-border-input bg-white data-[state=checked]:border-primary data-[state=checked]:bg-primary",
|
|
6799
|
+
children: /* @__PURE__ */ jsx32(Checkbox.Indicator, { children: /* @__PURE__ */ jsx32(
|
|
6800
|
+
CheckIcon,
|
|
6801
|
+
{
|
|
6802
|
+
size: 10,
|
|
6803
|
+
className: "text-primary-foreground"
|
|
6804
|
+
}
|
|
6805
|
+
) })
|
|
6794
6806
|
}
|
|
6795
6807
|
)
|
|
6796
6808
|
}
|
|
@@ -6813,7 +6825,7 @@ var ControlledTable = ({
|
|
|
6813
6825
|
withEditAction && /* @__PURE__ */ jsx32(
|
|
6814
6826
|
"button",
|
|
6815
6827
|
{
|
|
6816
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-
|
|
6828
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-surface-hover",
|
|
6817
6829
|
onClick: () => handleEditAction?.(record.id),
|
|
6818
6830
|
children: /* @__PURE__ */ jsx32(Edit2, { size: 15 })
|
|
6819
6831
|
}
|
|
@@ -6821,7 +6833,7 @@ var ControlledTable = ({
|
|
|
6821
6833
|
withDownloadAction && /* @__PURE__ */ jsx32(
|
|
6822
6834
|
"button",
|
|
6823
6835
|
{
|
|
6824
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-
|
|
6836
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-surface-hover",
|
|
6825
6837
|
onClick: () => handleDownloadAction?.(record.id),
|
|
6826
6838
|
children: /* @__PURE__ */ jsx32(Download2, { size: 15 })
|
|
6827
6839
|
}
|
|
@@ -6829,7 +6841,7 @@ var ControlledTable = ({
|
|
|
6829
6841
|
withOpenAction && /* @__PURE__ */ jsx32(
|
|
6830
6842
|
"button",
|
|
6831
6843
|
{
|
|
6832
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-
|
|
6844
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-surface-hover",
|
|
6833
6845
|
onClick: () => {
|
|
6834
6846
|
if (handleOpenAction)
|
|
6835
6847
|
handleOpenAction(record);
|
|
@@ -6844,7 +6856,7 @@ var ControlledTable = ({
|
|
|
6844
6856
|
withCloneAction && /* @__PURE__ */ jsx32(
|
|
6845
6857
|
"button",
|
|
6846
6858
|
{
|
|
6847
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-
|
|
6859
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded hover:bg-surface-hover",
|
|
6848
6860
|
onClick: () => handleClickIcon?.(record),
|
|
6849
6861
|
children: /* @__PURE__ */ jsx32(Copy2, { size: 15 })
|
|
6850
6862
|
}
|
|
@@ -6852,7 +6864,7 @@ var ControlledTable = ({
|
|
|
6852
6864
|
withRemoveAction && /* @__PURE__ */ jsx32(
|
|
6853
6865
|
"button",
|
|
6854
6866
|
{
|
|
6855
|
-
className: "inline-flex h-7 w-7 items-center justify-center rounded text-destructive hover:bg-
|
|
6867
|
+
className: "inline-flex h-7 w-7 items-center justify-center rounded text-destructive hover:bg-destructive/10",
|
|
6856
6868
|
onClick: () => handleRemoveAction?.(record.id),
|
|
6857
6869
|
children: /* @__PURE__ */ jsx32(Trash22, { size: 15 })
|
|
6858
6870
|
}
|
package/dist/styles.css
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');
|
|
3
3
|
|
|
4
4
|
/* inline safelist classes previously stored in safelist.txt */
|
|
5
|
-
@source inline("bg-primary text-primary bg-secondary bg-accent bg-destructive text-primary-foreground bg-primary-hover border-primary ring-primary bg-card bg-popover border-black/10 dark:border-white/10 shadow-md bg-primary/5 bg-primary/10 bg-primary/15 bg-primary/20 bg-primary/25 bg-primary/30 bg-primary/40 bg-primary/50 border-primary/10 border-primary/20 border-primary/25 border-primary/30 border-primary/40 border-primary/50 ring-primary/15 ring-primary/20 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2");
|
|
5
|
+
@source inline("bg-primary text-primary bg-secondary bg-accent bg-destructive text-primary-foreground bg-primary-hover border-primary ring-primary bg-card bg-popover bg-surface bg-surface-hover bg-surface-foreground border-black/10 dark:border-white/10 shadow-md bg-primary/5 bg-primary/10 bg-primary/15 bg-primary/20 bg-primary/25 bg-primary/30 bg-primary/40 bg-primary/50 border-primary/10 border-primary/20 border-primary/25 border-primary/30 border-primary/40 border-primary/50 ring-primary/15 ring-primary/20 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2");
|
|
6
6
|
|
|
7
7
|
@import 'tailwindcss/base';
|
|
8
8
|
@import 'tailwindcss/components';
|
package/dist/tailwind.preset.cjs
CHANGED
|
@@ -94,6 +94,8 @@ var preset = {
|
|
|
94
94
|
destructive: "var(--color-destructive)",
|
|
95
95
|
"destructive-hover": "var(--color-destructive-hover)",
|
|
96
96
|
"destructive-foreground": "var(--color-destructive-foreground)",
|
|
97
|
+
border: "var(--color-border)",
|
|
98
|
+
"border-input": "var(--color-border-input)",
|
|
97
99
|
// Auxalia specific colors for direct use
|
|
98
100
|
"auxalia-green": auxaliaColors["auxalia-green"],
|
|
99
101
|
"auxalia-blue": auxaliaColors["auxalia-blue"],
|
package/dist/tailwind.preset.js
CHANGED
package/dist/tokens.css
CHANGED
|
@@ -26,6 +26,10 @@
|
|
|
26
26
|
--color-destructive-hover: hsl(0 74% 42%);
|
|
27
27
|
--color-destructive-foreground: hsl(0 0% 100%);
|
|
28
28
|
|
|
29
|
+
/* BORDERS */
|
|
30
|
+
--color-border: hsl(214 32% 91%);
|
|
31
|
+
--color-border-input: hsl(215 20% 65%);
|
|
32
|
+
|
|
29
33
|
/* TEXT */
|
|
30
34
|
--color-text: hsl(222 47% 11%);
|
|
31
35
|
--color-text-secondary: hsl(215 19% 35%);
|
|
@@ -67,6 +71,10 @@
|
|
|
67
71
|
--color-destructive-hover: hsl(0 84% 60%);
|
|
68
72
|
--color-destructive-foreground: hsl(222 47% 11%);
|
|
69
73
|
|
|
74
|
+
/* BORDERS */
|
|
75
|
+
--color-border: hsl(215 25% 27%);
|
|
76
|
+
--color-border-input: hsl(215 16% 47%);
|
|
77
|
+
|
|
70
78
|
--color-text: hsl(214 32% 91%);
|
|
71
79
|
--color-text-secondary: hsl(215 20% 65%);
|
|
72
80
|
--color-text-muted: hsl(215 16% 47%);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "auxalia-ui-kit",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.9",
|
|
4
4
|
"description": "A React component library built with Radix UI and Tailwind CSS, designed to provide accessible and customizable UI components for modern web applications.",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"author": {
|