@dmsi/wedgekit-react 2.1.0 → 2.1.1

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.
Files changed (5) hide show
  1. package/dist/components/Link.d.ts.map +1 -1
  2. package/dist/components/Link.js +25 -22
  3. package/dist/components/MobileNavMenu.d.ts.map +1 -1
  4. package/dist/components/MobileNavMenu.js +45 -44
  5. package/package.json +1 -1
package/dist/components/Link.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/components/Link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAGpE,MAAM,MAAM,SAAS,GAAG,OAAO,GAC7B,cAAc,GACd,eAAe,GAAG;IAChB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IAC/C,eAAe,CAAC,EAAE,WAAW,GAAG,SAAS,GAAG,YAAY,CAAC;IACzD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEJ,wBAAgB,IAAI,CAAC,EACnB,EAAQ,EACR,SAAS,EACT,OAAmB,EACnB,eAA6B,EAC7B,QAAgB,EAChB,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAiB,EACjB,MAAM,EACN,MAAM,EACN,KAAa,EACb,WAAW,EACX,GAAG,KAAK,EACT,EAAE,SAAS,2CAmFX"}
1
+ {"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/components/Link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAGpE,MAAM,MAAM,SAAS,GAAG,OAAO,GAC7B,cAAc,GACd,eAAe,GAAG;IAChB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IAC/C,eAAe,CAAC,EAAE,WAAW,GAAG,SAAS,GAAG,YAAY,CAAC;IACzD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEJ,wBAAgB,IAAI,CAAC,EACnB,EAAQ,EACR,SAAS,EACT,OAAmB,EACnB,eAA6B,EAC7B,QAAgB,EAChB,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAiB,EACjB,MAAM,EACN,MAAM,EACN,KAAa,EACb,WAAW,EACX,GAAG,KAAK,EACT,EAAE,SAAS,2CAsFX"}
package/dist/components/Link.js CHANGED
@@ -1,64 +1,67 @@
1
1
  import { jsx as C } from "react/jsx-runtime";
2
- import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
2
+ import { clsx as r } from "../node_modules/clsx/dist/clsx.js";
3
3
  import { baseTransition as D, typography as l, componentPaddingY as I } from "../classNames.js";
