@cypress-design/react-docmenu 0.3.0 → 0.3.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.
@@ -2,5 +2,5 @@ $ yarn build:module && yarn build:types
2
2
  $ rollup -c ./rollup.config.mjs
3
3
  
4
4
  ./index.ts → ./dist/index.umd.js, ./dist/index.es.mjs...
5
- created ./dist/index.umd.js, ./dist/index.es.mjs in 22.3s
5
+ created ./dist/index.umd.js, ./dist/index.es.mjs in 33.9s
6
6
  $ tsc --project ./tsconfig.build.json
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @cypress-design/react-docmenu
2
2
 
3
+ ## 0.3.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#310](https://github.com/cypress-io/cypress-design/pull/310) [`a3a323f`](https://github.com/cypress-io/cypress-design/commit/a3a323fde7acf5e5407b298b4faa0c90314c6139) Thanks [@elevatebart](https://github.com/elevatebart)! - Add-eslint-react-hooks
8
+
9
+ - Updated dependencies [[`630ad4a`](https://github.com/cypress-io/cypress-design/commit/630ad4ae2e6ba65350951949767a4ebdc4c7eb0a), [`a3a323f`](https://github.com/cypress-io/cypress-design/commit/a3a323fde7acf5e5407b298b4faa0c90314c6139)]:
10
+ - @cypress-design/react-icon@0.24.0
11
+
3
12
  ## 0.3.0
4
13
 
5
14
  ### Minor Changes
package/_DocGroup.tsx CHANGED
@@ -19,25 +19,25 @@ export const DocGroup: React.FC<DocGroupProps> = ({
19
19
  }) => {
20
20
  const [open, setOpen] = React.useState(depth === 0)
21
21
  const [itemsHeights, setItemsHeights] = React.useState<number[]>(
22
- Array(group.items.length).fill(1)
22
+ Array(group.items.length).fill(1),
23
23
  )
24
24
 
25
25
  React.useEffect(() => {
26
26
  setHeight?.(open ? itemsHeights.reduce((a, b) => a + b, 1) : 1)
27
- }, [itemsHeights, open])
27
+ }, [itemsHeights, open, setHeight])
28
28
 
29
29
  const [activeTop, setActiveTop] = React.useState(0)
30
30
 
31
31
  React.useEffect(() => {
32
32
  const activeItem = group.items.findIndex(
33
- (item) => 'href' in item && item.active
33
+ (item) => 'href' in item && item.active,
34
34
  )
35
35
  if (activeItem >= 0) {
36
36
  setActiveTop(
37
- itemsHeights.slice(0, activeItem).reduce((a, b) => a + b, 1) * 44
37
+ itemsHeights.slice(0, activeItem).reduce((a, b) => a + b, 1) * 44,
38
38
  )
39
39
  }
40
- }, [itemsHeights])
40
+ }, [itemsHeights, group.items])
41
41
 
42
42
  function toggleMenu(open: boolean) {
43
43
  if (!collapsible) return
@@ -114,7 +114,7 @@ export const DocGroup: React.FC<DocGroupProps> = ({
114
114
  depth={depth}
115
115
  onActive={(top) => setActiveTop(top)}
116
116
  />
117
- )
117
+ ),
118
118
  )}
119
119
  </ul>
120
120
  </>
package/_DocLink.tsx CHANGED
@@ -23,6 +23,8 @@ export const DocLink: React.FC<DocLinkProps> = ({
23
23
  if (item.active) {
24
24
  onActive?.(activeLIRef?.current?.offsetTop || 0)
25
25
  }
26
+ // supposed to happen only on mount
27
+ // eslint-disable-next-line react-hooks/exhaustive-deps
26
28
  }, [])
27
29
 
28
30
  return (
@@ -46,7 +48,7 @@ export const DocLink: React.FC<DocLinkProps> = ({
46
48
  'absolute w-[4px] z-10 top-[10%] h-[80%] rounded-full hidden',
47
49
  {
48
50
  'group-hover:block bg-gray-300': !item.active && collapsible,
49
- }
51
+ },
50
52
  )}
