@yomologic/react-ui 0.6.6 → 0.6.7
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/index.js +16 -8
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +16 -8
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +65 -18
- package/dist/styles.css.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -4341,6 +4341,13 @@ var Nav = React14.forwardRef(
|
|
|
4341
4341
|
lg: "px-4 py-2.5",
|
|
4342
4342
|
xl: "px-5 py-3"
|
|
4343
4343
|
};
|
|
4344
|
+
const mobilePaddingStyles = {
|
|
4345
|
+
xs: "px-3 py-2.5",
|
|
4346
|
+
sm: "px-3 py-3",
|
|
4347
|
+
md: "px-4 py-3",
|
|
4348
|
+
lg: "px-4 py-3.5",
|
|
4349
|
+
xl: "px-5 py-4"
|
|
4350
|
+
};
|
|
4344
4351
|
const fontSizeStyles = {
|
|
4345
4352
|
xs: "[font-size:var(--nav-font-size-xs)]",
|
|
4346
4353
|
sm: "[font-size:var(--nav-font-size-sm)]",
|
|
@@ -4349,16 +4356,16 @@ var Nav = React14.forwardRef(
|
|
|
4349
4356
|
xl: "[font-size:var(--nav-font-size-xl)]"
|
|
4350
4357
|
};
|
|
4351
4358
|
const variantItemStyles = {
|
|
4352
|
-
primary: "rounded-md hover:bg-(--color-primary)/10 hover:text-(--color-primary) transition-colors duration-150",
|
|
4353
|
-
secondary: "rounded-md hover:bg-(--color-muted) transition-colors duration-150",
|
|
4354
|
-
ghost: "rounded-md hover:
|
|
4355
|
-
underline: "relative hover:text-(--color-primary) transition-colors duration-150 after:content-[''] after:absolute after:bottom-0 after:left-0 after:h-0.5 after:bg-(--color-primary) after:
|
|
4359
|
+
primary: "rounded-md hover:bg-(--color-primary)/10 hover:text-(--color-primary) active:bg-(--color-primary)/20 transition-colors duration-150",
|
|
4360
|
+
secondary: "rounded-md hover:bg-(--color-muted) active:bg-(--color-muted)/80 transition-colors duration-150",
|
|
4361
|
+
ghost: "rounded-md hover:text-(--color-primary) active:text-(--color-primary) transition-colors duration-150",
|
|
4362
|
+
underline: "relative hover:text-(--color-primary) active:text-(--color-primary) transition-colors duration-150 after:content-[''] after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.5 after:bg-(--color-primary) after:scale-x-0 hover:after:scale-x-100 active:after:scale-x-100 after:transition-transform after:duration-300 after:origin-center"
|
|
4356
4363
|
};
|
|
4357
4364
|
const activeItemStyles = {
|
|
4358
|
-
primary: "bg-(--color-primary) text-white hover:bg-(--color-primary) hover:text-white",
|
|
4359
|
-
secondary: "bg-(--color-muted) text-(--color-foreground) font-semibold",
|
|
4365
|
+
primary: "bg-(--color-primary) text-white hover:bg-(--color-primary) hover:text-white active:bg-(--color-primary)/90",
|
|
4366
|
+
secondary: "bg-(--color-muted) text-(--color-foreground) font-semibold active:bg-(--color-muted)/80",
|
|
4360
4367
|
ghost: "text-(--color-primary) font-medium",
|
|
4361
|
-
underline: "text-(--color-primary) after:content-[''] after:absolute after:bottom-0 after:left-0 after:h-0.5 after:
|
|
4368
|
+
underline: "text-(--color-primary) after:content-[''] after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.5 after:scale-x-100 after:bg-(--color-primary)"
|
|
4362
4369
|
};
|
|
4363
4370
|
const breakpointClasses = {
|
|
4364
4371
|
sm: "sm:hidden",
|
|
@@ -4406,11 +4413,12 @@ var Nav = React14.forwardRef(
|
|
|
4406
4413
|
const hasChildren = item.children && item.children.length > 0;
|
|
4407
4414
|
const itemBaseStyles = cn(
|
|
4408
4415
|
"flex items-center [gap:var(--nav-gap)] font-medium text-(--color-foreground) cursor-pointer select-none",
|
|
4409
|
-
itemPaddingStyles[size],
|
|
4416
|
+
isMobile ? mobilePaddingStyles[size] : itemPaddingStyles[size],
|
|
4410
4417
|
fontSizeStyles[size],
|
|
4411
4418
|
variantItemStyles[variant],
|
|
4412
4419
|
isActive && activeItemStyles[variant],
|
|
4413
4420
|
orientation === "vertical" && "w-full",
|
|
4421
|
+
isMobile && "w-full",
|
|
4414
4422
|
item.disabled && "opacity-50 cursor-not-allowed"
|
|
4415
4423
|
);
|
|
4416
4424
|
const content = /* @__PURE__ */ jsxs20(Fragment4, { children: [
|