@ledgerhq/lumen-ui-react 0.0.67 → 0.0.68
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 +10 -8
- package/dist/lib/Components/Tile/Tile.d.ts +1 -0
- package/dist/lib/Components/Tile/Tile.d.ts.map +1 -1
- package/dist/lib/Components/Tile/Tile.js +62 -55
- package/dist/lib/Components/Tile/types.d.ts +6 -0
- package/dist/lib/Components/Tile/types.d.ts.map +1 -1
- package/dist/lib/Components/TileButton/TileButton.d.ts +37 -0
- package/dist/lib/Components/TileButton/TileButton.d.ts.map +1 -0
- package/dist/lib/Components/TileButton/TileButton.js +81 -0
- package/dist/lib/Components/TileButton/index.d.ts +3 -0
- package/dist/lib/Components/TileButton/index.d.ts.map +1 -0
- package/dist/lib/Components/TileButton/types.d.ts +45 -0
- package/dist/lib/Components/TileButton/types.d.ts.map +1 -0
- package/dist/lib/Components/index.d.ts +1 -0
- package/dist/lib/Components/index.d.ts.map +1 -1
- package/dist/package.json +2 -2
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -24,8 +24,9 @@ import { Switch as Ge } from "./lib/Components/Switch/Switch.js";
|
|
|
24
24
|
import { Tag as Re } from "./lib/Components/Tag/Tag.js";
|
|
25
25
|
import { TextInput as Fe } from "./lib/Components/TextInput/TextInput.js";
|
|
26
26
|
import { Tile as je, TileContent as qe, TileDescription as ze, TileSecondaryAction as Ee, TileSpot as Je, TileTitle as Ke } from "./lib/Components/Tile/Tile.js";
|
|
27
|
-
import {
|
|
28
|
-
import {
|
|
27
|
+
import { TileButton as Oe } from "./lib/Components/TileButton/TileButton.js";
|
|
28
|
+
import { Tooltip as Ue, TooltipContent as Ve, TooltipProvider as We, TooltipTrigger as Xe } from "./lib/Components/Tooltip/Tooltip.js";
|
|
29
|
+
import { ThemeProvider as Ze, useTheme as _e } from "./lib/Components/ThemeProvider/ThemeProvider.js";
|
|
29
30
|
export {
|
|
30
31
|
n as AddressInput,
|
|
31
32
|
p as AmountInput,
|
|
@@ -91,16 +92,17 @@ export {
|
|
|
91
92
|
Ge as Switch,
|
|
92
93
|
Re as Tag,
|
|
93
94
|
Fe as TextInput,
|
|
94
|
-
|
|
95
|
+
Ze as ThemeProvider,
|
|
95
96
|
je as Tile,
|
|
97
|
+
Oe as TileButton,
|
|
96
98
|
qe as TileContent,
|
|
97
99
|
ze as TileDescription,
|
|
98
100
|
Ee as TileSecondaryAction,
|
|
99
101
|
Je as TileSpot,
|
|
100
102
|
Ke as TileTitle,
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
103
|
+
Ue as Tooltip,
|
|
104
|
+
Ve as TooltipContent,
|
|
105
|
+
We as TooltipProvider,
|
|
106
|
+
Xe as TooltipTrigger,
|
|
107
|
+
_e as useTheme
|
|
106
108
|
};
|
|
@@ -29,6 +29,7 @@ import { TileContentProps, TileDescriptionProps, TileSpotProps, TileTitleProps }
|
|
|
29
29
|
export declare const Tile: import('react').ForwardRefExoticComponent<{
|
|
30
30
|
appearance?: "no-background" | "card";
|
|
31
31
|
disabled?: boolean;
|
|
32
|
+
centered?: boolean;
|
|
32
33
|
onClick?: import('react').MouseEventHandler<HTMLButtonElement>;
|
|
33
34
|
children: import('react').ReactNode;
|
|
34
35
|
className?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tile.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Tile/Tile.tsx"],"names":[],"mappings":"AAKA,OAAO,EACL,gBAAgB,EAEhB,oBAAoB,EAGpB,aAAa,EACb,cAAc,EACf,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"Tile.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Tile/Tile.tsx"],"names":[],"mappings":"AAKA,OAAO,EACL,gBAAgB,EAEhB,oBAAoB,EAGpB,aAAa,EACb,cAAc,EACf,MAAM,SAAS,CAAC;AAuCjB;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,IAAI;;;;;;;;;uHAyChB,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,QAAQ;YAAW,aAAa;;CAM5C,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,WAAW;wCAIrB,gBAAgB;;CASlB,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,SAAS;wCAInB,cAAc;;CAiBhB,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,eAAe;wCAIzB,oBAAoB;;CAiBtB,CAAC;AAGF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,mBAAmB;;;;0HAsC9B,CAAC"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { jsx as a, jsxs as T } from "react/jsx-runtime";
|
|
2
|
-
import { createSafeContext as v, cn as
|
|
3
|
-
import { cva as
|
|
4
|
-
import { forwardRef as
|
|
2
|
+
import { createSafeContext as v, cn as n } from "../../../libs/utils-shared/dist/index.js";
|
|
3
|
+
import { cva as f } from "class-variance-authority";
|
|
4
|
+
import { forwardRef as b, useCallback as x } from "react";
|
|
5
5
|
import { Spot as y } from "../Spot/Spot.js";
|
|
6
6
|
import { InteractiveIcon as N } from "../InteractiveIcon/InteractiveIcon.js";
|
|
7
|
-
const [g,
|
|
8
|
-
root:
|
|
7
|
+
const [g, l] = v("Tile"), m = {
|
|
8
|
+
root: f([
|
|
9
9
|
"group relative flex flex-col items-center rounded-md text-base transition-colors focus-visible:outline-2 focus-visible:outline-focus"
|
|
10
10
|
]),
|
|
11
|
-
inner:
|
|
11
|
+
inner: f(
|
|
12
12
|
[
|
|
13
13
|
"flex w-full flex-col items-center gap-8 px-8 py-12",
|
|
14
14
|
"rounded-md focus-visible:outline-2 focus-visible:outline-focus"
|
|
@@ -22,54 +22,61 @@ const [g, n] = v("Tile"), b = {
|
|
|
22
22
|
disabled: {
|
|
23
23
|
true: "cursor-default",
|
|
24
24
|
false: "cursor-pointer"
|
|
25
|
+
},
|
|
26
|
+
centered: {
|
|
27
|
+
true: "h-full justify-center",
|
|
28
|
+
false: ""
|
|
25
29
|
}
|
|
26
30
|
},
|
|
27
31
|
defaultVariants: {
|
|
28
32
|
appearance: "no-background",
|
|
29
|
-
disabled: !1
|
|
33
|
+
disabled: !1,
|
|
34
|
+
centered: !1
|
|
30
35
|
}
|
|
31
36
|
}
|
|
32
37
|
)
|
|
33
|
-
}, h =
|
|
38
|
+
}, h = b(
|
|
34
39
|
({
|
|
35
40
|
className: e,
|
|
36
41
|
onClick: t,
|
|
37
|
-
secondaryAction:
|
|
38
|
-
appearance:
|
|
42
|
+
secondaryAction: r,
|
|
43
|
+
appearance: o = "no-background",
|
|
39
44
|
disabled: i = !1,
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
45
|
+
centered: c = !1,
|
|
46
|
+
children: d,
|
|
47
|
+
style: u,
|
|
48
|
+
...p
|
|
49
|
+
}, s) => /* @__PURE__ */ a(g, { value: { disabled: i }, children: /* @__PURE__ */ T(
|
|
44
50
|
"div",
|
|
45
51
|
{
|
|
46
|
-
ref:
|
|
47
|
-
style:
|
|
48
|
-
className:
|
|
52
|
+
ref: s,
|
|
53
|
+
style: u,
|
|
54
|
+
className: m.root({
|
|
49
55
|
className: e
|
|
50
56
|
}),
|
|
51
57
|
children: [
|
|
52
58
|
/* @__PURE__ */ a(
|
|
53
59
|
"button",
|
|
54
60
|
{
|
|
55
|
-
...
|
|
61
|
+
...p,
|
|
56
62
|
onClick: t,
|
|
57
63
|
disabled: i,
|
|
58
|
-
className:
|
|
59
|
-
appearance:
|
|
60
|
-
disabled: i
|
|
64
|
+
className: m.inner({
|
|
65
|
+
appearance: o,
|
|
66
|
+
disabled: i,
|
|
67
|
+
centered: c
|
|
61
68
|
}),
|
|
62
|
-
children:
|
|
69
|
+
children: d
|
|
63
70
|
}
|
|
64
71
|
),
|
|
65
|
-
|
|
72
|
+
r
|
|
66
73
|
]
|
|
67
74
|
}
|
|
68
75
|
) })
|
|
69
76
|
);
|
|
70
77
|
h.displayName = "Tile";
|
|
71
78
|
const S = (e) => {
|
|
72
|
-
const { disabled: t } =
|
|
79
|
+
const { disabled: t } = l({
|
|
73
80
|
consumerName: "TileSpot",
|
|
74
81
|
contextRequired: !0
|
|
75
82
|
});
|
|
@@ -79,12 +86,12 @@ S.displayName = "TileSpot";
|
|
|
79
86
|
const w = ({
|
|
80
87
|
children: e,
|
|
81
88
|
className: t,
|
|
82
|
-
...
|
|
89
|
+
...r
|
|
83
90
|
}) => /* @__PURE__ */ a(
|
|
84
91
|
"div",
|
|
85
92
|
{
|
|
86
|
-
className:
|
|
87
|
-
...
|
|
93
|
+
className: n("flex w-full flex-col items-center text-center", t),
|
|
94
|
+
...r,
|
|
88
95
|
children: e
|
|
89
96
|
}
|
|
90
97
|
);
|
|
@@ -92,84 +99,84 @@ w.displayName = "TileContent";
|
|
|
92
99
|
const R = ({
|
|
93
100
|
children: e,
|
|
94
101
|
className: t,
|
|
95
|
-
...
|
|
102
|
+
...r
|
|
96
103
|
}) => {
|
|
97
|
-
const { disabled:
|
|
104
|
+
const { disabled: o } = l({
|
|
98
105
|
consumerName: "TileTitle",
|
|
99
106
|
contextRequired: !0
|
|
100
107
|
});
|
|
101
108
|
return /* @__PURE__ */ a(
|
|
102
109
|
"div",
|
|
103
110
|
{
|
|
104
|
-
className:
|
|
111
|
+
className: n(
|
|
105
112
|
"w-full truncate body-2-semi-bold",
|
|
106
|
-
|
|
113
|
+
o && "text-disabled",
|
|
107
114
|
t
|
|
108
115
|
),
|
|
109
|
-
...
|
|
116
|
+
...r,
|
|
110
117
|
children: e
|
|
111
118
|
}
|
|
112
119
|
);
|
|
113
120
|
};
|
|
114
121
|
R.displayName = "TileTitle";
|
|
115
|
-
const
|
|
122
|
+
const j = ({
|
|
116
123
|
children: e,
|
|
117
124
|
className: t,
|
|
118
|
-
...
|
|
125
|
+
...r
|
|
119
126
|
}) => {
|
|
120
|
-
const { disabled:
|
|
127
|
+
const { disabled: o } = l({
|
|
121
128
|
consumerName: "TileDescription",
|
|
122
129
|
contextRequired: !0
|
|
123
130
|
});
|
|
124
131
|
return /* @__PURE__ */ a(
|
|
125
132
|
"div",
|
|
126
133
|
{
|
|
127
|
-
className:
|
|
134
|
+
className: n(
|
|
128
135
|
"w-full truncate body-3",
|
|
129
|
-
|
|
136
|
+
o ? "text-disabled" : "text-muted",
|
|
130
137
|
t
|
|
131
138
|
),
|
|
132
|
-
...
|
|
139
|
+
...r,
|
|
133
140
|
children: e
|
|
134
141
|
}
|
|
135
142
|
);
|
|
136
143
|
};
|
|
137
|
-
|
|
138
|
-
const
|
|
139
|
-
const { disabled:
|
|
144
|
+
j.displayName = "TileDescription";
|
|
145
|
+
const q = b(({ onClick: e, icon: t, className: r, "aria-label": o, ...i }, c) => {
|
|
146
|
+
const { disabled: d } = l({
|
|
140
147
|
consumerName: "TileSecondaryAction",
|
|
141
148
|
contextRequired: !0
|
|
142
|
-
}),
|
|
143
|
-
(
|
|
144
|
-
|
|
149
|
+
}), u = x(
|
|
150
|
+
(s) => {
|
|
151
|
+
s.stopPropagation(), s.preventDefault(), e == null || e(s);
|
|
145
152
|
},
|
|
146
153
|
[e]
|
|
147
154
|
);
|
|
148
|
-
if (
|
|
149
|
-
const
|
|
155
|
+
if (d) return null;
|
|
156
|
+
const p = t;
|
|
150
157
|
return /* @__PURE__ */ a(
|
|
151
158
|
N,
|
|
152
159
|
{
|
|
153
|
-
className:
|
|
160
|
+
className: n(
|
|
154
161
|
"absolute top-8 right-4 opacity-0 transition-opacity duration-200 group-hover:opacity-100 focus-within:opacity-100",
|
|
155
|
-
|
|
162
|
+
r
|
|
156
163
|
),
|
|
157
164
|
"data-secondary-button-container": !0,
|
|
158
165
|
iconType: "stroked",
|
|
159
|
-
onClick:
|
|
160
|
-
"aria-label":
|
|
161
|
-
ref:
|
|
166
|
+
onClick: u,
|
|
167
|
+
"aria-label": o,
|
|
168
|
+
ref: c,
|
|
162
169
|
...i,
|
|
163
|
-
children: /* @__PURE__ */ a(
|
|
170
|
+
children: /* @__PURE__ */ a(p, { size: 24 })
|
|
164
171
|
}
|
|
165
172
|
);
|
|
166
173
|
});
|
|
167
|
-
|
|
174
|
+
q.displayName = "TileSecondaryAction";
|
|
168
175
|
export {
|
|
169
176
|
h as Tile,
|
|
170
177
|
w as TileContent,
|
|
171
|
-
|
|
172
|
-
|
|
178
|
+
j as TileDescription,
|
|
179
|
+
q as TileSecondaryAction,
|
|
173
180
|
S as TileSpot,
|
|
174
181
|
R as TileTitle
|
|
175
182
|
};
|
|
@@ -18,6 +18,12 @@ export type TileProps = {
|
|
|
18
18
|
* @default false
|
|
19
19
|
*/
|
|
20
20
|
disabled?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* Whether the tile content should be centered vertically.
|
|
23
|
+
* Useful when the tile has a fixed height and you want the content centered.
|
|
24
|
+
* @default false
|
|
25
|
+
*/
|
|
26
|
+
centered?: boolean;
|
|
21
27
|
/**
|
|
22
28
|
* The function to call when the tile is clicked.
|
|
23
29
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Tile/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAEvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IACtB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,eAAe,GAAG,MAAM,CAAC;IACtC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC;CAC7B,GAAG,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,SAAS,CAAC,CAAC;AAEvD,MAAM,MAAM,aAAa,GAAG,sBAAsB,CAAC;AAEnD,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IACvD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,SAAS,CAAC,CAAC"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Tile/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAEvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IACtB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,eAAe,GAAG,MAAM,CAAC;IACtC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC;CAC7B,GAAG,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,SAAS,CAAC,CAAC;AAEvD,MAAM,MAAM,aAAa,GAAG,sBAAsB,CAAC;AAEnD,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IACvD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,SAAS,CAAC,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* A compact button component displaying an icon above a label in a vertical layout.
|
|
4
|
+
* Ideal for grids, toolbars, or quick action menus.
|
|
5
|
+
*
|
|
6
|
+
* @see {@link https://ldls.vercel.app/?path=/docs/action-tilebutton--docs Storybook}
|
|
7
|
+
*
|
|
8
|
+
* @example
|
|
9
|
+
* import { TileButton } from '@ledgerhq/lumen-ui-react';
|
|
10
|
+
* import { Settings } from '@ledgerhq/lumen-ui-react/symbols';
|
|
11
|
+
*
|
|
12
|
+
* <TileButton icon={Settings} onClick={() => console.log('clicked')}>
|
|
13
|
+
* Settings
|
|
14
|
+
* </TileButton>
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* // Using with router (asChild pattern)
|
|
18
|
+
* import { Link } from 'react-router-dom';
|
|
19
|
+
*
|
|
20
|
+
* <TileButton asChild icon={Settings}>
|
|
21
|
+
* <Link to="/settings">Settings</Link>
|
|
22
|
+
* </TileButton>
|
|
23
|
+
*/
|
|
24
|
+
export declare const TileButton: React.ForwardRefExoticComponent<{
|
|
25
|
+
icon: React.ComponentType<{
|
|
26
|
+
size?: import('../Icon').IconSize;
|
|
27
|
+
className?: string;
|
|
28
|
+
}>;
|
|
29
|
+
children: React.ReactNode;
|
|
30
|
+
onClick?: React.MouseEventHandler<HTMLButtonElement>;
|
|
31
|
+
disabled?: boolean;
|
|
32
|
+
isFull?: boolean;
|
|
33
|
+
className?: string;
|
|
34
|
+
'aria-label'?: string;
|
|
35
|
+
asChild?: boolean;
|
|
36
|
+
} & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children" | "onClick"> & React.RefAttributes<HTMLButtonElement>>;
|
|
37
|
+
//# sourceMappingURL=TileButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TileButton.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/TileButton/TileButton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAsC3C;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,UAAU;;YAvDlB,CAAC;iBAAqB,CAAC;;;;;;;;;yHAuG3B,CAAC"}
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
import { jsxs as b, jsx as s } from "react/jsx-runtime";
|
|
2
|
+
import { cn as p } from "../../../libs/utils-shared/dist/index.js";
|
|
3
|
+
import { Slot as v, Slottable as x } from "@radix-ui/react-slot";
|
|
4
|
+
import { cva as r } from "class-variance-authority";
|
|
5
|
+
import g, { useCallback as N } from "react";
|
|
6
|
+
const V = r(
|
|
7
|
+
[
|
|
8
|
+
"flex flex-col items-center gap-8 rounded-md p-12",
|
|
9
|
+
"bg-muted body-2-semi-bold text-base transition-colors",
|
|
10
|
+
"focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus"
|
|
11
|
+
],
|
|
12
|
+
{
|
|
13
|
+
variants: {
|
|
14
|
+
disabled: {
|
|
15
|
+
true: "bg-disabled text-disabled cursor-not-allowed",
|
|
16
|
+
false: "hover:bg-muted-hover active:bg-muted-pressed cursor-pointer"
|
|
17
|
+
},
|
|
18
|
+
isFull: {
|
|
19
|
+
true: "w-full"
|
|
20
|
+
}
|
|
21
|
+
},
|
|
22
|
+
defaultVariants: {
|
|
23
|
+
disabled: !1,
|
|
24
|
+
isFull: !1
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
), j = r("shrink-0", {
|
|
28
|
+
variants: {
|
|
29
|
+
disabled: {
|
|
30
|
+
true: "text-disabled",
|
|
31
|
+
false: "text-base"
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
defaultVariants: {
|
|
35
|
+
disabled: !1
|
|
36
|
+
}
|
|
37
|
+
}), w = g.forwardRef(
|
|
38
|
+
({
|
|
39
|
+
icon: i,
|
|
40
|
+
children: l,
|
|
41
|
+
onClick: t,
|
|
42
|
+
disabled: e = !1,
|
|
43
|
+
isFull: n = !1,
|
|
44
|
+
className: u,
|
|
45
|
+
asChild: a = !1,
|
|
46
|
+
"aria-label": f,
|
|
47
|
+
...c
|
|
48
|
+
}, d) => {
|
|
49
|
+
const m = N(
|
|
50
|
+
(o) => {
|
|
51
|
+
if (e) {
|
|
52
|
+
o.preventDefault();
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
t == null || t(o);
|
|
56
|
+
},
|
|
57
|
+
[e, t]
|
|
58
|
+
);
|
|
59
|
+
return /* @__PURE__ */ b(
|
|
60
|
+
a ? v : "button",
|
|
61
|
+
{
|
|
62
|
+
ref: d,
|
|
63
|
+
type: a ? void 0 : "button",
|
|
64
|
+
className: p(V({ disabled: e, isFull: n }), u),
|
|
65
|
+
onClick: m,
|
|
66
|
+
disabled: e,
|
|
67
|
+
"data-disabled": e || void 0,
|
|
68
|
+
"aria-label": f,
|
|
69
|
+
...c,
|
|
70
|
+
children: [
|
|
71
|
+
/* @__PURE__ */ s(i, { size: 20, className: j({ disabled: e }) }),
|
|
72
|
+
a ? /* @__PURE__ */ s(x, { children: l }) : /* @__PURE__ */ s("span", { className: "line-clamp-2 text-center", children: l })
|
|
73
|
+
]
|
|
74
|
+
}
|
|
75
|
+
);
|
|
76
|
+
}
|
|
77
|
+
);
|
|
78
|
+
w.displayName = "TileButton";
|
|
79
|
+
export {
|
|
80
|
+
w as TileButton
|
|
81
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/TileButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,cAAc,SAAS,CAAC"}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { ButtonHTMLAttributes, MouseEventHandler, ReactNode } from 'react';
|
|
2
|
+
import { IconSize } from '../Icon/types';
|
|
3
|
+
export type TileButtonProps = {
|
|
4
|
+
/**
|
|
5
|
+
* The icon component to render above the label.
|
|
6
|
+
* Will be rendered at 20px size.
|
|
7
|
+
*/
|
|
8
|
+
icon: React.ComponentType<{
|
|
9
|
+
size?: IconSize;
|
|
10
|
+
className?: string;
|
|
11
|
+
}>;
|
|
12
|
+
/**
|
|
13
|
+
* The content of the button (label text).
|
|
14
|
+
*/
|
|
15
|
+
children: ReactNode;
|
|
16
|
+
/**
|
|
17
|
+
* Click handler for the button.
|
|
18
|
+
*/
|
|
19
|
+
onClick?: MouseEventHandler<HTMLButtonElement>;
|
|
20
|
+
/**
|
|
21
|
+
* Whether the button is disabled.
|
|
22
|
+
* @default false
|
|
23
|
+
*/
|
|
24
|
+
disabled?: boolean;
|
|
25
|
+
/**
|
|
26
|
+
* If true, the button expands to full width of its container.
|
|
27
|
+
* @default false
|
|
28
|
+
*/
|
|
29
|
+
isFull?: boolean;
|
|
30
|
+
/**
|
|
31
|
+
* Additional CSS classes for layout adjustments.
|
|
32
|
+
*/
|
|
33
|
+
className?: string;
|
|
34
|
+
/**
|
|
35
|
+
* Accessible label for the button.
|
|
36
|
+
*/
|
|
37
|
+
'aria-label'?: string;
|
|
38
|
+
/**
|
|
39
|
+
* Optional prop to render the button as a child element.
|
|
40
|
+
* When true, TileButton merges its props with its child element.
|
|
41
|
+
* @default false
|
|
42
|
+
*/
|
|
43
|
+
asChild?: boolean;
|
|
44
|
+
} & Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'children'>;
|
|
45
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/TileButton/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3E,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACnE;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/Components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/Components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC"}
|
package/dist/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ledgerhq/lumen-ui-react",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.67",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"keywords": [
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
]
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@ledgerhq/lumen-utils-shared": "0.0.
|
|
44
|
+
"@ledgerhq/lumen-utils-shared": "0.0.16",
|
|
45
45
|
"i18next": "^23.7.0",
|
|
46
46
|
"react-i18next": "^14.0.0"
|
|
47
47
|
},
|