51
53
  style={{
52
54
  left: `-${18.5 + depth * 8}px`,
@@ -1 +1 @@
1
- {"version":3,"file":"_DocLink.d.ts","sourceRoot":"./","sources":["_DocLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAA;AAE/D,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,WAAW,CAAA;IACjB,WAAW,EAAE,OAAO,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAgD1C,CAAA"}
1
+ {"version":3,"file":"_DocLink.d.ts","sourceRoot":"./","sources":["_DocLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAA;AAE/D,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,WAAW,CAAA;IACjB,WAAW,EAAE,OAAO,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAkD1C,CAAA"}
package/dist/index.es.mjs CHANGED
@@ -17,7 +17,7 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
17
17
  OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
18
18
  PERFORMANCE OF THIS SOFTWARE.
19
19
  ***************************************************************************** */
20
- /* global Reflect, Promise */
20
+ /* global Reflect, Promise, SuppressedError, Symbol */
21
21
 
22
22
 
23
23
  var __assign$1 = function() {
@@ -51,7 +51,12 @@ function __spreadArray(to, from, pack) {
51
51
  }
52
52
  }
53
53
  return to.concat(ar || Array.prototype.slice.call(from));
54
- }
54
+ }
55
+
56
+ typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
57
+ var e = new Error(message);
58
+ return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
59
+ };
55
60
 
56
61
  var DocLink = function (_a) {
57
62
  var item = _a.item, collapsible = _a.collapsible, _b = _a.depth, depth = _b === void 0 ? -1 : _b, onActive = _a.onActive;
@@ -63,6 +68,8 @@ var DocLink = function (_a) {
63
68
  if (item.active) {
64
69
  onActive === null || onActive === void 0 ? void 0 : onActive(((_a = activeLIRef === null || activeLIRef === void 0 ? void 0 : activeLIRef.current) === null || _a === void 0 ? void 0 : _a.offsetTop) || 0);
65
70
  }
71
+ // supposed to happen only on mount
72
+ // eslint-disable-next-line react-hooks/exhaustive-deps
66
73
  }, []);
67
74
  return (React.createElement("li", { ref: activeLIRef, className: clsx('list-none p-0', {
68
75
  'pl-[16px]': depth >= 0,
@@ -94,7 +101,7 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
94
101
  OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
95
102
  PERFORMANCE OF THIS SOFTWARE.
96
103
  ***************************************************************************** */
97
- /* global Reflect, Promise */
104
+ /* global Reflect, Promise, SuppressedError, Symbol */
98
105
 
99
106
 
100
107
  var __assign = function() {
@@ -118,7 +125,12 @@ function __rest(s, e) {
118
125
  t[p[i]] = s[p[i]];
119
126
  }
120
127
  return t;
121
- }
128
+ }
129
+
130
+ typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
131
+ var e = new Error(message);
132
+ return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
133
+ };
122
134
 
123
135
  var compileReactIconProperties = function (_a) {
124
136
  var body = _a.body, defs = _a.defs, compiledClasses = _a.compiledClasses, size = _a.size, name = _a.name, attributes = __rest(_a, ["body", "defs", "compiledClasses", "size", "name"]);
@@ -132,6 +144,7 @@ var compileReactIconProperties = function (_a) {
132
144
  }
133
145
  return newAttributes;
134
146
  }, {});
147
+ // eslint-disable-next-line react-hooks/rules-of-hooks
135
148
  React.useEffect(function () {
136
149
  var iconFileId = "".concat(name, "_").concat(size);
137
150
  if (defs) {
@@ -145,7 +158,7 @@ var compileReactIconProperties = function (_a) {
145
158
  svgElement.innerHTML = defs;
146
159
  document.body.appendChild(svgElement);
147
160
  }
148
- }, [defs]);
161
+ }, [defs, name, size]);
149
162
  var componentProps = __assign({ width: size, height: size, viewBox: "0 0 ".concat(size, " ").concat(size), fill: 'none', dangerouslySetInnerHTML: {
150
163
  __html: body,
151
164
  }, className: undefined }, filteredAttributes);
@@ -192,14 +205,14 @@ var DocGroup = function (_a) {
192
205
  var _e = React.useState(Array(group.items.length).fill(1)), itemsHeights = _e[0], setItemsHeights = _e[1];
193
206
  React.useEffect(function () {
194
207
  setHeight === null || setHeight === void 0 ? void 0 : setHeight(open ? itemsHeights.reduce(function (a, b) { return a + b; }, 1) : 1);
195
- }, [itemsHeights, open]);
208
+ }, [itemsHeights, open, setHeight]);
196
209
  var _f = React.useState(0), activeTop = _f[0], setActiveTop = _f[1];
197
210
  React.useEffect(function () {
198
211
  var activeItem = group.items.findIndex(function (item) { return 'href' in item && item.active; });
199
212
  if (activeItem >= 0) {
200
213
  setActiveTop(itemsHeights.slice(0, activeItem).reduce(function (a, b) { return a + b; }, 1) * 44);
201
214
  }
202
- }, [itemsHeights]);
215
+ }, [itemsHeights, group.items]);
203
216
  function toggleMenu(open) {
204
217
  if (!collapsible)
205
218
  return;