@shohojdhara/atomix 0.4.4 → 0.4.5
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/atomix.css +25 -5
- package/dist/atomix.css.map +1 -1
- package/dist/atomix.min.css +1 -1
- package/dist/atomix.min.css.map +1 -1
- package/dist/charts.js +2 -6
- package/dist/charts.js.map +1 -1
- package/dist/core.d.ts +4 -4
- package/dist/core.js +12 -16
- package/dist/core.js.map +1 -1
- package/dist/forms.js +2 -6
- package/dist/forms.js.map +1 -1
- package/dist/heavy.js +7 -11
- package/dist/heavy.js.map +1 -1
- package/dist/index.d.ts +40 -16
- package/dist/index.esm.js +305 -331
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +335 -347
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
- package/src/components/AtomixGlass/AtomixGlass.tsx +0 -1
- package/src/components/AtomixGlass/AtomixGlassContainer.tsx +3 -8
- package/src/components/Breadcrumb/Breadcrumb.tsx +5 -5
- package/src/components/Breadcrumb/BreadcrumbCompound.test.tsx +2 -2
- package/src/components/Button/Button.tsx +6 -6
- package/src/components/Card/Card.tsx +3 -3
- package/src/components/Dropdown/Dropdown.tsx +5 -3
- package/src/components/Footer/Footer.tsx +124 -166
- package/src/components/Footer/FooterLink.tsx +16 -19
- package/src/components/Footer/FooterSection.tsx +40 -39
- package/src/components/Footer/FooterSocialLink.tsx +59 -58
- package/src/components/Footer/README.md +1 -1
- package/src/components/Hero/Hero.tsx +72 -142
- package/src/components/Navigation/Menu/MegaMenu.tsx +17 -12
- package/src/components/Navigation/Menu/Menu.tsx +49 -24
- package/src/components/Navigation/Nav/NavItem.tsx +5 -3
- package/src/components/Navigation/SideMenu/SideMenu.tsx +2 -2
- package/src/components/Navigation/SideMenu/SideMenuItem.tsx +4 -4
- package/src/components/Slider/Slider.tsx +7 -4
- package/src/lib/composables/useFooter.ts +117 -20
- package/src/lib/composables/useSlider.ts +3 -1
- package/src/lib/types/components.ts +44 -12
- package/src/styles/06-components/_components.atomix-glass.scss +38 -5
- package/src/components/AtomixGlass/__snapshots__/AtomixGlass.test.tsx.snap +0 -222
package/dist/core.d.ts
CHANGED
|
@@ -989,7 +989,7 @@ interface CardProps extends BaseComponentProps {
|
|
|
989
989
|
/**
|
|
990
990
|
* Optional custom link component (e.g., Next.js Link, React Router Link)
|
|
991
991
|
*/
|
|
992
|
-
|
|
992
|
+
linkComponent?: React.ElementType;
|
|
993
993
|
/**
|
|
994
994
|
* Optional click handler
|
|
995
995
|
*/
|
|
@@ -1259,7 +1259,7 @@ interface BreadcrumbItemProps extends React$1.HTMLAttributes<HTMLLIElement> {
|
|
|
1259
1259
|
*/
|
|
1260
1260
|
linkAs?: React$1.ElementType<any>;
|
|
1261
1261
|
/**
|
|
1262
|
-
* Link props to pass to the underlying anchor or
|
|
1262
|
+
* Link props to pass to the underlying anchor or linkComponent
|
|
1263
1263
|
*/
|
|
1264
1264
|
linkProps?: Record<string, any>;
|
|
1265
1265
|
}
|
|
@@ -1284,7 +1284,7 @@ interface BreadcrumbProps {
|
|
|
1284
1284
|
/**
|
|
1285
1285
|
* Optional custom link component
|
|
1286
1286
|
*/
|
|
1287
|
-
|
|
1287
|
+
linkComponent?: React$1.ElementType;
|
|
1288
1288
|
/**
|
|
1289
1289
|
* Custom style for the breadcrumb
|
|
1290
1290
|
*/
|
|
@@ -1304,7 +1304,7 @@ type ButtonAsProp = {
|
|
|
1304
1304
|
as?: ElementType;
|
|
1305
1305
|
to?: string;
|
|
1306
1306
|
href?: string;
|
|
1307
|
-
|
|
1307
|
+
linkComponent?: React$1.ElementType;
|
|
1308
1308
|
[key: string]: any;
|
|
1309
1309
|
};
|
|
1310
1310
|
declare const Button: React$1.MemoExoticComponent<React$1.ForwardRefExoticComponent<Omit<ButtonProps & ButtonAsProp, "ref"> & React$1.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>>;
|
package/dist/core.js
CHANGED
|
@@ -979,7 +979,7 @@ const sharedShaderCache = new Map, AtomixGlassContainer = forwardRef((({childre
|
|
|
979
979
|
}, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onMouseDown: onMouseDown, onMouseUp: onMouseUp, isHovered: isHovered = !1, isActive: isActive = !1, overLight: overLight = !1, overLightConfig: overLightConfig = {}, borderRadius: borderRadius = 0, padding: padding = "0 0", glassSize: glassSize = {
|
|
980
980
|
width: 0,
|
|
981
981
|
height: 0
|
|
982
|
-
}, onClick: onClick, mode: mode = "standard", effectiveWithoutEffects: effectiveWithoutEffects = !1, effectiveReducedMotion: effectiveReducedMotion = !1, shaderVariant: shaderVariant = "liquidGlass", withLiquidBlur: withLiquidBlur = !1,
|
|
982
|
+
}, onClick: onClick, mode: mode = "standard", effectiveWithoutEffects: effectiveWithoutEffects = !1, effectiveReducedMotion: effectiveReducedMotion = !1, shaderVariant: shaderVariant = "liquidGlass", withLiquidBlur: withLiquidBlur = !1, contentRef: contentRef}, ref) => {
|
|
983
983
|
// Generate a stable, deterministic ID for SSR compatibility
|
|
984
984
|
// Use a module-level counter that's consistent across server and client
|
|
985
985
|
const filterId = useMemo((() => "atomix-glass-filter-" + ++idCounter), []), [shaderMapUrl, setShaderMapUrl] = useState(""), shaderGeneratorRef = useRef(null), shaderUtilsRef = useRef(null), shaderDebounceTimeoutRef = useRef(null);
|
|
@@ -1175,7 +1175,6 @@ const sharedShaderCache = new Map, AtomixGlassContainer = forwardRef((({childre
|
|
|
1175
1175
|
children: [ jsxs("div", {
|
|
1176
1176
|
className: ATOMIX_GLASS.FILTER_CLASS,
|
|
1177
1177
|
style: {
|
|
1178
|
-
zIndex: 1,
|
|
1179
1178
|
position: "absolute",
|
|
1180
1179
|
inset: 0
|
|
1181
1180
|
},
|
|
@@ -1211,9 +1210,7 @@ const sharedShaderCache = new Map, AtomixGlassContainer = forwardRef((({childre
|
|
|
1211
1210
|
className: ATOMIX_GLASS.CONTENT_CLASS,
|
|
1212
1211
|
style: {
|
|
1213
1212
|
position: "relative",
|
|
1214
|
-
textShadow: "var(--atomix-glass-container-text-shadow)"
|
|
1215
|
-
// Ensure content is always above the filter layer (zIndex 1)
|
|
1216
|
-
zIndex: elasticity > 0 ? 100 : 2
|
|
1213
|
+
textShadow: "var(--atomix-glass-container-text-shadow)"
|
|
1217
1214
|
},
|
|
1218
1215
|
children: children
|
|
1219
1216
|
}) ]
|
|
@@ -2086,7 +2083,6 @@ function useAtomixGlass({glassRef: glassRef, contentRef: contentRef, wrapperRef:
|
|
|
2086
2083
|
effectiveWithoutEffects: effectiveWithoutEffects,
|
|
2087
2084
|
effectiveReducedMotion: effectiveReducedMotion,
|
|
2088
2085
|
shaderVariant: shaderVariant,
|
|
2089
|
-
elasticity: elasticity,
|
|
2090
2086
|
withLiquidBlur: withLiquidBlur,
|
|
2091
2087
|
children: children
|
|
2092
2088
|
}), Boolean(onClick) && jsxs(Fragment, {
|
|
@@ -2538,7 +2534,7 @@ const BreadcrumbItem = forwardRef((({children: children, href: href, active: ac
|
|
|
2538
2534
|
|
|
2539
2535
|
BreadcrumbItem.displayName = "BreadcrumbItem";
|
|
2540
2536
|
|
|
2541
|
-
const Breadcrumb = memo((function({items: items, divider: divider, className: className = "", "aria-label": ariaLabel = "Breadcrumb",
|
|
2537
|
+
const Breadcrumb = memo((function({items: items, divider: divider, className: className = "", "aria-label": ariaLabel = "Breadcrumb", linkComponent: linkComponent, style: style, children: children}) {
|
|
2542
2538
|
const breadcrumbClasses = [ BREADCRUMB.CLASSES.BASE, className ].filter(Boolean).join(" ");
|
|
2543
2539
|
let content;
|
|
2544
2540
|
if (items && items.length > 0)
|
|
@@ -2552,7 +2548,7 @@ const Breadcrumb = memo((function({items: items, divider: divider, className: c
|
|
|
2552
2548
|
onClick: item.onClick,
|
|
2553
2549
|
className: item.className,
|
|
2554
2550
|
style: item.style,
|
|
2555
|
-
linkAs:
|
|
2551
|
+
linkAs: linkComponent,
|
|
2556
2552
|
children: item.label
|
|
2557
2553
|
}, index);
|
|
2558
2554
|
})); else {
|
|
@@ -2564,7 +2560,7 @@ const Breadcrumb = memo((function({items: items, divider: divider, className: c
|
|
|
2564
2560
|
|
|
2565
2561
|
return cloneElement(child, {
|
|
2566
2562
|
active: active ?? (!!isLast || void 0),
|
|
2567
|
-
linkAs: linkAs ??
|
|
2563
|
+
linkAs: linkAs ?? linkComponent
|
|
2568
2564
|
});
|
|
2569
2565
|
}
|
|
2570
2566
|
return child;
|
|
@@ -2766,7 +2762,7 @@ class ThemeNaming {
|
|
|
2766
2762
|
|
|
2767
2763
|
ThemeNaming.prefix = "atomix";
|
|
2768
2764
|
|
|
2769
|
-
const Button = React.memo( forwardRef((({label: label, children: children, onClick: onClick, variant: variant = "primary", size: size = "md", disabled: disabled = !1, loading: loading = !1, loadingText: loadingText, icon: icon, iconName: iconName, iconSize: iconSize = "sm", iconPosition: iconPosition = "start", iconOnly: iconOnly = !1, rounded: rounded = !1, fullWidth: fullWidth = !1, block: block = !1, active: active = !1, selected: selected = !1, type: type = "button", className: className = "", as: Component = "button", href: href, target: target, glass: glass, onHover: onHover, onFocus: onFocus, onBlur: onBlur, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, tabIndex: tabIndex, style: style,
|
|
2765
|
+
const Button = React.memo( forwardRef((({label: label, children: children, onClick: onClick, variant: variant = "primary", size: size = "md", disabled: disabled = !1, loading: loading = !1, loadingText: loadingText, icon: icon, iconName: iconName, iconSize: iconSize = "sm", iconPosition: iconPosition = "start", iconOnly: iconOnly = !1, rounded: rounded = !1, fullWidth: fullWidth = !1, block: block = !1, active: active = !1, selected: selected = !1, type: type = "button", className: className = "", as: Component = "button", href: href, target: target, glass: glass, onHover: onHover, onFocus: onFocus, onBlur: onBlur, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, tabIndex: tabIndex, style: style, linkComponent: linkComponent, ...props}, ref) => {
|
|
2770
2766
|
const isDisabled = disabled || loading, shouldRenderAsLink = Boolean(href && !isDisabled), iconElement = iconName ? jsx(Icon, {
|
|
2771
2767
|
name: iconName,
|
|
2772
2768
|
size: iconSize
|
|
@@ -2817,12 +2813,12 @@ const Button = React.memo( forwardRef((({label: label, children: children, onCl
|
|
|
2817
2813
|
let content;
|
|
2818
2814
|
// Render as anchor if href is provided
|
|
2819
2815
|
if (shouldRenderAsLink)
|
|
2820
|
-
// Use custom
|
|
2821
|
-
if (
|
|
2822
|
-
const LinkComp =
|
|
2816
|
+
// Use custom linkComponent if provided (e.g., Next.js Link)
|
|
2817
|
+
if (linkComponent) {
|
|
2818
|
+
const LinkComp = linkComponent, linkProps = {
|
|
2823
2819
|
...buttonProps,
|
|
2824
2820
|
ref: ref,
|
|
2825
|
-
//
|
|
2821
|
+
// linkComponent usually forwards ref to anchor
|
|
2826
2822
|
href: href,
|
|
2827
2823
|
to: href,
|
|
2828
2824
|
target: target,
|
|
@@ -2883,7 +2879,7 @@ header: header, image: image, imageAlt: imageAlt = "", title: title, text: text,
|
|
|
2883
2879
|
// Interaction
|
|
2884
2880
|
onClick: onClick, onHover: onHover, onFocus: onFocus, href: href, target: target,
|
|
2885
2881
|
// Custom Link
|
|
2886
|
-
|
|
2882
|
+
linkComponent: linkComponent,
|
|
2887
2883
|
// Glass
|
|
2888
2884
|
glass: glass,
|
|
2889
2885
|
// Accessibility
|
|
@@ -2968,7 +2964,7 @@ className: className = "", style: style, ...rest}, ref) => {
|
|
|
2968
2964
|
// Render as anchor if href is provided
|
|
2969
2965
|
if (href && !isDisabled) {
|
|
2970
2966
|
let anchorElement;
|
|
2971
|
-
return anchorElement =
|
|
2967
|
+
return anchorElement = linkComponent ? jsx(linkComponent, {
|
|
2972
2968
|
...commonProps,
|
|
2973
2969
|
ref: ref,
|
|
2974
2970
|
href: href,
|