@ledgerhq/lumen-ui-react 0.1.20 → 0.1.21

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.
@@ -41,7 +41,7 @@ const k = {
41
41
  "div",
42
42
  {
43
43
  ref: m,
44
- className: c(t, F.root({ appearance: s })),
44
+ className: c(F.root({ appearance: s }), t),
45
45
  ...p,
46
46
  children: [
47
47
  /* @__PURE__ */ r("div", { className: "flex shrink-0 items-start py-4", children: x }),
@@ -35,10 +35,10 @@ const h = f(
35
35
  {
36
36
  ref: i,
37
37
  className: p(
38
- o,
39
38
  h({
40
39
  appearance: d
41
- })
40
+ }),
41
+ o
42
42
  ),
43
43
  disabled: c,
44
44
  ...u,
@@ -19,7 +19,7 @@ import { DialogBodyProps, DialogBodyStickyContentProps, DialogContentProps, Dial
19
19
  * </DialogTrigger>
20
20
  * <DialogContent>
21
21
  * <DialogHeader
22
- * appearance='compact'
22
+ * density='compact'
23
23
  * title='Dialog Title'
24
24
  * description='Dialog Description'
25
25
  * onBack={() => {}}
@@ -37,8 +37,8 @@ const p = ({ ref: t, className: a, ...e }) => /* @__PURE__ */ o(
37
37
  ref: t,
38
38
  "data-slot": "dialog-overlay",
39
39
  className: i(
40
- a,
41
- "fixed inset-0 z-dialog-overlay bg-canvas-overlay backdrop-blur-sm data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in"
40
+ "fixed inset-0 z-dialog-overlay bg-canvas-overlay backdrop-blur-sm data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in",
41
+ a
42
42
  ),
43
43
  ...e
44
44
  }
@@ -86,8 +86,8 @@ const w = ({
86
86
  className: i(
87
87
  "-mb-24 flex min-h-0 grow flex-col overflow-y-auto px-24 pb-24",
88
88
  c === "fit" ? "basis-auto" : "basis-0",
89
- a,
90
- n === "auto" ? "scrollbar-custom" : "scrollbar-none"
89
+ n === "auto" ? "scrollbar-custom" : "scrollbar-none",
90
+ a
91
91
  ),
92
92
  ...d,
93
93
  children: e
@@ -1,3 +1,3 @@
1
1
  import { DialogHeaderProps } from '../types';
2
- export declare const DialogHeader: ({ ref, title, description, appearance, ...props }: DialogHeaderProps) => import("react/jsx-runtime").JSX.Element;
2
+ export declare const DialogHeader: ({ ref, title, description, density, ...props }: DialogHeaderProps) => import("react/jsx-runtime").JSX.Element;
3
3
  //# sourceMappingURL=DialogHeader.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"DialogHeader.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Dialog/DialogHeader/DialogHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAiJ7C,eAAO,MAAM,YAAY,GAAI,mDAM1B,iBAAiB,4CAqBnB,CAAC"}
1
+ {"version":3,"file":"DialogHeader.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Dialog/DialogHeader/DialogHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAiJ7C,eAAO,MAAM,YAAY,GAAI,gDAM1B,iBAAiB,4CAqBnB,CAAC"}
@@ -1,6 +1,6 @@
1
- import { jsxs as i, Fragment as s, jsx as e } from "react/jsx-runtime";
2
- import { cn as c } from "../../../../libs/utils-shared/dist/index.js";
3
- import * as p from "@radix-ui/react-dialog";
1
+ import { jsxs as n, Fragment as c, jsx as e } from "react/jsx-runtime";
2
+ import { cn as s } from "../../../../libs/utils-shared/dist/index.js";
3
+ import * as h from "@radix-ui/react-dialog";
4
4
  import { cva as u } from "class-variance-authority";
5
5
  import { useCommonTranslation as x } from "../../../../i18n/useCommonTranslation.js";
6
6
  import { IconButton as f } from "../../IconButton/IconButton.js";
@@ -9,7 +9,7 @@ import { DialogClose as b } from "../DialogClose/DialogClose.js";
9
9
  import { Close as v } from "../../../Symbols/Icons/Close.js";
10
10
  const D = u("flex px-24 text-base", {
11
11
  variants: {
12
- appearance: {
12
+ density: {
13
13
  compact: "mb-12 h-64 min-h-64 flex-row items-center gap-12",
14
14
  expanded: "flex-col gap-16 pb-12 pt-10"
15
15
  }
@@ -27,7 +27,7 @@ const D = u("flex px-24 text-base", {
27
27
  "aria-label": a("components.dialogHeader.goBackAriaLabel")
28
28
  }
29
29
  );
30
- }, h = ({ onClose: r }) => {
30
+ }, p = ({ onClose: r }) => {
31
31
  const { t: a } = x();
32
32
  return /* @__PURE__ */ e(b, { asChild: !0, children: /* @__PURE__ */ e(
33
33
  f,
@@ -41,42 +41,42 @@ const D = u("flex px-24 text-base", {
41
41
  }
42
42
  ) });
43
43
  }, C = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
44
- p.Title,
44
+ h.Title,
45
45
  {
46
46
  "data-slot": "dialog-title",
47
- className: c(r && "sr-only", a),
47
+ className: s(r && "sr-only", a),
48
48
  ...o
49
49
  }
50
- ), y = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
51
- p.Description,
50
+ ), H = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
51
+ h.Description,
52
52
  {
53
53
  "data-slot": "dialog-description",
54
- className: c(r && "sr-only", a),
54
+ className: s(r && "sr-only", a),
55
55
  ...o
56
56
  }
57
- ), H = ({
57
+ ), w = ({
58
58
  ref: r,
59
59
  className: a,
60
- appearance: o = "compact",
60
+ density: o = "compact",
61
61
  title: l,
62
62
  description: t,
63
63
  onClose: m,
64
- onBack: n,
64
+ onBack: i,
65
65
  ...g
66
- }) => /* @__PURE__ */ i(
66
+ }) => /* @__PURE__ */ n(
67
67
  "div",
68
68
  {
69
69
  ref: r,
70
- className: D({ appearance: o, className: a }),
70
+ className: D({ density: o, className: a }),
71
71
  ...g,
72
72
  children: [
73
- o === "compact" && /* @__PURE__ */ i(s, { children: [
74
- n && /* @__PURE__ */ e(d, { onBack: n }),
75
- /* @__PURE__ */ i(
73
+ o === "compact" && /* @__PURE__ */ n(c, { children: [
74
+ i && /* @__PURE__ */ e(d, { onBack: i }),
75
+ /* @__PURE__ */ n(
76
76
  "div",
77
77
  {
78
- className: c("flex min-w-0 flex-1 flex-col", {
79
- "pl-40": !n
78
+ className: s("flex min-w-0 flex-1 flex-col", {
79
+ "pl-40": !i
80
80
  }),
81
81
  children: [
82
82
  l && /* @__PURE__ */ e("div", { className: "truncate text-center heading-5-semi-bold", children: l }),
@@ -84,14 +84,14 @@ const D = u("flex px-24 text-base", {
84
84
  ]
85
85
  }
86
86
  ),
87
- /* @__PURE__ */ e(h, { onClose: m })
87
+ /* @__PURE__ */ e(p, { onClose: m })
88
88
  ] }),
89
- o === "expanded" && /* @__PURE__ */ i(s, { children: [
90
- /* @__PURE__ */ i("div", { className: "flex h-40 flex-row items-center", children: [
91
- n && /* @__PURE__ */ e(d, { onBack: n }),
92
- /* @__PURE__ */ e("div", { className: "ml-auto", children: /* @__PURE__ */ e(h, { onClose: m }) })
89
+ o === "expanded" && /* @__PURE__ */ n(c, { children: [
90
+ /* @__PURE__ */ n("div", { className: "flex h-40 flex-row items-center", children: [
91
+ i && /* @__PURE__ */ e(d, { onBack: i }),
92
+ /* @__PURE__ */ e("div", { className: "ml-auto", children: /* @__PURE__ */ e(p, { onClose: m }) })
93
93
  ] }),
94
- (l || t) && /* @__PURE__ */ i("div", { className: "flex flex-col gap-4", children: [
94
+ (l || t) && /* @__PURE__ */ n("div", { className: "flex flex-col gap-4", children: [
95
95
  l && /* @__PURE__ */ e("div", { className: "heading-3-semi-bold", children: l }),
96
96
  t && /* @__PURE__ */ e("div", { className: "body-2 text-muted", children: t })
97
97
  ] })
@@ -102,21 +102,21 @@ const D = u("flex px-24 text-base", {
102
102
  ref: r,
103
103
  title: a = "",
104
104
  description: o,
105
- appearance: l = "compact",
105
+ density: l = "compact",
106
106
  ...t
107
- }) => /* @__PURE__ */ i(s, { children: [
107
+ }) => /* @__PURE__ */ n(c, { children: [
108
108
  /* @__PURE__ */ e(
109
- H,
109
+ w,
110
110
  {
111
111
  ref: r,
112
112
  title: a,
113
113
  description: o,
114
- appearance: l,
114
+ density: l,
115
115
  ...t
116
116
  }
117
117
  ),
118
118
  /* @__PURE__ */ e(C, { hidden: !0, children: a }),
119
- o && /* @__PURE__ */ e(y, { hidden: !0, children: o })
119
+ o && /* @__PURE__ */ e(H, { hidden: !0, children: o })
120
120
  ] });
121
121
  export {
122
122
  F as DialogHeader
@@ -1,3 +1,4 @@
1
+ import { Density } from '@ledgerhq/lumen-utils-shared';
1
2
  import { ComponentPropsWithRef, ReactNode } from 'react';
2
3
  export type DialogHeight = 'fit' | 'fixed';
3
4
  export type DialogProps = {
@@ -95,10 +96,10 @@ export type DialogContentProps = {
95
96
  };
96
97
  export type DialogHeaderProps = {
97
98
  /**
98
- * The appearance variant of the header.
99
+ * The density variant of the header.
99
100
  * @default 'compact'
100
101
  */
101
- appearance?: 'compact' | 'expanded';
102
+ density?: Density;
102
103
  /**
103
104
  * The main title to display in the header.
104
105
  */
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Dialog/types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Dialog/types.ts"],"names":[],"mappings":"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"}
@@ -33,7 +33,7 @@ const h = a("inline-block shrink-0", {
33
33
  "aria-hidden": "true",
34
34
  xmlns: e,
35
35
  viewBox: r,
36
- className: s(i, h({ size: n }), "inline-block"),
36
+ className: s(h({ size: n }), "inline-block", i),
37
37
  ...t
38
38
  },
39
39
  c
@@ -46,8 +46,8 @@ const v = u(
46
46
  ref: s,
47
47
  disabled: e,
48
48
  className: b(
49
- i,
50
- v({ disabled: e, iconType: r, appearance: n })
49
+ v({ disabled: e, iconType: r, appearance: n }),
50
+ i
51
51
  ),
52
52
  children: /* @__PURE__ */ t(a, { size: o })
53
53
  }
@@ -58,13 +58,13 @@ const w = k(
58
58
  {
59
59
  ref: d,
60
60
  className: h(
61
- m,
62
61
  w({
63
62
  appearance: f,
64
63
  size: i,
65
64
  underline: p,
66
65
  disabled: s
67
- })
66
+ }),
67
+ m
68
68
  ),
69
69
  "aria-disabled": s || void 0,
70
70
  target: n && !t ? "_blank" : void 0,
@@ -84,12 +84,12 @@ const N = g(
84
84
  {
85
85
  ref: c,
86
86
  className: f(
87
- a,
88
87
  N({
89
88
  disabled: m,
90
89
  appearance: n,
91
90
  size: o
92
- })
91
+ }),
92
+ a
93
93
  ),
94
94
  ...l,
95
95
  children: u
@@ -51,7 +51,7 @@ const b = d(
51
51
  a.Root,
52
52
  {
53
53
  ref: i,
54
- className: s(o, b({ size: e })),
54
+ className: s(b({ size: e }), o),
55
55
  checked: r,
56
56
  defaultChecked: n,
57
57
  onCheckedChange: c,
@@ -48,7 +48,7 @@ const x = u(
48
48
  return /* @__PURE__ */ l(
49
49
  "div",
50
50
  {
51
- className: g(n, x({ appearance: r, size: e, disabled: m })),
51
+ className: g(x({ appearance: r, size: e, disabled: m }), n),
52
52
  ref: s,
53
53
  ...o,
54
54
  children: [
package/dist/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ledgerhq/lumen-ui-react",
3
- "version": "0.1.19",
3
+ "version": "0.1.20",
4
4
  "license": "Apache-2.0",
5
5
  "sideEffects": false,
6
6
  "keywords": [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ledgerhq/lumen-ui-react",
3
- "version": "0.1.20",
3
+ "version": "0.1.21",
4
4
  "license": "Apache-2.0",
5
5
  "sideEffects": false,
6
6
  "keywords": [