4
4
  function T({
5
- as: x = "a",
6
- className: s,
7
- variant: r = "primary",
5
+ as: s = "a",
6
+ className: x,
7
+ variant: i = "primary",
8
8
  typographyStyle: o = "paragraph",
9
9
  disabled: t = !1,
10
- color: c,
10
+ color: n,
11
11
  paddedY: p,
12
- align: i,
12
+ align: e,
13
13
  underline: d = !1,
14
14
  testid: f,
15
- active: n,
15
+ active: c,
16
16
  block: m = !1,
17
17
  addOverflow: u,
18
18
  ...a
19
19
  }) {
20
- const y = x, v = r === "primary" && !t && e(
21
- n ? "text-text-link-active" : "text-text-link-normal",
20
+ const y = s, v = i === "primary" && !t && r(
21
+ c ? "text-text-link-active" : "text-text-link-normal",
22
22
  "hover:text-text-link-hover active:text-text-link-active"
23
- ), h = r === "secondary" && !t && e(
24
- n ? "text-text-link-active" : "text-text-primary-normal",
23
+ ), h = i === "secondary" && !t && r(
24
+ c ? "text-text-link-active" : "text-text-primary-normal",
25
25
  "hover:text-text-link-hover active:text-text-link-active"
26
- ), S = r === "critical" && !t && e(
27
- n ? "text-text-action-critical-active" : "text-text-action-critical-normal",
26
+ ), S = i === "critical" && !t && r(
27
+ c ? "text-text-action-critical-active" : "text-text-action-critical-normal",
28
28
  "hover:text-text-action-critical-hover active:text-text-action-critical-active"
29
- ), k = t && r === "critical" && e("text-text-action-critical-disabled"), g = t && ["primary", "secondary"].includes(r) && e("text-text-link-disabled"), w = t && e("pointer-events-none cursor-default"), j = d ? "decoration-current" : "decoration-decoration-underline", Y = p && I;
29
+ ), k = t && i === "critical" && r("text-text-action-critical-disabled"), w = t && ["primary", "secondary"].includes(i) && r("text-text-link-disabled"), g = t && r("pointer-events-none cursor-default"), j = d ? "decoration-current" : "decoration-decoration-underline", Y = p && I;
30
30
  return /* @__PURE__ */ C(
31
31
  y,
32
32
  {
33
- className: e(
33
+ className: r(
34
34
  "inline",
35
35
  t ? "cursor-default" : "cursor-pointer",
36
36
  "underline decoration-[10%] underline-offset-[32%]",
37
37
  !t && "hover:decoration-current",
38
38
  !t && "active:decoration-decoration-underline",
39
- "flex flex-col items-center justify-center",
39
+ "flex flex-col justify-center",
40
+ (!e || e === "center") && "items-center",
41
+ e === "left" && "items-start",
42
+ e === "right" && "items-end",
40
43
  D,
41
44
  v,
42
45
  h,
43
46
  S,
44
47
  k,
45
- g,
46
48
  w,
49
+ g,
47
50
  j,
48
51
  o === "caption" && l.caption,
49
52
  o === "paragraph" && l.paragraph,
50
- i === "left" && "text-left",
51
- i === "center" && "text-center",
52
- i === "right" && "text-right",
53
+ e === "left" && "text-left",
54
+ e === "center" && "text-center",
55
+ e === "right" && "text-right",
53
56
  Y,
54
57
  u && "whitespace-nowrap text-ellipsis overflow-hidden",
55
- s,
58
+ x,
56
59
  m ? "w-full" : "w-fit"
57
60
  ),
58
61
  ...a,
59
62
  style: {
60
63
  ...a.style,
61
- color: c ? `var(--color-${c})` : void 0
64
+ color: n ? `var(--color-${n})` : void 0
62
65
  },
63
66
  "aria-disabled": t,
64
67
  tabIndex: t ? -1 : void 0,
package/dist/components/MobileNavMenu.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MobileNavMenu.d.ts","sourceRoot":"","sources":["../../src/components/MobileNavMenu.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,SAAS,EAKV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAc,eAAe,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAYlF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,WAAW,EAAE,eAAe,CAAC;IAC7B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC9C,gEAAgE;IAChE,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC7B,sDAAsD;IACtD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,qFAAqF;IACrF,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,qBAAqB,CAAC;CAC5C,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EACF,MAAM,EACN,WAAW,EACX,IAAI,EACJ,OAAO,EACP,UAAU,EACV,SAAkB,EAClB,MAAM,EACN,mBAA2B,EAC3B,KAAe,EACf,kBAAkB,GACnB,EAAE,kBAAkB,sCA4MpB"}
1
+ {"version":3,"file":"MobileNavMenu.d.ts","sourceRoot":"","sources":["../../src/components/MobileNavMenu.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,SAAS,EAKV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAc,eAAe,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAYlF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,WAAW,EAAE,eAAe,CAAC;IAC7B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC9C,gEAAgE;IAChE,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC7B,sDAAsD;IACtD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,qFAAqF;IACrF,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,qBAAqB,CAAC;CAC5C,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EACF,MAAM,EACN,WAAW,EACX,IAAI,EACJ,OAAO,EACP,UAAU,EACV,SAAkB,EAClB,MAAM,EACN,mBAA2B,EAC3B,KAAe,EACf,kBAAkB,GACnB,EAAE,kBAAkB,sCA6MpB"}
package/dist/components/MobileNavMenu.js CHANGED
@@ -1,21 +1,22 @@
1
1
  "use client";
2
- import { jsxs as a, Fragment as N, jsx as n } from "react/jsx-runtime";
3
- import { useState as g, useRef as $, useLayoutEffect as I, useEffect as w } from "react";
4
- import { createPortal as j } from "react-dom";
5
- import { NestedMenu as A } from "./NestedMenu.js";
6
- import { MenuOption as D } from "./MenuOption.js";
2
+ import { jsxs as a, Fragment as $, jsx as o } from "react/jsx-runtime";
3
+ import { useState as g, useRef as I, useLayoutEffect as j, useEffect as w } from "react";
4
+ import { createPortal as A } from "react-dom";
5
+ import { NestedMenu as D } from "./NestedMenu.js";
6
+ import { MenuOption as H } from "./MenuOption.js";
7
7
  import { Icon as m } from "./Icon.js";
8
8
  import { Stack as k } from "./Stack.js";
9
- import { Button as H } from "./Button.js";
10
- import { Heading1 as L } from "./Heading.js";
11
- import { Theme as R } from "./Theme.js";
12
- import { useMounted as X } from "../hooks/useMounted.js";
13
- import { useKeydown as Y } from "../hooks/useKeydown.js";
14
- import { findDocumentRoot as K } from "../utils.js";
9
+ import { Button as L } from "./Button.js";
10
+ import { Heading1 as R } from "./Heading.js";
11
+ import { Theme as X } from "./Theme.js";
12
+ import { useMatchesMobile as Y } from "../hooks/useMatchesMedia.js";
13
+ import { useMounted as K } from "../hooks/useMounted.js";
14
+ import { useKeydown as O } from "../hooks/useKeydown.js";
15
+ import { findDocumentRoot as T } from "../utils.js";
15
16
  import { clsx as v } from "../node_modules/clsx/dist/clsx.js";
16
- function te({
17
+ function re({
17
18
  id: c,
18
- testid: o,
19
+ testid: n,
19
20
  currentMenu: i,
20
21
  open: r,
21
22
  onClose: l,
@@ -23,17 +24,17 @@ function te({
23
24
  direction: b = "left",
24
25
  footer: E,
25
26
  hideFooterOnSubMenu: x = !1,
26
- theme: C = "brand",
27
- pinnedSubMenuEntry: M
27
+ theme: M = "brand",
28
+ pinnedSubMenuEntry: C
28
29
  }) {
29
30
  const [s, d] = g(
30
31
  null
31
- ), [y, u] = g(0), z = X(), p = $(null), S = {
32
+ ), [p, u] = g(0), z = K(), S = Y(), y = I(null), N = {
32
33
  transform: r ? "translateX(0)" : b === "right" ? "translateX(100%)" : "translateX(-100%)"
33
34
  };
34
- I(() => {
35
+ j(() => {
35
36
  r && (d(null), u(0));
36
- }, [r]), Y(
37
+ }, [r]), O(
37
38
  {
38
39
  ArrowUp: () => {
39
40
  const e = i.subEntries?.length || 0;
@@ -44,7 +45,7 @@ function te({
44
45
  e !== 0 && u((t) => t >= e - 1 ? 0 : t + 1);
45
46
  },
46
47
  "Enter/Space": () => {
47
- const e = (i.subEntries || [])[y];
48
+ const e = (i.subEntries || [])[p];
48
49
  e && f(
49
50
  e,
50
51
  e.subEntries?.length ? "subEntry" : e.onClick ? "onClick" : void 0
@@ -79,9 +80,9 @@ function te({
79
80
  }
80
81
  e.url && (h?.(e), l());
81
82
  }
82
- return z ? j(
83
- /* @__PURE__ */ a(N, { children: [
84
- /* @__PURE__ */ n(
83
+ return !z || !S ? null : A(
84
+ /* @__PURE__ */ a($, { children: [
85
+ /* @__PURE__ */ o(
85
86
  "div",
86
87
  {
87
88
  className: v(
@@ -97,8 +98,8 @@ function te({
97
98
  "div",
98
99
  {
99
100
  id: c,
100
- "data-testid": o,
101
- ref: p,
101
+ "data-testid": n,
102
+ ref: y,
102
103
  role: "dialog",
103
104
  "aria-modal": "true",
104
105
  className: v(
@@ -107,9 +108,9 @@ function te({
107
108
  "transition-transform duration-300 ease-in-out",
108
109
  b === "right" ? "right-0" : "left-0"
109
110
  ),
110
- style: S,
111
+ style: N,
111
112
  children: [
112
- /* @__PURE__ */ n(R, { theme: C, children: /* @__PURE__ */ a(
113
+ /* @__PURE__ */ o(X, { theme: M, children: /* @__PURE__ */ a(
113
114
  k,
114
115
  {
115
116
  horizontal: !0,
@@ -120,14 +121,14 @@ function te({
120
121
  justify: "between",
121
122
  backgroundColor: "background-primary-normal",
122
123
  children: [
123
- /* @__PURE__ */ n(L, { color: "text-primary-normal", children: s?.label ?? i.label }),
124
- /* @__PURE__ */ n(
125
- H,
124
+ /* @__PURE__ */ o(R, { color: "text-primary-normal", children: s?.label ?? i.label }),
125
+ /* @__PURE__ */ o(
126
+ L,
126
127
  {
127
128
  id: c ? `${c}-close-button` : void 0,
128
- testid: o ? `${o}-close-button` : void 0,
129
+ testid: n ? `${n}-close-button` : void 0,
129
130
  iconOnly: !0,
130
- leftIcon: /* @__PURE__ */ n(m, { className: "icon", name: "close", size: 24 }),
131
+ leftIcon: /* @__PURE__ */ o(m, { className: "icon", name: "close", size: 24 }),
131
132
  variant: "tertiary",
132
133
  onClick: l
133
134
  }
@@ -136,25 +137,25 @@ function te({
136
137
  }
137
138
  ) }),
138
139
  /* @__PURE__ */ a(k, { justify: "between", overflowY: "auto", grow: !0, children: [
139
- /* @__PURE__ */ n("div", { className: "my-4", children: s ? /* @__PURE__ */ n(
140
- A,
140
+ /* @__PURE__ */ o("div", { className: "my-4", children: s ? /* @__PURE__ */ o(
141
+ D,
141
142
  {
142
- testid: o ? `${o}-nested-menu` : void 0,
143
+ testid: n ? `${n}-nested-menu` : void 0,
143
144
  currentMenu: s,
144
145
  onMenuClick: f,
145
- pinnedEntry: M
146
+ pinnedEntry: C
146
147
  }
147
- ) : (i.subEntries ?? []).map((e, t) => /* @__PURE__ */ n(
148
- D,
148
+ ) : (i.subEntries ?? []).map((e, t) => /* @__PURE__ */ o(
149
+ H,
149
150
  {
150
- testid: o ? `${o}-${e.id}` : void 0,
151
- selected: y === t,
151
+ testid: n ? `${n}-${e.id}` : void 0,
152
+ selected: p === t,
152
153
  onClick: () => f(
153
154
  e,
154
155
  e.subEntries?.length ? "subEntry" : e.onClick ? "onClick" : void 0
155
156
  ),
156
- before: e.icon ? /* @__PURE__ */ n(m, { name: e.icon }) : void 0,
157
- after: e.subEntries?.length ? /* @__PURE__ */ n(m, { name: "chevron_right", className: "icon", size: 24 }) : void 0,
157
+ before: e.icon ? /* @__PURE__ */ o(m, { name: e.icon }) : void 0,
158
+ after: e.subEntries?.length ? /* @__PURE__ */ o(m, { name: "chevron_right", className: "icon", size: 24 }) : void 0,
158
159
  children: e.label
159
160
  },
160
161
  e.id
@@ -165,9 +166,9 @@ function te({
165
166
  }
166
167
  )
167
168
  ] }),
168
- K(p.current)
169
- ) : null;
169
+ T(y.current)
170
+ );
170
171
  }
171
172
  export {
172
- te as MobileNavMenu
173
+ re as MobileNavMenu
173
174
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dmsi/wedgekit-react",
3
- "version": "2.1.0",
3
+ "version": "2.1.1",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",