@dododog/ui 0.5.1 → 0.6.0
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-MKUUHYGQ.mjs → chunk-M2H6QUAL.mjs} +14 -4
- package/dist/{chunk-2J73BRC5.js → chunk-WXEZA6NE.js} +14 -4
- package/dist/components/AnchorTabs/index.d.mts +7 -0
- package/dist/components/AnchorTabs/index.d.ts +7 -0
- package/dist/components/AnchorTabs/index.js +2 -2
- package/dist/components/AnchorTabs/index.mjs +1 -1
- package/dist/index.js +32 -32
- package/dist/index.mjs +7 -7
- package/package.json +1 -1
|
@@ -11,7 +11,8 @@ var AnchorTabs = React.forwardRef(
|
|
|
11
11
|
onActiveChange,
|
|
12
12
|
pinWhileSectionsVisible = false,
|
|
13
13
|
pinTop = 72,
|
|
14
|
-
containerClassName
|
|
14
|
+
containerClassName,
|
|
15
|
+
variant = "underline"
|
|
15
16
|
}, ref) => {
|
|
16
17
|
const [activeKey, setActiveKey] = React.useState(items[0]?.key ?? "");
|
|
17
18
|
const [pinned, setPinned] = React.useState(false);
|
|
@@ -90,7 +91,10 @@ var AnchorTabs = React.forwardRef(
|
|
|
90
91
|
ref,
|
|
91
92
|
"aria-label": ariaLabel,
|
|
92
93
|
className: cn(
|
|
93
|
-
|
|
94
|
+
variant === "pills" ? (
|
|
95
|
+
// Pills : chips posées sur le fond de page, sans carte ni séparateur.
|
|
96
|
+
"flex items-center gap-2 overflow-x-auto"
|
|
97
|
+
) : "flex items-stretch gap-1 overflow-x-auto border-b border-sand-dark bg-white",
|
|
94
98
|
isPinned && "z-40 shadow-sm",
|
|
95
99
|
className
|
|
96
100
|
),
|
|
@@ -107,8 +111,14 @@ var AnchorTabs = React.forwardRef(
|
|
|
107
111
|
// Cible tactile >= 44px (min-h-[44px] + flex centré) ; transition
|
|
108
112
|
// limitée aux couleurs (150-300ms, sans reflow) ; press feedback
|
|
109
113
|
// via opacité (transform/opacity, aucun layout shift).
|
|
110
|
-
"flex min-h-[44px] items-center whitespace-nowrap
|
|
111
|
-
|
|
114
|
+
"flex min-h-[44px] items-center whitespace-nowrap px-4 text-sm outline-none transition-colors duration-200 active:opacity-70 focus-visible:ring-2 focus-visible:ring-secondary focus-visible:ring-offset-2",
|
|
115
|
+
variant === "pills" ? cn(
|
|
116
|
+
"rounded-full border",
|
|
117
|
+
isActive ? "border-primary bg-primary font-semibold text-white" : "border-gray-200 bg-white font-medium text-text-secondary hover:border-gray-300 hover:text-primary"
|
|
118
|
+
) : cn(
|
|
119
|
+
"-mb-px border-b-2",
|
|
120
|
+
isActive ? "border-secondary font-semibold text-primary" : "border-transparent font-medium text-text-secondary hover:border-gray-300 hover:text-primary"
|
|
121
|
+
)
|
|
112
122
|
),
|
|
113
123
|
children: item.label
|
|
114
124
|
},
|
|
@@ -33,7 +33,8 @@ var AnchorTabs = React__namespace.forwardRef(
|
|
|
33
33
|
onActiveChange,
|
|
34
34
|
pinWhileSectionsVisible = false,
|
|
35
35
|
pinTop = 72,
|
|
36
|
-
containerClassName
|
|
36
|
+
containerClassName,
|
|
37
|
+
variant = "underline"
|
|
37
38
|
}, ref) => {
|
|
38
39
|
const [activeKey, setActiveKey] = React__namespace.useState(items[0]?.key ?? "");
|
|
39
40
|
const [pinned, setPinned] = React__namespace.useState(false);
|
|
@@ -112,7 +113,10 @@ var AnchorTabs = React__namespace.forwardRef(
|
|
|
112
113
|
ref,
|
|
113
114
|
"aria-label": ariaLabel,
|
|
114
115
|
className: chunkADIDI7AJ_js.cn(
|
|
115
|
-
|
|
116
|
+
variant === "pills" ? (
|
|
117
|
+
// Pills : chips posées sur le fond de page, sans carte ni séparateur.
|
|
118
|
+
"flex items-center gap-2 overflow-x-auto"
|
|
119
|
+
) : "flex items-stretch gap-1 overflow-x-auto border-b border-sand-dark bg-white",
|
|
116
120
|
isPinned && "z-40 shadow-sm",
|
|
117
121
|
className
|
|
118
122
|
),
|
|
@@ -129,8 +133,14 @@ var AnchorTabs = React__namespace.forwardRef(
|
|
|
129
133
|
// Cible tactile >= 44px (min-h-[44px] + flex centré) ; transition
|
|
130
134
|
// limitée aux couleurs (150-300ms, sans reflow) ; press feedback
|
|
131
135
|
// via opacité (transform/opacity, aucun layout shift).
|
|
132
|
-
"flex min-h-[44px] items-center whitespace-nowrap
|
|
133
|
-
|
|
136
|
+
"flex min-h-[44px] items-center whitespace-nowrap px-4 text-sm outline-none transition-colors duration-200 active:opacity-70 focus-visible:ring-2 focus-visible:ring-secondary focus-visible:ring-offset-2",
|
|
137
|
+
variant === "pills" ? chunkADIDI7AJ_js.cn(
|
|
138
|
+
"rounded-full border",
|
|
139
|
+
isActive ? "border-primary bg-primary font-semibold text-white" : "border-gray-200 bg-white font-medium text-text-secondary hover:border-gray-300 hover:text-primary"
|
|
140
|
+
) : chunkADIDI7AJ_js.cn(
|
|
141
|
+
"-mb-px border-b-2",
|
|
142
|
+
isActive ? "border-secondary font-semibold text-primary" : "border-transparent font-medium text-text-secondary hover:border-gray-300 hover:text-primary"
|
|
143
|
+
)
|
|
134
144
|
),
|
|
135
145
|
children: item.label
|
|
136
146
|
},
|
|
@@ -34,6 +34,13 @@ interface AnchorTabsProps {
|
|
|
34
34
|
pinTop?: number;
|
|
35
35
|
/** Classes du conteneur/sentinelle (ex. `hidden lg:block`). */
|
|
36
36
|
containerClassName?: string;
|
|
37
|
+
/**
|
|
38
|
+
* Présentation de la barre :
|
|
39
|
+
* - `underline` (défaut) : rangée d'onglets sur fond blanc, actif souligné ;
|
|
40
|
+
* - `pills` : chips arrondies posées sur le fond de page (pattern
|
|
41
|
+
* FilterPill) — actif rempli `primary`, inactifs en pill blanche bordée.
|
|
42
|
+
*/
|
|
43
|
+
variant?: "underline" | "pills";
|
|
37
44
|
}
|
|
38
45
|
/**
|
|
39
46
|
* Barre d'onglets d'ancrage (desktop) avec scroll-spy.
|
|
@@ -34,6 +34,13 @@ interface AnchorTabsProps {
|
|
|
34
34
|
pinTop?: number;
|
|
35
35
|
/** Classes du conteneur/sentinelle (ex. `hidden lg:block`). */
|
|
36
36
|
containerClassName?: string;
|
|
37
|
+
/**
|
|
38
|
+
* Présentation de la barre :
|
|
39
|
+
* - `underline` (défaut) : rangée d'onglets sur fond blanc, actif souligné ;
|
|
40
|
+
* - `pills` : chips arrondies posées sur le fond de page (pattern
|
|
41
|
+
* FilterPill) — actif rempli `primary`, inactifs en pill blanche bordée.
|
|
42
|
+
*/
|
|
43
|
+
variant?: "underline" | "pills";
|
|
37
44
|
}
|
|
38
45
|
/**
|
|
39
46
|
* Barre d'onglets d'ancrage (desktop) avec scroll-spy.
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkWXEZA6NE_js = require('../../chunk-WXEZA6NE.js');
|
|
4
4
|
require('../../chunk-ADIDI7AJ.js');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
|
|
8
8
|
Object.defineProperty(exports, "AnchorTabs", {
|
|
9
9
|
enumerable: true,
|
|
10
|
-
get: function () { return
|
|
10
|
+
get: function () { return chunkWXEZA6NE_js.AnchorTabs; }
|
|
11
11
|
});
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { AnchorTabs } from '../../chunk-
|
|
1
|
+
export { AnchorTabs } from '../../chunk-M2H6QUAL.mjs';
|
|
2
2
|
import '../../chunk-IMKLN273.mjs';
|
package/dist/index.js
CHANGED
|
@@ -31,15 +31,15 @@ var chunkPRDIS2VR_js = require('./chunk-PRDIS2VR.js');
|
|
|
31
31
|
var chunkIRKM5UF4_js = require('./chunk-IRKM5UF4.js');
|
|
32
32
|
var chunkODUY7NXD_js = require('./chunk-ODUY7NXD.js');
|
|
33
33
|
var chunkYN4HPIRC_js = require('./chunk-YN4HPIRC.js');
|
|
34
|
-
var chunkMKOKWME3_js = require('./chunk-MKOKWME3.js');
|
|
35
34
|
var chunkDLOHAW74_js = require('./chunk-DLOHAW74.js');
|
|
36
35
|
var chunk77WKG2D7_js = require('./chunk-77WKG2D7.js');
|
|
36
|
+
var chunkMKOKWME3_js = require('./chunk-MKOKWME3.js');
|
|
37
37
|
var chunkU3XWNFHH_js = require('./chunk-U3XWNFHH.js');
|
|
38
38
|
var chunkW7DZZS6L_js = require('./chunk-W7DZZS6L.js');
|
|
39
|
-
var chunkTDGU5Y2P_js = require('./chunk-TDGU5Y2P.js');
|
|
40
39
|
var chunkIEHX4DU6_js = require('./chunk-IEHX4DU6.js');
|
|
41
|
-
var
|
|
40
|
+
var chunkTDGU5Y2P_js = require('./chunk-TDGU5Y2P.js');
|
|
42
41
|
var chunk7W3TFPIF_js = require('./chunk-7W3TFPIF.js');
|
|
42
|
+
var chunkS5TLUDNM_js = require('./chunk-S5TLUDNM.js');
|
|
43
43
|
var chunkN2Q4Z2FU_js = require('./chunk-N2Q4Z2FU.js');
|
|
44
44
|
var chunkS732LTPT_js = require('./chunk-S732LTPT.js');
|
|
45
45
|
var chunkC4RZBOKH_js = require('./chunk-C4RZBOKH.js');
|
|
@@ -53,16 +53,16 @@ var chunkXXC2YD3D_js = require('./chunk-XXC2YD3D.js');
|
|
|
53
53
|
var chunkVWFY24XF_js = require('./chunk-VWFY24XF.js');
|
|
54
54
|
var chunkT5FLQQP6_js = require('./chunk-T5FLQQP6.js');
|
|
55
55
|
var chunkEY4ZIR3P_js = require('./chunk-EY4ZIR3P.js');
|
|
56
|
-
var chunkZ5S7LHMY_js = require('./chunk-Z5S7LHMY.js');
|
|
57
|
-
var chunk6EG6EAHW_js = require('./chunk-6EG6EAHW.js');
|
|
58
56
|
var chunkPND5YKFN_js = require('./chunk-PND5YKFN.js');
|
|
59
|
-
var
|
|
57
|
+
var chunk6EG6EAHW_js = require('./chunk-6EG6EAHW.js');
|
|
58
|
+
var chunkZ5S7LHMY_js = require('./chunk-Z5S7LHMY.js');
|
|
60
59
|
var chunkYZTVHCLK_js = require('./chunk-YZTVHCLK.js');
|
|
60
|
+
var chunkH3JNRTAI_js = require('./chunk-H3JNRTAI.js');
|
|
61
61
|
var chunkZAUYE2EI_js = require('./chunk-ZAUYE2EI.js');
|
|
62
62
|
var chunkMY6BYO5F_js = require('./chunk-MY6BYO5F.js');
|
|
63
63
|
var chunkMCF3EQTV_js = require('./chunk-MCF3EQTV.js');
|
|
64
64
|
var chunkWBRVUWGC_js = require('./chunk-WBRVUWGC.js');
|
|
65
|
-
var
|
|
65
|
+
var chunkWXEZA6NE_js = require('./chunk-WXEZA6NE.js');
|
|
66
66
|
var chunkNHB2TI2B_js = require('./chunk-NHB2TI2B.js');
|
|
67
67
|
var chunkADIDI7AJ_js = require('./chunk-ADIDI7AJ.js');
|
|
68
68
|
var React = require('react');
|
|
@@ -672,10 +672,6 @@ Object.defineProperty(exports, "iconBadgeVariants", {
|
|
|
672
672
|
enumerable: true,
|
|
673
673
|
get: function () { return chunkYN4HPIRC_js.iconBadgeVariants; }
|
|
674
674
|
});
|
|
675
|
-
Object.defineProperty(exports, "ImageGallery", {
|
|
676
|
-
enumerable: true,
|
|
677
|
-
get: function () { return chunkMKOKWME3_js.ImageGallery; }
|
|
678
|
-
});
|
|
679
675
|
Object.defineProperty(exports, "ImageWithFallback", {
|
|
680
676
|
enumerable: true,
|
|
681
677
|
get: function () { return chunkDLOHAW74_js.ImageWithFallback; }
|
|
@@ -688,6 +684,10 @@ Object.defineProperty(exports, "inputVariants", {
|
|
|
688
684
|
enumerable: true,
|
|
689
685
|
get: function () { return chunk77WKG2D7_js.inputVariants; }
|
|
690
686
|
});
|
|
687
|
+
Object.defineProperty(exports, "ImageGallery", {
|
|
688
|
+
enumerable: true,
|
|
689
|
+
get: function () { return chunkMKOKWME3_js.ImageGallery; }
|
|
690
|
+
});
|
|
691
691
|
Object.defineProperty(exports, "Lightbox", {
|
|
692
692
|
enumerable: true,
|
|
693
693
|
get: function () { return chunkU3XWNFHH_js.Lightbox; }
|
|
@@ -696,22 +696,22 @@ Object.defineProperty(exports, "LinkCard", {
|
|
|
696
696
|
enumerable: true,
|
|
697
697
|
get: function () { return chunkW7DZZS6L_js.LinkCard; }
|
|
698
698
|
});
|
|
699
|
-
Object.defineProperty(exports, "DualRangeSlider", {
|
|
700
|
-
enumerable: true,
|
|
701
|
-
get: function () { return chunkTDGU5Y2P_js.DualRangeSlider; }
|
|
702
|
-
});
|
|
703
699
|
Object.defineProperty(exports, "EmptyState", {
|
|
704
700
|
enumerable: true,
|
|
705
701
|
get: function () { return chunkIEHX4DU6_js.EmptyState; }
|
|
706
702
|
});
|
|
707
|
-
Object.defineProperty(exports, "
|
|
703
|
+
Object.defineProperty(exports, "DualRangeSlider", {
|
|
708
704
|
enumerable: true,
|
|
709
|
-
get: function () { return
|
|
705
|
+
get: function () { return chunkTDGU5Y2P_js.DualRangeSlider; }
|
|
710
706
|
});
|
|
711
707
|
Object.defineProperty(exports, "FilterAccordion", {
|
|
712
708
|
enumerable: true,
|
|
713
709
|
get: function () { return chunk7W3TFPIF_js.FilterAccordion; }
|
|
714
710
|
});
|
|
711
|
+
Object.defineProperty(exports, "ErrorBoundary", {
|
|
712
|
+
enumerable: true,
|
|
713
|
+
get: function () { return chunkS5TLUDNM_js.ErrorBoundary; }
|
|
714
|
+
});
|
|
715
715
|
Object.defineProperty(exports, "FilterPill", {
|
|
716
716
|
enumerable: true,
|
|
717
717
|
get: function () { return chunkN2Q4Z2FU_js.FilterPill; }
|
|
@@ -768,13 +768,9 @@ Object.defineProperty(exports, "Avatar", {
|
|
|
768
768
|
enumerable: true,
|
|
769
769
|
get: function () { return chunkEY4ZIR3P_js.Avatar; }
|
|
770
770
|
});
|
|
771
|
-
Object.defineProperty(exports, "
|
|
772
|
-
enumerable: true,
|
|
773
|
-
get: function () { return chunkZ5S7LHMY_js.Badge; }
|
|
774
|
-
});
|
|
775
|
-
Object.defineProperty(exports, "badgeVariants", {
|
|
771
|
+
Object.defineProperty(exports, "BottomNavBar", {
|
|
776
772
|
enumerable: true,
|
|
777
|
-
get: function () { return
|
|
773
|
+
get: function () { return chunkPND5YKFN_js.BottomNavBar; }
|
|
778
774
|
});
|
|
779
775
|
Object.defineProperty(exports, "Banner", {
|
|
780
776
|
enumerable: true,
|
|
@@ -784,17 +780,13 @@ Object.defineProperty(exports, "bannerVariants", {
|
|
|
784
780
|
enumerable: true,
|
|
785
781
|
get: function () { return chunk6EG6EAHW_js.bannerVariants; }
|
|
786
782
|
});
|
|
787
|
-
Object.defineProperty(exports, "
|
|
788
|
-
enumerable: true,
|
|
789
|
-
get: function () { return chunkPND5YKFN_js.BottomNavBar; }
|
|
790
|
-
});
|
|
791
|
-
Object.defineProperty(exports, "Breadcrumb", {
|
|
783
|
+
Object.defineProperty(exports, "Badge", {
|
|
792
784
|
enumerable: true,
|
|
793
|
-
get: function () { return
|
|
785
|
+
get: function () { return chunkZ5S7LHMY_js.Badge; }
|
|
794
786
|
});
|
|
795
|
-
Object.defineProperty(exports, "
|
|
787
|
+
Object.defineProperty(exports, "badgeVariants", {
|
|
796
788
|
enumerable: true,
|
|
797
|
-
get: function () { return
|
|
789
|
+
get: function () { return chunkZ5S7LHMY_js.badgeVariants; }
|
|
798
790
|
});
|
|
799
791
|
Object.defineProperty(exports, "Button", {
|
|
800
792
|
enumerable: true,
|
|
@@ -804,6 +796,14 @@ Object.defineProperty(exports, "buttonVariants", {
|
|
|
804
796
|
enumerable: true,
|
|
805
797
|
get: function () { return chunkYZTVHCLK_js.buttonVariants; }
|
|
806
798
|
});
|
|
799
|
+
Object.defineProperty(exports, "Breadcrumb", {
|
|
800
|
+
enumerable: true,
|
|
801
|
+
get: function () { return chunkH3JNRTAI_js.Breadcrumb; }
|
|
802
|
+
});
|
|
803
|
+
Object.defineProperty(exports, "breadcrumbVariants", {
|
|
804
|
+
enumerable: true,
|
|
805
|
+
get: function () { return chunkH3JNRTAI_js.breadcrumbVariants; }
|
|
806
|
+
});
|
|
807
807
|
Object.defineProperty(exports, "Card", {
|
|
808
808
|
enumerable: true,
|
|
809
809
|
get: function () { return chunkZAUYE2EI_js.Card; }
|
|
@@ -846,7 +846,7 @@ Object.defineProperty(exports, "Alert", {
|
|
|
846
846
|
});
|
|
847
847
|
Object.defineProperty(exports, "AnchorTabs", {
|
|
848
848
|
enumerable: true,
|
|
849
|
-
get: function () { return
|
|
849
|
+
get: function () { return chunkWXEZA6NE_js.AnchorTabs; }
|
|
850
850
|
});
|
|
851
851
|
Object.defineProperty(exports, "Autocomplete", {
|
|
852
852
|
enumerable: true,
|
package/dist/index.mjs
CHANGED
|
@@ -29,15 +29,15 @@ export { PromoBanner, promoBannerVariants } from './chunk-FNDR3WOZ.mjs';
|
|
|
29
29
|
export { Header } from './chunk-PPDKQ3FF.mjs';
|
|
30
30
|
export { HotelCard } from './chunk-PXHZ4CXG.mjs';
|
|
31
31
|
export { IconBadge, iconBadgeVariants } from './chunk-I4WCNTNP.mjs';
|
|
32
|
-
export { ImageGallery } from './chunk-QU6ZRLKO.mjs';
|
|
33
32
|
export { ImageWithFallback } from './chunk-BUXVK2HE.mjs';
|
|
34
33
|
export { Input, inputVariants } from './chunk-GRG4USTC.mjs';
|
|
34
|
+
export { ImageGallery } from './chunk-QU6ZRLKO.mjs';
|
|
35
35
|
export { Lightbox } from './chunk-GBWVIY3C.mjs';
|
|
36
36
|
export { LinkCard } from './chunk-UYDZKAGZ.mjs';
|
|
37
|
-
export { DualRangeSlider } from './chunk-ERL3WXNY.mjs';
|
|
38
37
|
export { EmptyState } from './chunk-OCUHCDAQ.mjs';
|
|
39
|
-
export {
|
|
38
|
+
export { DualRangeSlider } from './chunk-ERL3WXNY.mjs';
|
|
40
39
|
export { FilterAccordion } from './chunk-VQVRKRSM.mjs';
|
|
40
|
+
export { ErrorBoundary } from './chunk-5257MWFI.mjs';
|
|
41
41
|
export { FilterPill } from './chunk-TNWMTKNR.mjs';
|
|
42
42
|
export { FloatingDock } from './chunk-PBDPZTHK.mjs';
|
|
43
43
|
export { Footer } from './chunk-SZ3SV4SJ.mjs';
|
|
@@ -51,16 +51,16 @@ export { Divider } from './chunk-E4B6LXK7.mjs';
|
|
|
51
51
|
export { Drawer } from './chunk-ZLF7IL3Y.mjs';
|
|
52
52
|
export { DropdownMenu } from './chunk-Q7BKR6O7.mjs';
|
|
53
53
|
export { Avatar } from './chunk-2POGTS27.mjs';
|
|
54
|
-
export { Badge, badgeVariants } from './chunk-XZU2SISM.mjs';
|
|
55
|
-
export { Banner, bannerVariants } from './chunk-LFIZX2S6.mjs';
|
|
56
54
|
export { BottomNavBar } from './chunk-UQRQZLMQ.mjs';
|
|
57
|
-
export {
|
|
55
|
+
export { Banner, bannerVariants } from './chunk-LFIZX2S6.mjs';
|
|
56
|
+
export { Badge, badgeVariants } from './chunk-XZU2SISM.mjs';
|
|
58
57
|
export { Button, buttonVariants } from './chunk-4U5MNA3B.mjs';
|
|
58
|
+
export { Breadcrumb, breadcrumbVariants } from './chunk-UKCH6RYL.mjs';
|
|
59
59
|
export { Card, CardContent, CardDescription, CardImage, CardTitle, cardImageVariants, cardVariants } from './chunk-V5J2XLPD.mjs';
|
|
60
60
|
export { CardList } from './chunk-RJWHPHHX.mjs';
|
|
61
61
|
export { Accordion } from './chunk-NZ7GF6RF.mjs';
|
|
62
62
|
export { Alert } from './chunk-BQWVWK74.mjs';
|
|
63
|
-
export { AnchorTabs } from './chunk-
|
|
63
|
+
export { AnchorTabs } from './chunk-M2H6QUAL.mjs';
|
|
64
64
|
export { Autocomplete, autocompleteInputVariants } from './chunk-B47HQHX3.mjs';
|
|
65
65
|
import { cn } from './chunk-IMKLN273.mjs';
|
|
66
66
|
export { cn } from './chunk-IMKLN273.mjs';
|