@xyo-network/react-address-render 2.64.0-rc.7 → 2.64.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 (172) hide show
  1. package/dist/browser/components/RenderRowBox.cjs +239 -0
  2. package/dist/browser/components/RenderRowBox.cjs.map +1 -0
  3. package/dist/browser/components/RenderRowBox.d.cts +14 -0
  4. package/dist/browser/components/RenderRowBox.d.cts.map +1 -0
  5. package/dist/browser/components/RenderRowBox.js +180 -11
  6. package/dist/browser/components/RenderRowBox.js.map +1 -1
  7. package/dist/browser/components/favorite/FavoriteIconButton.cjs +191 -0
  8. package/dist/browser/components/favorite/FavoriteIconButton.cjs.map +1 -0
  9. package/dist/browser/components/favorite/FavoriteIconButton.d.cts +12 -0
  10. package/dist/browser/components/favorite/FavoriteIconButton.d.cts.map +1 -0
  11. package/dist/browser/components/favorite/FavoriteIconButton.js +115 -15
  12. package/dist/browser/components/favorite/FavoriteIconButton.js.map +1 -1
  13. package/dist/browser/components/favorite/FavoriteToggleSVG.cjs +29 -0
  14. package/dist/{node/components/favorite/FavoriteToggleSVG.mjs.map → browser/components/favorite/FavoriteToggleSVG.cjs.map} +1 -1
  15. package/dist/browser/components/favorite/FavoriteToggleSVG.d.cts +5 -0
  16. package/dist/browser/components/favorite/FavoriteToggleSVG.d.cts.map +1 -0
  17. package/dist/browser/components/favorite/FavoriteToggleSVG.js +3 -2
  18. package/dist/browser/components/favorite/FavoriteToggleSVG.js.map +1 -1
  19. package/dist/browser/components/favorite/Popper.cjs +112 -0
  20. package/dist/browser/components/favorite/Popper.cjs.map +1 -0
  21. package/dist/browser/components/favorite/Popper.d.cts +11 -0
  22. package/dist/browser/components/favorite/Popper.d.cts.map +1 -0
  23. package/dist/browser/components/favorite/Popper.js +46 -9
  24. package/dist/browser/components/favorite/Popper.js.map +1 -1
  25. package/dist/browser/components/favorite/PopperButtonGroup.cjs +57 -0
  26. package/dist/browser/components/favorite/PopperButtonGroup.cjs.map +1 -0
  27. package/dist/browser/components/favorite/PopperButtonGroup.d.cts +9 -0
  28. package/dist/browser/components/favorite/PopperButtonGroup.d.cts.map +1 -0
  29. package/dist/browser/components/favorite/PopperButtonGroup.js +3 -2
  30. package/dist/browser/components/favorite/PopperButtonGroup.js.map +1 -1
  31. package/dist/browser/components/favorite/index.cjs +193 -0
  32. package/dist/browser/components/favorite/index.cjs.map +1 -0
  33. package/dist/browser/components/favorite/index.d.cts +2 -0
  34. package/dist/browser/components/favorite/index.d.cts.map +1 -0
  35. package/dist/browser/components/favorite/index.js +169 -1
  36. package/dist/browser/components/favorite/index.js.map +1 -1
  37. package/dist/browser/components/favorite/lib/PopperId.cjs +27 -0
  38. package/dist/{node/components/favorite/lib/PopperId.mjs.map → browser/components/favorite/lib/PopperId.cjs.map} +1 -1
  39. package/dist/browser/components/favorite/lib/PopperId.d.cts +2 -0
  40. package/dist/browser/components/favorite/lib/PopperId.d.cts.map +1 -0
  41. package/dist/browser/components/favorite/lib/PopperId.js +2 -1
  42. package/dist/browser/components/favorite/lib/PopperId.js.map +1 -1
  43. package/dist/browser/components/favorite/lib/index.cjs +29 -0
  44. package/dist/browser/components/favorite/lib/index.cjs.map +1 -0
  45. package/dist/browser/components/favorite/lib/index.d.cts +2 -0
  46. package/dist/browser/components/favorite/lib/index.d.cts.map +1 -0
  47. package/dist/browser/components/favorite/lib/index.js +5 -1
  48. package/dist/browser/components/favorite/lib/index.js.map +1 -1
  49. package/dist/browser/components/index.cjs +241 -0
  50. package/dist/browser/components/index.cjs.map +1 -0
  51. package/dist/browser/components/index.d.cts +4 -0
  52. package/dist/browser/components/index.d.cts.map +1 -0
  53. package/dist/browser/components/index.js +217 -3
  54. package/dist/browser/components/index.js.map +1 -1
  55. package/dist/browser/components/lib/FavoriteItemEvent.cjs +32 -0
  56. package/dist/{node/components/lib/FavoriteItemEvent.mjs.map → browser/components/lib/FavoriteItemEvent.cjs.map} +1 -1
  57. package/dist/browser/components/lib/FavoriteItemEvent.d.cts +9 -0
  58. package/dist/browser/components/lib/FavoriteItemEvent.d.cts.map +1 -0
  59. package/dist/browser/components/lib/FavoriteItemEvent.js +2 -1
  60. package/dist/browser/components/lib/FavoriteItemEvent.js.map +1 -1
  61. package/dist/browser/components/lib/index.cjs +34 -0
  62. package/dist/browser/components/lib/index.cjs.map +1 -0
  63. package/dist/browser/components/lib/index.d.cts +2 -0
  64. package/dist/browser/components/lib/index.d.cts.map +1 -0
  65. package/dist/browser/components/lib/index.js +10 -1
  66. package/dist/browser/components/lib/index.js.map +1 -1
  67. package/dist/browser/index.cjs +241 -0
  68. package/dist/browser/index.cjs.map +1 -0
  69. package/dist/browser/index.d.cts +2 -0
  70. package/dist/browser/index.d.cts.map +1 -0
  71. package/dist/browser/index.js +217 -1
  72. package/dist/browser/index.js.map +1 -1
  73. package/dist/docs.json +24106 -0
  74. package/dist/node/components/RenderRowBox.cjs +243 -0
  75. package/dist/node/components/RenderRowBox.cjs.map +1 -0
  76. package/dist/node/components/RenderRowBox.d.cts +14 -0
  77. package/dist/node/components/RenderRowBox.d.cts.map +1 -0
  78. package/dist/node/components/RenderRowBox.js +187 -42
  79. package/dist/node/components/RenderRowBox.js.map +1 -1
  80. package/dist/node/components/favorite/FavoriteIconButton.cjs +195 -0
  81. package/dist/node/components/favorite/FavoriteIconButton.cjs.map +1 -0
  82. package/dist/node/components/favorite/FavoriteIconButton.d.cts +12 -0
  83. package/dist/node/components/favorite/FavoriteIconButton.d.cts.map +1 -0
  84. package/dist/node/components/favorite/FavoriteIconButton.js +123 -47
  85. package/dist/node/components/favorite/FavoriteIconButton.js.map +1 -1
  86. package/dist/node/components/favorite/FavoriteToggleSVG.cjs +33 -0
  87. package/dist/node/components/favorite/FavoriteToggleSVG.cjs.map +1 -0
  88. package/dist/node/components/favorite/FavoriteToggleSVG.d.cts +5 -0
  89. package/dist/node/components/favorite/FavoriteToggleSVG.d.cts.map +1 -0
  90. package/dist/node/components/favorite/FavoriteToggleSVG.js +6 -29
  91. package/dist/node/components/favorite/FavoriteToggleSVG.js.map +1 -1
  92. package/dist/node/components/favorite/Popper.cjs +116 -0
  93. package/dist/node/components/favorite/Popper.cjs.map +1 -0
  94. package/dist/node/components/favorite/Popper.d.cts +11 -0
  95. package/dist/node/components/favorite/Popper.d.cts.map +1 -0
  96. package/dist/node/components/favorite/Popper.js +54 -41
  97. package/dist/node/components/favorite/Popper.js.map +1 -1
  98. package/dist/node/components/favorite/PopperButtonGroup.cjs +61 -0
  99. package/dist/node/components/favorite/{PopperButtonGroup.mjs.map → PopperButtonGroup.cjs.map} +1 -1
  100. package/dist/node/components/favorite/PopperButtonGroup.d.cts +9 -0
  101. package/dist/node/components/favorite/PopperButtonGroup.d.cts.map +1 -0
  102. package/dist/node/components/favorite/PopperButtonGroup.js +16 -39
  103. package/dist/node/components/favorite/PopperButtonGroup.js.map +1 -1
  104. package/dist/node/components/favorite/index.cjs +197 -0
  105. package/dist/node/components/favorite/index.cjs.map +1 -0
  106. package/dist/node/components/favorite/index.d.cts +2 -0
  107. package/dist/node/components/favorite/index.d.cts.map +1 -0
  108. package/dist/node/components/favorite/index.js +167 -20
  109. package/dist/node/components/favorite/index.js.map +1 -1
  110. package/dist/node/components/favorite/lib/PopperId.cjs +31 -0
  111. package/dist/node/components/favorite/lib/PopperId.cjs.map +1 -0
  112. package/dist/node/components/favorite/lib/PopperId.d.cts +2 -0
  113. package/dist/node/components/favorite/lib/PopperId.d.cts.map +1 -0
  114. package/dist/node/components/favorite/lib/PopperId.js +4 -27
  115. package/dist/node/components/favorite/lib/PopperId.js.map +1 -1
  116. package/dist/node/components/favorite/lib/index.cjs +33 -0
  117. package/dist/node/components/favorite/lib/index.cjs.map +1 -0
  118. package/dist/node/components/favorite/lib/index.d.cts +2 -0
  119. package/dist/node/components/favorite/lib/index.d.cts.map +1 -0
  120. package/dist/node/components/favorite/lib/index.js +4 -21
  121. package/dist/node/components/favorite/lib/index.js.map +1 -1
  122. package/dist/node/components/index.cjs +247 -0
  123. package/dist/node/components/index.cjs.map +1 -0
  124. package/dist/node/components/index.d.cts +4 -0
  125. package/dist/node/components/index.d.cts.map +1 -0
  126. package/dist/node/components/index.js +215 -24
  127. package/dist/node/components/index.js.map +1 -1
  128. package/dist/node/components/lib/FavoriteItemEvent.cjs +36 -0
  129. package/dist/node/components/lib/FavoriteItemEvent.cjs.map +1 -0
  130. package/dist/node/components/lib/FavoriteItemEvent.d.cts +9 -0
  131. package/dist/node/components/lib/FavoriteItemEvent.d.cts.map +1 -0
  132. package/dist/node/components/lib/FavoriteItemEvent.js +4 -27
  133. package/dist/node/components/lib/FavoriteItemEvent.js.map +1 -1
  134. package/dist/node/components/lib/index.cjs +38 -0
  135. package/dist/node/components/lib/index.cjs.map +1 -0
  136. package/dist/node/components/lib/index.d.cts +2 -0
  137. package/dist/node/components/lib/index.d.cts.map +1 -0
  138. package/dist/node/components/lib/index.js +9 -21
  139. package/dist/node/components/lib/index.js.map +1 -1
  140. package/dist/node/index.cjs +247 -0
  141. package/dist/node/index.cjs.map +1 -0
  142. package/dist/node/index.d.cts +2 -0
  143. package/dist/node/index.d.cts.map +1 -0
  144. package/dist/node/index.js +215 -20
  145. package/dist/node/index.js.map +1 -1
  146. package/package.json +20 -20
  147. package/dist/browser/components/RenderRowBox.stories.js +0 -81
  148. package/dist/browser/components/RenderRowBox.stories.js.map +0 -1
  149. package/dist/node/components/RenderRowBox.mjs +0 -49
  150. package/dist/node/components/RenderRowBox.mjs.map +0 -1
  151. package/dist/node/components/RenderRowBox.stories.js +0 -111
  152. package/dist/node/components/RenderRowBox.stories.js.map +0 -1
  153. package/dist/node/components/RenderRowBox.stories.mjs +0 -81
  154. package/dist/node/components/RenderRowBox.stories.mjs.map +0 -1
  155. package/dist/node/components/favorite/FavoriteIconButton.mjs +0 -70
  156. package/dist/node/components/favorite/FavoriteIconButton.mjs.map +0 -1
  157. package/dist/node/components/favorite/FavoriteToggleSVG.mjs +0 -7
  158. package/dist/node/components/favorite/Popper.mjs +0 -54
  159. package/dist/node/components/favorite/Popper.mjs.map +0 -1
  160. package/dist/node/components/favorite/PopperButtonGroup.mjs +0 -35
  161. package/dist/node/components/favorite/index.mjs +0 -2
  162. package/dist/node/components/favorite/index.mjs.map +0 -1
  163. package/dist/node/components/favorite/lib/PopperId.mjs +0 -5
  164. package/dist/node/components/favorite/lib/index.mjs +0 -2
  165. package/dist/node/components/favorite/lib/index.mjs.map +0 -1
  166. package/dist/node/components/index.mjs +0 -4
  167. package/dist/node/components/index.mjs.map +0 -1
  168. package/dist/node/components/lib/FavoriteItemEvent.mjs +0 -10
  169. package/dist/node/components/lib/index.mjs +0 -2
  170. package/dist/node/components/lib/index.mjs.map +0 -1
  171. package/dist/node/index.mjs +0 -2
  172. package/dist/node/index.mjs.map +0 -1
@@ -1,9 +1,46 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
1
+ // src/components/favorite/Popper.tsx
2
2
  import { Card, CardContent, ClickAwayListener, Fade, Popper, styled, TextField } from "@mui/material";
3
3
  import { forwardRef, useEffect, useState } from "react";
4
- import { popperId } from "./lib";
5
- import { PopperButtonGroup } from "./PopperButtonGroup";
6
- const FavoritePopper = forwardRef(
4
+
5
+ // src/components/favorite/lib/PopperId.ts
6
+ var popperId = "favorite-popper";
7
+
8
+ // src/components/favorite/PopperButtonGroup.tsx
9
+ import { Delete as DeleteIcon, Star as StarIcon } from "@mui/icons-material";
10
+ import { Button, ButtonGroup } from "@mui/material";
11
+ import { jsx, jsxs } from "react/jsx-runtime";
12
+ var PopperButtonGroup = ({ name, onConfirmFavorite, favorite, ...props }) => {
13
+ return /* @__PURE__ */ jsxs(ButtonGroup, { ...props, children: [
14
+ /* @__PURE__ */ jsx(
15
+ Button,
16
+ {
17
+ title: "Save Favorite",
18
+ variant: "contained",
19
+ onClick: (e) => {
20
+ e.stopPropagation();
21
+ onConfirmFavorite?.(name, true);
22
+ },
23
+ children: /* @__PURE__ */ jsx(StarIcon, {})
24
+ }
25
+ ),
26
+ favorite ? /* @__PURE__ */ jsx(
27
+ Button,
28
+ {
29
+ title: "Remove Favorite",
30
+ variant: "contained",
31
+ onClick: (e) => {
32
+ e.stopPropagation();
33
+ onConfirmFavorite?.(name, false);
34
+ },
35
+ children: /* @__PURE__ */ jsx(DeleteIcon, {})
36
+ }
37
+ ) : null
38
+ ] });
39
+ };
40
+
41
+ // src/components/favorite/Popper.tsx
42
+ import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
43
+ var FavoritePopper = forwardRef(
7
44
  ({
8
45
  name: nameProp,
9
46
  favorite,
@@ -18,7 +55,7 @@ const FavoritePopper = forwardRef(
18
55
  useEffect(() => {
19
56
  setName(nameProp);
20
57
  }, [nameProp]);
21
- return /* @__PURE__ */ jsx(ClickAwayListener, { onClickAway, children: /* @__PURE__ */ jsx(
58
+ return /* @__PURE__ */ jsx2(ClickAwayListener, { onClickAway, children: /* @__PURE__ */ jsx2(
22
59
  PopperStyled,
23
60
  {
24
61
  id: popperId,
@@ -28,8 +65,8 @@ const FavoritePopper = forwardRef(
28
65
  transition: true,
29
66
  ref,
30
67
  ...props,
31
- children: ({ TransitionProps }) => /* @__PURE__ */ jsx(Fade, { ...TransitionProps, timeout: 350, children: /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(CardContent, { sx: { display: "flex", gap: 1 }, children: [
32
- /* @__PURE__ */ jsx(
68
+ children: ({ TransitionProps }) => /* @__PURE__ */ jsx2(Fade, { ...TransitionProps, timeout: 350, children: /* @__PURE__ */ jsx2(Card, { children: /* @__PURE__ */ jsxs2(CardContent, { sx: { display: "flex", gap: 1 }, children: [
69
+ /* @__PURE__ */ jsx2(
33
70
  TextField,
34
71
  {
35
72
  autoFocus: true,
@@ -40,14 +77,14 @@ const FavoritePopper = forwardRef(
40
77
  onChange: (e) => setName(e.target.value)
41
78
  }
42
79
  ),
43
- /* @__PURE__ */ jsx(PopperButtonGroup, { favorite, onConfirmFavorite, name })
80
+ /* @__PURE__ */ jsx2(PopperButtonGroup, { favorite, onConfirmFavorite, name })
44
81
  ] }) }) })
45
82
  }
46
83
  ) });
47
84
  }
48
85
  );
49
86
  FavoritePopper.displayName = "FavoritePopper";
50
- const PopperStyled = styled(Popper, { name: "PopperStyled" })(() => ({ zIndex: 9999 }));
87
+ var PopperStyled = styled(Popper, { name: "PopperStyled" })(() => ({ zIndex: 9999 }));
51
88
  export {
52
89
  FavoritePopper
53
90
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/favorite/Popper.tsx"],"sourcesContent":["import { Card, CardContent, ClickAwayListener, Fade, Popper, PopperProps, styled, TextField } from '@mui/material'\nimport { forwardRef, RefObject, useEffect, useState } from 'react'\n\nimport { popperId } from './lib'\nimport { PopperButtonGroup } from './PopperButtonGroup'\n\nexport interface FavoritePopperProps extends PopperProps {\n favorite?: boolean\n favoriteRef?: RefObject<HTMLElement>\n name?: string\n onClickAway?: (event: MouseEvent | TouchEvent) => void\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\nexport const FavoritePopper = forwardRef<HTMLDivElement, FavoritePopperProps>(\n (\n {\n name: nameProp,\n favorite,\n favoriteRef,\n onClickAway = () => {\n return\n },\n onConfirmFavorite,\n ...props\n },\n ref,\n ) => {\n const [name, setName] = useState(nameProp)\n useEffect(() => {\n setName(nameProp)\n }, [nameProp])\n\n return (\n <ClickAwayListener onClickAway={onClickAway}>\n <PopperStyled\n id={popperId}\n anchorEl={favoriteRef?.current}\n onClick={(e) => e.stopPropagation()}\n onTouchStart={(e) => e.stopPropagation()}\n transition\n ref={ref}\n {...props}\n >\n {({ TransitionProps }) => (\n <Fade {...TransitionProps} timeout={350}>\n <Card>\n <CardContent sx={{ display: 'flex', gap: 1 }}>\n <TextField\n autoFocus\n label=\"Favorite Name\"\n placeholder=\"optional\"\n size=\"small\"\n value={name ?? ''}\n onChange={(e) => setName(e.target.value)}\n />\n <PopperButtonGroup favorite={favorite} onConfirmFavorite={onConfirmFavorite} name={name} />\n </CardContent>\n </Card>\n </Fade>\n )}\n </PopperStyled>\n </ClickAwayListener>\n )\n },\n)\n\nFavoritePopper.displayName = 'FavoritePopper'\n\n// Ensure the popper is over all other mui portal elements\nconst PopperStyled = styled(Popper, { name: 'PopperStyled' })(() => ({ zIndex: 9999 }))\n"],"mappings":"AA8CgB,SACE,KADF;AA9ChB,SAAS,MAAM,aAAa,mBAAmB,MAAM,QAAqB,QAAQ,iBAAiB;AACnG,SAAS,YAAuB,WAAW,gBAAgB;AAE3D,SAAS,gBAAgB;AACzB,SAAS,yBAAyB;AAS3B,MAAM,iBAAiB;AAAA,EAC5B,CACE;AAAA,IACE,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA,cAAc,MAAM;AAClB;AAAA,IACF;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,CAAC,MAAM,OAAO,IAAI,SAAS,QAAQ;AACzC,cAAU,MAAM;AACd,cAAQ,QAAQ;AAAA,IAClB,GAAG,CAAC,QAAQ,CAAC;AAEb,WACE,oBAAC,qBAAkB,aACjB;AAAA,MAAC;AAAA;AAAA,QACC,IAAI;AAAA,QACJ,UAAU,aAAa;AAAA,QACvB,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,QAClC,cAAc,CAAC,MAAM,EAAE,gBAAgB;AAAA,QACvC,YAAU;AAAA,QACV;AAAA,QACC,GAAG;AAAA,QAEH,WAAC,EAAE,gBAAgB,MAClB,oBAAC,QAAM,GAAG,iBAAiB,SAAS,KAClC,8BAAC,QACC,+BAAC,eAAY,IAAI,EAAE,SAAS,QAAQ,KAAK,EAAE,GACzC;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAS;AAAA,cACT,OAAM;AAAA,cACN,aAAY;AAAA,cACZ,MAAK;AAAA,cACL,OAAO,QAAQ;AAAA,cACf,UAAU,CAAC,MAAM,QAAQ,EAAE,OAAO,KAAK;AAAA;AAAA,UACzC;AAAA,UACA,oBAAC,qBAAkB,UAAoB,mBAAsC,MAAY;AAAA,WAC3F,GACF,GACF;AAAA;AAAA,IAEJ,GACF;AAAA,EAEJ;AACF;AAEA,eAAe,cAAc;AAG7B,MAAM,eAAe,OAAO,QAAQ,EAAE,MAAM,eAAe,CAAC,EAAE,OAAO,EAAE,QAAQ,KAAK,EAAE;","names":[]}
1
+ {"version":3,"sources":["../../../../src/components/favorite/Popper.tsx","../../../../src/components/favorite/lib/PopperId.ts","../../../../src/components/favorite/PopperButtonGroup.tsx"],"sourcesContent":["import { Card, CardContent, ClickAwayListener, Fade, Popper, PopperProps, styled, TextField } from '@mui/material'\nimport { forwardRef, RefObject, useEffect, useState } from 'react'\n\nimport { popperId } from './lib'\nimport { PopperButtonGroup } from './PopperButtonGroup'\n\nexport interface FavoritePopperProps extends PopperProps {\n favorite?: boolean\n favoriteRef?: RefObject<HTMLElement>\n name?: string\n onClickAway?: (event: MouseEvent | TouchEvent) => void\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\nexport const FavoritePopper = forwardRef<HTMLDivElement, FavoritePopperProps>(\n (\n {\n name: nameProp,\n favorite,\n favoriteRef,\n onClickAway = () => {\n return\n },\n onConfirmFavorite,\n ...props\n },\n ref,\n ) => {\n const [name, setName] = useState(nameProp)\n useEffect(() => {\n setName(nameProp)\n }, [nameProp])\n\n return (\n <ClickAwayListener onClickAway={onClickAway}>\n <PopperStyled\n id={popperId}\n anchorEl={favoriteRef?.current}\n onClick={(e) => e.stopPropagation()}\n onTouchStart={(e) => e.stopPropagation()}\n transition\n ref={ref}\n {...props}\n >\n {({ TransitionProps }) => (\n <Fade {...TransitionProps} timeout={350}>\n <Card>\n <CardContent sx={{ display: 'flex', gap: 1 }}>\n <TextField\n autoFocus\n label=\"Favorite Name\"\n placeholder=\"optional\"\n size=\"small\"\n value={name ?? ''}\n onChange={(e) => setName(e.target.value)}\n />\n <PopperButtonGroup favorite={favorite} onConfirmFavorite={onConfirmFavorite} name={name} />\n </CardContent>\n </Card>\n </Fade>\n )}\n </PopperStyled>\n </ClickAwayListener>\n )\n },\n)\n\nFavoritePopper.displayName = 'FavoritePopper'\n\n// Ensure the popper is over all other mui portal elements\nconst PopperStyled = styled(Popper, { name: 'PopperStyled' })(() => ({ zIndex: 9999 }))\n","export const popperId = 'favorite-popper'\n","import { Delete as DeleteIcon, Star as StarIcon } from '@mui/icons-material'\nimport { Button, ButtonGroup, ButtonGroupProps } from '@mui/material'\n\nexport interface FavoritePopperProps extends ButtonGroupProps {\n favorite?: boolean\n name?: string\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\n\nexport const PopperButtonGroup: React.FC<FavoritePopperProps> = ({ name, onConfirmFavorite, favorite, ...props }) => {\n return (\n <ButtonGroup {...props}>\n <Button\n title=\"Save Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, true)\n }}\n >\n <StarIcon />\n </Button>\n {favorite ? (\n <Button\n title=\"Remove Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, false)\n }}\n >\n <DeleteIcon />\n </Button>\n ) : null}\n </ButtonGroup>\n )\n}\n"],"mappings":";AAAA,SAAS,MAAM,aAAa,mBAAmB,MAAM,QAAqB,QAAQ,iBAAiB;AACnG,SAAS,YAAuB,WAAW,gBAAgB;;;ACDpD,IAAM,WAAW;;;ACAxB,SAAS,UAAU,YAAY,QAAQ,gBAAgB;AACvD,SAAS,QAAQ,mBAAqC;AAUlD,SASI,KATJ;AAFG,IAAM,oBAAmD,CAAC,EAAE,MAAM,mBAAmB,UAAU,GAAG,MAAM,MAAM;AACnH,SACE,qBAAC,eAAa,GAAG,OACf;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AAClB,8BAAoB,MAAM,IAAI;AAAA,QAChC;AAAA,QAEA,8BAAC,YAAS;AAAA;AAAA,IACZ;AAAA,IACC,WACC;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AAClB,8BAAoB,MAAM,KAAK;AAAA,QACjC;AAAA,QAEA,8BAAC,cAAW;AAAA;AAAA,IACd,IACE;AAAA,KACN;AAEJ;;;AFUgB,SACE,OAAAA,MADF,QAAAC,aAAA;AAjCT,IAAM,iBAAiB;AAAA,EAC5B,CACE;AAAA,IACE,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA,cAAc,MAAM;AAClB;AAAA,IACF;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,CAAC,MAAM,OAAO,IAAI,SAAS,QAAQ;AACzC,cAAU,MAAM;AACd,cAAQ,QAAQ;AAAA,IAClB,GAAG,CAAC,QAAQ,CAAC;AAEb,WACE,gBAAAD,KAAC,qBAAkB,aACjB,0BAAAA;AAAA,MAAC;AAAA;AAAA,QACC,IAAI;AAAA,QACJ,UAAU,aAAa;AAAA,QACvB,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,QAClC,cAAc,CAAC,MAAM,EAAE,gBAAgB;AAAA,QACvC,YAAU;AAAA,QACV;AAAA,QACC,GAAG;AAAA,QAEH,WAAC,EAAE,gBAAgB,MAClB,gBAAAA,KAAC,QAAM,GAAG,iBAAiB,SAAS,KAClC,0BAAAA,KAAC,QACC,0BAAAC,MAAC,eAAY,IAAI,EAAE,SAAS,QAAQ,KAAK,EAAE,GACzC;AAAA,0BAAAD;AAAA,YAAC;AAAA;AAAA,cACC,WAAS;AAAA,cACT,OAAM;AAAA,cACN,aAAY;AAAA,cACZ,MAAK;AAAA,cACL,OAAO,QAAQ;AAAA,cACf,UAAU,CAAC,MAAM,QAAQ,EAAE,OAAO,KAAK;AAAA;AAAA,UACzC;AAAA,UACA,gBAAAA,KAAC,qBAAkB,UAAoB,mBAAsC,MAAY;AAAA,WAC3F,GACF,GACF;AAAA;AAAA,IAEJ,GACF;AAAA,EAEJ;AACF;AAEA,eAAe,cAAc;AAG7B,IAAM,eAAe,OAAO,QAAQ,EAAE,MAAM,eAAe,CAAC,EAAE,OAAO,EAAE,QAAQ,KAAK,EAAE;","names":["jsx","jsxs"]}
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+
20
+ // src/components/favorite/PopperButtonGroup.tsx
21
+ var PopperButtonGroup_exports = {};
22
+ __export(PopperButtonGroup_exports, {
23
+ PopperButtonGroup: () => PopperButtonGroup
24
+ });
25
+ module.exports = __toCommonJS(PopperButtonGroup_exports);
26
+ var import_icons_material = require("@mui/icons-material");
27
+ var import_material = require("@mui/material");
28
+ var import_jsx_runtime = require("react/jsx-runtime");
29
+ var PopperButtonGroup = ({ name, onConfirmFavorite, favorite, ...props }) => {
30
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material.ButtonGroup, { ...props, children: [
31
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
32
+ import_material.Button,
33
+ {
34
+ title: "Save Favorite",
35
+ variant: "contained",
36
+ onClick: (e) => {
37
+ e.stopPropagation();
38
+ onConfirmFavorite?.(name, true);
39
+ },
40
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.Star, {})
41
+ }
42
+ ),
43
+ favorite ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
44
+ import_material.Button,
45
+ {
46
+ title: "Remove Favorite",
47
+ variant: "contained",
48
+ onClick: (e) => {
49
+ e.stopPropagation();
50
+ onConfirmFavorite?.(name, false);
51
+ },
52
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.Delete, {})
53
+ }
54
+ ) : null
55
+ ] });
56
+ };
57
+ //# sourceMappingURL=PopperButtonGroup.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/components/favorite/PopperButtonGroup.tsx"],"sourcesContent":["import { Delete as DeleteIcon, Star as StarIcon } from '@mui/icons-material'\nimport { Button, ButtonGroup, ButtonGroupProps } from '@mui/material'\n\nexport interface FavoritePopperProps extends ButtonGroupProps {\n favorite?: boolean\n name?: string\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\n\nexport const PopperButtonGroup: React.FC<FavoritePopperProps> = ({ name, onConfirmFavorite, favorite, ...props }) => {\n return (\n <ButtonGroup {...props}>\n <Button\n title=\"Save Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, true)\n }}\n >\n <StarIcon />\n </Button>\n {favorite ? (\n <Button\n title=\"Remove Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, false)\n }}\n >\n <DeleteIcon />\n </Button>\n ) : null}\n </ButtonGroup>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAAuD;AACvD,sBAAsD;AAUlD;AAFG,IAAM,oBAAmD,CAAC,EAAE,MAAM,mBAAmB,UAAU,GAAG,MAAM,MAAM;AACnH,SACE,6CAAC,+BAAa,GAAG,OACf;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AAClB,8BAAoB,MAAM,IAAI;AAAA,QAChC;AAAA,QAEA,sDAAC,sBAAAA,MAAA,EAAS;AAAA;AAAA,IACZ;AAAA,IACC,WACC;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AAClB,8BAAoB,MAAM,KAAK;AAAA,QACjC;AAAA,QAEA,sDAAC,sBAAAC,QAAA,EAAW;AAAA;AAAA,IACd,IACE;AAAA,KACN;AAEJ;","names":["StarIcon","DeleteIcon"]}
@@ -0,0 +1,9 @@
1
+ /// <reference types="react" />
2
+ import { ButtonGroupProps } from '@mui/material';
3
+ export interface FavoritePopperProps extends ButtonGroupProps {
4
+ favorite?: boolean;
5
+ name?: string;
6
+ onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void;
7
+ }
8
+ export declare const PopperButtonGroup: React.FC<FavoritePopperProps>;
9
+ //# sourceMappingURL=PopperButtonGroup.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PopperButtonGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/favorite/PopperButtonGroup.tsx"],"names":[],"mappings":";AACA,OAAO,EAAuB,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAErE,MAAM,WAAW,mBAAoB,SAAQ,gBAAgB;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,iBAAiB,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,gBAAgB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;CACxE;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA2B3D,CAAA"}
@@ -1,7 +1,8 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
1
+ // src/components/favorite/PopperButtonGroup.tsx
2
2
  import { Delete as DeleteIcon, Star as StarIcon } from "@mui/icons-material";
3
3
  import { Button, ButtonGroup } from "@mui/material";
4
- const PopperButtonGroup = ({ name, onConfirmFavorite, favorite, ...props }) => {
4
+ import { jsx, jsxs } from "react/jsx-runtime";
5
+ var PopperButtonGroup = ({ name, onConfirmFavorite, favorite, ...props }) => {
5
6
  return /* @__PURE__ */ jsxs(ButtonGroup, { ...props, children: [
6
7
  /* @__PURE__ */ jsx(
7
8
  Button,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/favorite/PopperButtonGroup.tsx"],"sourcesContent":["import { Delete as DeleteIcon, Star as StarIcon } from '@mui/icons-material'\nimport { Button, ButtonGroup, ButtonGroupProps } from '@mui/material'\n\nexport interface FavoritePopperProps extends ButtonGroupProps {\n favorite?: boolean\n name?: string\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\n\nexport const PopperButtonGroup: React.FC<FavoritePopperProps> = ({ name, onConfirmFavorite, favorite, ...props }) => {\n return (\n <ButtonGroup {...props}>\n <Button\n title=\"Save Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, true)\n }}\n >\n <StarIcon />\n </Button>\n {favorite ? (\n <Button\n title=\"Remove Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, false)\n }}\n >\n <DeleteIcon />\n </Button>\n ) : null}\n </ButtonGroup>\n )\n}\n"],"mappings":"AAWI,SASI,KATJ;AAXJ,SAAS,UAAU,YAAY,QAAQ,gBAAgB;AACvD,SAAS,QAAQ,mBAAqC;AAQ/C,MAAM,oBAAmD,CAAC,EAAE,MAAM,mBAAmB,UAAU,GAAG,MAAM,MAAM;AACnH,SACE,qBAAC,eAAa,GAAG,OACf;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AAClB,8BAAoB,MAAM,IAAI;AAAA,QAChC;AAAA,QAEA,8BAAC,YAAS;AAAA;AAAA,IACZ;AAAA,IACC,WACC;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AAClB,8BAAoB,MAAM,KAAK;AAAA,QACjC;AAAA,QAEA,8BAAC,cAAW;AAAA;AAAA,IACd,IACE;AAAA,KACN;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../../../src/components/favorite/PopperButtonGroup.tsx"],"sourcesContent":["import { Delete as DeleteIcon, Star as StarIcon } from '@mui/icons-material'\nimport { Button, ButtonGroup, ButtonGroupProps } from '@mui/material'\n\nexport interface FavoritePopperProps extends ButtonGroupProps {\n favorite?: boolean\n name?: string\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\n\nexport const PopperButtonGroup: React.FC<FavoritePopperProps> = ({ name, onConfirmFavorite, favorite, ...props }) => {\n return (\n <ButtonGroup {...props}>\n <Button\n title=\"Save Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, true)\n }}\n >\n <StarIcon />\n </Button>\n {favorite ? (\n <Button\n title=\"Remove Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, false)\n }}\n >\n <DeleteIcon />\n </Button>\n ) : null}\n </ButtonGroup>\n )\n}\n"],"mappings":";AAAA,SAAS,UAAU,YAAY,QAAQ,gBAAgB;AACvD,SAAS,QAAQ,mBAAqC;AAUlD,SASI,KATJ;AAFG,IAAM,oBAAmD,CAAC,EAAE,MAAM,mBAAmB,UAAU,GAAG,MAAM,MAAM;AACnH,SACE,qBAAC,eAAa,GAAG,OACf;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AAClB,8BAAoB,MAAM,IAAI;AAAA,QAChC;AAAA,QAEA,8BAAC,YAAS;AAAA;AAAA,IACZ;AAAA,IACC,WACC;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AAClB,8BAAoB,MAAM,KAAK;AAAA,QACjC;AAAA,QAEA,8BAAC,cAAW;AAAA;AAAA,IACd,IACE;AAAA,KACN;AAEJ;","names":[]}
@@ -0,0 +1,193 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+
20
+ // src/components/favorite/index.ts
21
+ var favorite_exports = {};
22
+ __export(favorite_exports, {
23
+ FavoriteIconButton: () => FavoriteIconButton
24
+ });
25
+ module.exports = __toCommonJS(favorite_exports);
26
+
27
+ // src/components/favorite/FavoriteIconButton.tsx
28
+ var import_material3 = require("@mui/material");
29
+ var import_react_event = require("@xyo-network/react-event");
30
+ var import_react_shared = require("@xyo-network/react-shared");
31
+ var import_react2 = require("react");
32
+
33
+ // src/components/lib/FavoriteItemEvent.ts
34
+ var generateFavoriteEvent = (favorite, favoriteType, favoriteValue, name) => ({
35
+ favorite: !!favorite,
36
+ favoriteType,
37
+ favoriteValue,
38
+ name
39
+ });
40
+
41
+ // src/components/favorite/FavoriteToggleSVG.tsx
42
+ var import_icons_material = require("@mui/icons-material");
43
+ var import_jsx_runtime = require("react/jsx-runtime");
44
+ var FavoriteToggleSVG = ({ favorite }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: favorite ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.Star, { className: "favorite-icon", component: "svg", color: "secondary", fontSize: "small" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.StarBorder, { className: "favorite-icon", fontSize: "small" }) });
45
+
46
+ // src/components/favorite/lib/PopperId.ts
47
+ var popperId = "favorite-popper";
48
+
49
+ // src/components/favorite/Popper.tsx
50
+ var import_material2 = require("@mui/material");
51
+ var import_react = require("react");
52
+
53
+ // src/components/favorite/PopperButtonGroup.tsx
54
+ var import_icons_material2 = require("@mui/icons-material");
55
+ var import_material = require("@mui/material");
56
+ var import_jsx_runtime2 = require("react/jsx-runtime");
57
+ var PopperButtonGroup = ({ name, onConfirmFavorite, favorite, ...props }) => {
58
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material.ButtonGroup, { ...props, children: [
59
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
60
+ import_material.Button,
61
+ {
62
+ title: "Save Favorite",
63
+ variant: "contained",
64
+ onClick: (e) => {
65
+ e.stopPropagation();
66
+ onConfirmFavorite?.(name, true);
67
+ },
68
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material2.Star, {})
69
+ }
70
+ ),
71
+ favorite ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
72
+ import_material.Button,
73
+ {
74
+ title: "Remove Favorite",
75
+ variant: "contained",
76
+ onClick: (e) => {
77
+ e.stopPropagation();
78
+ onConfirmFavorite?.(name, false);
79
+ },
80
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material2.Delete, {})
81
+ }
82
+ ) : null
83
+ ] });
84
+ };
85
+
86
+ // src/components/favorite/Popper.tsx
87
+ var import_jsx_runtime3 = require("react/jsx-runtime");
88
+ var FavoritePopper = (0, import_react.forwardRef)(
89
+ ({
90
+ name: nameProp,
91
+ favorite,
92
+ favoriteRef,
93
+ onClickAway = () => {
94
+ return;
95
+ },
96
+ onConfirmFavorite,
97
+ ...props
98
+ }, ref) => {
99
+ const [name, setName] = (0, import_react.useState)(nameProp);
100
+ (0, import_react.useEffect)(() => {
101
+ setName(nameProp);
102
+ }, [nameProp]);
103
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material2.ClickAwayListener, { onClickAway, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
104
+ PopperStyled,
105
+ {
106
+ id: popperId,
107
+ anchorEl: favoriteRef?.current,
108
+ onClick: (e) => e.stopPropagation(),
109
+ onTouchStart: (e) => e.stopPropagation(),
110
+ transition: true,
111
+ ref,
112
+ ...props,
113
+ children: ({ TransitionProps }) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material2.Fade, { ...TransitionProps, timeout: 350, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material2.Card, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_material2.CardContent, { sx: { display: "flex", gap: 1 }, children: [
114
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
115
+ import_material2.TextField,
116
+ {
117
+ autoFocus: true,
118
+ label: "Favorite Name",
119
+ placeholder: "optional",
120
+ size: "small",
121
+ value: name ?? "",
122
+ onChange: (e) => setName(e.target.value)
123
+ }
124
+ ),
125
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(PopperButtonGroup, { favorite, onConfirmFavorite, name })
126
+ ] }) }) })
127
+ }
128
+ ) });
129
+ }
130
+ );
131
+ FavoritePopper.displayName = "FavoritePopper";
132
+ var PopperStyled = (0, import_material2.styled)(import_material2.Popper, { name: "PopperStyled" })(() => ({ zIndex: 9999 }));
133
+
134
+ // src/components/favorite/FavoriteIconButton.tsx
135
+ var import_jsx_runtime4 = require("react/jsx-runtime");
136
+ var FavoriteIconButton = (0, import_react2.forwardRef)(
137
+ ({ children, favorite: favoriteProp, name, valueType, value, ...props }, ref) => {
138
+ const [openPopper, setOpenPopper] = (0, import_react2.useState)(false);
139
+ const [favorite, setFavorite] = (0, import_react2.useState)(favoriteProp);
140
+ (0, import_react2.useEffect)(() => {
141
+ setFavorite(favoriteProp);
142
+ }, [favoriteProp]);
143
+ const sharedRef = (0, import_react_shared.useShareForwardedRef)(ref);
144
+ const [buttonRef, dispatch] = (0, import_react_event.useEvent)(void 0, sharedRef);
145
+ const onConfirmFavorite = (name2, newFavoriteState) => {
146
+ const favoriteEvent = generateFavoriteEvent(!!newFavoriteState, valueType, value, name2);
147
+ dispatch("address", "favorite", JSON.stringify(favoriteEvent));
148
+ setFavorite(newFavoriteState);
149
+ setOpenPopper(false);
150
+ };
151
+ const starRef = (0, import_react2.useRef)(null);
152
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
153
+ IconButtonCondensed,
154
+ {
155
+ "aria-describedby": popperId,
156
+ ref: buttonRef,
157
+ onClick: (event) => {
158
+ event.stopPropagation();
159
+ setOpenPopper(!openPopper);
160
+ },
161
+ onTouchStart: (event) => {
162
+ event.stopPropagation();
163
+ setOpenPopper(!openPopper);
164
+ },
165
+ onMouseDown: (e) => e.stopPropagation(),
166
+ sx: { lineHeight: 0, p: 0.25 },
167
+ ...props,
168
+ children: [
169
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { ref: starRef, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FavoriteToggleSVG, { favorite }) }),
170
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
171
+ FavoritePopper,
172
+ {
173
+ sx: { zIndex: 1301 },
174
+ name,
175
+ favorite,
176
+ favoriteRef: starRef,
177
+ open: openPopper,
178
+ onConfirmFavorite,
179
+ onClickAway: () => setOpenPopper(false)
180
+ }
181
+ ),
182
+ children
183
+ ]
184
+ }
185
+ );
186
+ }
187
+ );
188
+ FavoriteIconButton.displayName = "FavoriteIconButton";
189
+ var IconButtonCondensed = (0, import_material3.styled)(import_material3.IconButton, { name: "IconButtonCondensed" })(({ theme }) => ({
190
+ lineHeight: 0,
191
+ padding: theme.spacing(0.25)
192
+ }));
193
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/components/favorite/index.ts","../../../../src/components/favorite/FavoriteIconButton.tsx","../../../../src/components/lib/FavoriteItemEvent.ts","../../../../src/components/favorite/FavoriteToggleSVG.tsx","../../../../src/components/favorite/lib/PopperId.ts","../../../../src/components/favorite/Popper.tsx","../../../../src/components/favorite/PopperButtonGroup.tsx"],"sourcesContent":["export * from './FavoriteIconButton'\n","import { IconButton, IconButtonProps, styled } from '@mui/material'\nimport { WithChildren } from '@xylabs/react-shared'\nimport { useEvent } from '@xyo-network/react-event'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\n\nimport { FavoriteItemEvent, generateFavoriteEvent } from '../lib'\nimport { FavoriteToggleSVG } from './FavoriteToggleSVG'\nimport { popperId } from './lib'\nimport { FavoritePopper } from './Popper'\n\nexport interface FavoriteIconButtonProps extends WithChildren, IconButtonProps {\n favorite?: FavoriteItemEvent['favorite']\n name?: FavoriteItemEvent['name']\n value?: string\n valueType?: FavoriteItemEvent['favoriteType']\n}\n\nexport const FavoriteIconButton = forwardRef<HTMLButtonElement, FavoriteIconButtonProps>(\n ({ children, favorite: favoriteProp, name, valueType, value, ...props }, ref) => {\n const [openPopper, setOpenPopper] = useState(false)\n\n const [favorite, setFavorite] = useState(favoriteProp)\n useEffect(() => {\n setFavorite(favoriteProp)\n }, [favoriteProp])\n\n const sharedRef = useShareForwardedRef(ref)\n const [buttonRef, dispatch] = useEvent(undefined, sharedRef)\n\n const onConfirmFavorite = (name?: string, newFavoriteState?: boolean) => {\n const favoriteEvent = generateFavoriteEvent(!!newFavoriteState, valueType, value, name)\n dispatch('address', 'favorite', JSON.stringify(favoriteEvent))\n setFavorite(newFavoriteState)\n setOpenPopper(false)\n }\n\n const starRef = useRef<HTMLSpanElement>(null)\n\n return (\n <IconButtonCondensed\n aria-describedby={popperId}\n ref={buttonRef}\n onClick={(event) => {\n event.stopPropagation()\n setOpenPopper(!openPopper)\n }}\n onTouchStart={(event) => {\n event.stopPropagation()\n setOpenPopper(!openPopper)\n }}\n onMouseDown={(e) => e.stopPropagation()}\n sx={{ lineHeight: 0, p: 0.25 }}\n {...props}\n >\n <span ref={starRef}>\n <FavoriteToggleSVG favorite={favorite} />\n </span>\n <FavoritePopper\n sx={{ zIndex: 1301 }}\n name={name}\n favorite={favorite}\n favoriteRef={starRef}\n open={openPopper}\n onConfirmFavorite={onConfirmFavorite}\n onClickAway={() => setOpenPopper(false)}\n />\n {children}\n </IconButtonCondensed>\n )\n },\n)\n\nFavoriteIconButton.displayName = 'FavoriteIconButton'\n\nconst IconButtonCondensed = styled(IconButton, { name: 'IconButtonCondensed' })(({ theme }) => ({\n lineHeight: 0,\n padding: theme.spacing(0.25),\n}))\n","export interface FavoriteItemEvent {\n favorite?: boolean\n favoriteType?: FavoriteType\n favoriteValue?: string\n name?: string\n}\n\nexport type FavoriteType = 'address' | 'schema' | 'hash'\n\nexport const generateFavoriteEvent = (favorite?: boolean, favoriteType?: FavoriteType, favoriteValue?: string, name?: string): FavoriteItemEvent => ({\n favorite: !!favorite,\n favoriteType,\n favoriteValue,\n name,\n})\n","import { Star as StarIcon, StarBorder as StarBorderIcon } from '@mui/icons-material'\n\nexport const FavoriteToggleSVG: React.FC<{ favorite?: boolean }> = ({ favorite }) => (\n <>\n {favorite ? (\n <StarIcon className=\"favorite-icon\" component={'svg'} color=\"secondary\" fontSize=\"small\" />\n ) : (\n <StarBorderIcon className=\"favorite-icon\" fontSize=\"small\" />\n )}\n </>\n)\n","export const popperId = 'favorite-popper'\n","import { Card, CardContent, ClickAwayListener, Fade, Popper, PopperProps, styled, TextField } from '@mui/material'\nimport { forwardRef, RefObject, useEffect, useState } from 'react'\n\nimport { popperId } from './lib'\nimport { PopperButtonGroup } from './PopperButtonGroup'\n\nexport interface FavoritePopperProps extends PopperProps {\n favorite?: boolean\n favoriteRef?: RefObject<HTMLElement>\n name?: string\n onClickAway?: (event: MouseEvent | TouchEvent) => void\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\nexport const FavoritePopper = forwardRef<HTMLDivElement, FavoritePopperProps>(\n (\n {\n name: nameProp,\n favorite,\n favoriteRef,\n onClickAway = () => {\n return\n },\n onConfirmFavorite,\n ...props\n },\n ref,\n ) => {\n const [name, setName] = useState(nameProp)\n useEffect(() => {\n setName(nameProp)\n }, [nameProp])\n\n return (\n <ClickAwayListener onClickAway={onClickAway}>\n <PopperStyled\n id={popperId}\n anchorEl={favoriteRef?.current}\n onClick={(e) => e.stopPropagation()}\n onTouchStart={(e) => e.stopPropagation()}\n transition\n ref={ref}\n {...props}\n >\n {({ TransitionProps }) => (\n <Fade {...TransitionProps} timeout={350}>\n <Card>\n <CardContent sx={{ display: 'flex', gap: 1 }}>\n <TextField\n autoFocus\n label=\"Favorite Name\"\n placeholder=\"optional\"\n size=\"small\"\n value={name ?? ''}\n onChange={(e) => setName(e.target.value)}\n />\n <PopperButtonGroup favorite={favorite} onConfirmFavorite={onConfirmFavorite} name={name} />\n </CardContent>\n </Card>\n </Fade>\n )}\n </PopperStyled>\n </ClickAwayListener>\n )\n },\n)\n\nFavoritePopper.displayName = 'FavoritePopper'\n\n// Ensure the popper is over all other mui portal elements\nconst PopperStyled = styled(Popper, { name: 'PopperStyled' })(() => ({ zIndex: 9999 }))\n","import { Delete as DeleteIcon, Star as StarIcon } from '@mui/icons-material'\nimport { Button, ButtonGroup, ButtonGroupProps } from '@mui/material'\n\nexport interface FavoritePopperProps extends ButtonGroupProps {\n favorite?: boolean\n name?: string\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\n\nexport const PopperButtonGroup: React.FC<FavoritePopperProps> = ({ name, onConfirmFavorite, favorite, ...props }) => {\n return (\n <ButtonGroup {...props}>\n <Button\n title=\"Save Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, true)\n }}\n >\n <StarIcon />\n </Button>\n {favorite ? (\n <Button\n title=\"Remove Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, false)\n }}\n >\n <DeleteIcon />\n </Button>\n ) : null}\n </ButtonGroup>\n )\n}\n"],"mappings":"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","names":["import_material","import_react","StarIcon","StarBorderIcon","import_material","import_icons_material","import_jsx_runtime","StarIcon","DeleteIcon","import_jsx_runtime","import_jsx_runtime","name"]}
@@ -0,0 +1,2 @@
1
+ export * from './FavoriteIconButton';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/favorite/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAA"}
@@ -1,2 +1,170 @@
1
- export * from "./FavoriteIconButton";
1
+ // src/components/favorite/FavoriteIconButton.tsx
2
+ import { IconButton, styled as styled2 } from "@mui/material";
3
+ import { useEvent } from "@xyo-network/react-event";
4
+ import { useShareForwardedRef } from "@xyo-network/react-shared";
5
+ import { forwardRef as forwardRef2, useEffect as useEffect2, useRef, useState as useState2 } from "react";
6
+
7
+ // src/components/lib/FavoriteItemEvent.ts
8
+ var generateFavoriteEvent = (favorite, favoriteType, favoriteValue, name) => ({
9
+ favorite: !!favorite,
10
+ favoriteType,
11
+ favoriteValue,
12
+ name
13
+ });
14
+
15
+ // src/components/favorite/FavoriteToggleSVG.tsx
16
+ import { Star as StarIcon, StarBorder as StarBorderIcon } from "@mui/icons-material";
17
+ import { Fragment, jsx } from "react/jsx-runtime";
18
+ var FavoriteToggleSVG = ({ favorite }) => /* @__PURE__ */ jsx(Fragment, { children: favorite ? /* @__PURE__ */ jsx(StarIcon, { className: "favorite-icon", component: "svg", color: "secondary", fontSize: "small" }) : /* @__PURE__ */ jsx(StarBorderIcon, { className: "favorite-icon", fontSize: "small" }) });
19
+
20
+ // src/components/favorite/lib/PopperId.ts
21
+ var popperId = "favorite-popper";
22
+
23
+ // src/components/favorite/Popper.tsx
24
+ import { Card, CardContent, ClickAwayListener, Fade, Popper, styled, TextField } from "@mui/material";
25
+ import { forwardRef, useEffect, useState } from "react";
26
+
27
+ // src/components/favorite/PopperButtonGroup.tsx
28
+ import { Delete as DeleteIcon, Star as StarIcon2 } from "@mui/icons-material";
29
+ import { Button, ButtonGroup } from "@mui/material";
30
+ import { jsx as jsx2, jsxs } from "react/jsx-runtime";
31
+ var PopperButtonGroup = ({ name, onConfirmFavorite, favorite, ...props }) => {
32
+ return /* @__PURE__ */ jsxs(ButtonGroup, { ...props, children: [
33
+ /* @__PURE__ */ jsx2(
34
+ Button,
35
+ {
36
+ title: "Save Favorite",
37
+ variant: "contained",
38
+ onClick: (e) => {
39
+ e.stopPropagation();
40
+ onConfirmFavorite?.(name, true);
41
+ },
42
+ children: /* @__PURE__ */ jsx2(StarIcon2, {})
43
+ }
44
+ ),
45
+ favorite ? /* @__PURE__ */ jsx2(
46
+ Button,
47
+ {
48
+ title: "Remove Favorite",
49
+ variant: "contained",
50
+ onClick: (e) => {
51
+ e.stopPropagation();
52
+ onConfirmFavorite?.(name, false);
53
+ },
54
+ children: /* @__PURE__ */ jsx2(DeleteIcon, {})
55
+ }
56
+ ) : null
57
+ ] });
58
+ };
59
+
60
+ // src/components/favorite/Popper.tsx
61
+ import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
62
+ var FavoritePopper = forwardRef(
63
+ ({
64
+ name: nameProp,
65
+ favorite,
66
+ favoriteRef,
67
+ onClickAway = () => {
68
+ return;
69
+ },
70
+ onConfirmFavorite,
71
+ ...props
72
+ }, ref) => {
73
+ const [name, setName] = useState(nameProp);
74
+ useEffect(() => {
75
+ setName(nameProp);
76
+ }, [nameProp]);
77
+ return /* @__PURE__ */ jsx3(ClickAwayListener, { onClickAway, children: /* @__PURE__ */ jsx3(
78
+ PopperStyled,
79
+ {
80
+ id: popperId,
81
+ anchorEl: favoriteRef?.current,
82
+ onClick: (e) => e.stopPropagation(),
83
+ onTouchStart: (e) => e.stopPropagation(),
84
+ transition: true,
85
+ ref,
86
+ ...props,
87
+ children: ({ TransitionProps }) => /* @__PURE__ */ jsx3(Fade, { ...TransitionProps, timeout: 350, children: /* @__PURE__ */ jsx3(Card, { children: /* @__PURE__ */ jsxs2(CardContent, { sx: { display: "flex", gap: 1 }, children: [
88
+ /* @__PURE__ */ jsx3(
89
+ TextField,
90
+ {
91
+ autoFocus: true,
92
+ label: "Favorite Name",
93
+ placeholder: "optional",
94
+ size: "small",
95
+ value: name ?? "",
96
+ onChange: (e) => setName(e.target.value)
97
+ }
98
+ ),
99
+ /* @__PURE__ */ jsx3(PopperButtonGroup, { favorite, onConfirmFavorite, name })
100
+ ] }) }) })
101
+ }
102
+ ) });
103
+ }
104
+ );
105
+ FavoritePopper.displayName = "FavoritePopper";
106
+ var PopperStyled = styled(Popper, { name: "PopperStyled" })(() => ({ zIndex: 9999 }));
107
+
108
+ // src/components/favorite/FavoriteIconButton.tsx
109
+ import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
110
+ var FavoriteIconButton = forwardRef2(
111
+ ({ children, favorite: favoriteProp, name, valueType, value, ...props }, ref) => {
112
+ const [openPopper, setOpenPopper] = useState2(false);
113
+ const [favorite, setFavorite] = useState2(favoriteProp);
114
+ useEffect2(() => {
115
+ setFavorite(favoriteProp);
116
+ }, [favoriteProp]);
117
+ const sharedRef = useShareForwardedRef(ref);
118
+ const [buttonRef, dispatch] = useEvent(void 0, sharedRef);
119
+ const onConfirmFavorite = (name2, newFavoriteState) => {
120
+ const favoriteEvent = generateFavoriteEvent(!!newFavoriteState, valueType, value, name2);
121
+ dispatch("address", "favorite", JSON.stringify(favoriteEvent));
122
+ setFavorite(newFavoriteState);
123
+ setOpenPopper(false);
124
+ };
125
+ const starRef = useRef(null);
126
+ return /* @__PURE__ */ jsxs3(
127
+ IconButtonCondensed,
128
+ {
129
+ "aria-describedby": popperId,
130
+ ref: buttonRef,
131
+ onClick: (event) => {
132
+ event.stopPropagation();
133
+ setOpenPopper(!openPopper);
134
+ },
135
+ onTouchStart: (event) => {
136
+ event.stopPropagation();
137
+ setOpenPopper(!openPopper);
138
+ },
139
+ onMouseDown: (e) => e.stopPropagation(),
140
+ sx: { lineHeight: 0, p: 0.25 },
141
+ ...props,
142
+ children: [
143
+ /* @__PURE__ */ jsx4("span", { ref: starRef, children: /* @__PURE__ */ jsx4(FavoriteToggleSVG, { favorite }) }),
144
+ /* @__PURE__ */ jsx4(
145
+ FavoritePopper,
146
+ {
147
+ sx: { zIndex: 1301 },
148
+ name,
149
+ favorite,
150
+ favoriteRef: starRef,
151
+ open: openPopper,
152
+ onConfirmFavorite,
153
+ onClickAway: () => setOpenPopper(false)
154
+ }
155
+ ),
156
+ children
157
+ ]
158
+ }
159
+ );
160
+ }
161
+ );
162
+ FavoriteIconButton.displayName = "FavoriteIconButton";
163
+ var IconButtonCondensed = styled2(IconButton, { name: "IconButtonCondensed" })(({ theme }) => ({
164
+ lineHeight: 0,
165
+ padding: theme.spacing(0.25)
166
+ }));
167
+ export {
168
+ FavoriteIconButton
169
+ };
2
170
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/favorite/index.ts"],"sourcesContent":["export * from './FavoriteIconButton'\n"],"mappings":"AAAA,cAAc;","names":[]}
1
+ {"version":3,"sources":["../../../../src/components/favorite/FavoriteIconButton.tsx","../../../../src/components/lib/FavoriteItemEvent.ts","../../../../src/components/favorite/FavoriteToggleSVG.tsx","../../../../src/components/favorite/lib/PopperId.ts","../../../../src/components/favorite/Popper.tsx","../../../../src/components/favorite/PopperButtonGroup.tsx"],"sourcesContent":["import { IconButton, IconButtonProps, styled } from '@mui/material'\nimport { WithChildren } from '@xylabs/react-shared'\nimport { useEvent } from '@xyo-network/react-event'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\n\nimport { FavoriteItemEvent, generateFavoriteEvent } from '../lib'\nimport { FavoriteToggleSVG } from './FavoriteToggleSVG'\nimport { popperId } from './lib'\nimport { FavoritePopper } from './Popper'\n\nexport interface FavoriteIconButtonProps extends WithChildren, IconButtonProps {\n favorite?: FavoriteItemEvent['favorite']\n name?: FavoriteItemEvent['name']\n value?: string\n valueType?: FavoriteItemEvent['favoriteType']\n}\n\nexport const FavoriteIconButton = forwardRef<HTMLButtonElement, FavoriteIconButtonProps>(\n ({ children, favorite: favoriteProp, name, valueType, value, ...props }, ref) => {\n const [openPopper, setOpenPopper] = useState(false)\n\n const [favorite, setFavorite] = useState(favoriteProp)\n useEffect(() => {\n setFavorite(favoriteProp)\n }, [favoriteProp])\n\n const sharedRef = useShareForwardedRef(ref)\n const [buttonRef, dispatch] = useEvent(undefined, sharedRef)\n\n const onConfirmFavorite = (name?: string, newFavoriteState?: boolean) => {\n const favoriteEvent = generateFavoriteEvent(!!newFavoriteState, valueType, value, name)\n dispatch('address', 'favorite', JSON.stringify(favoriteEvent))\n setFavorite(newFavoriteState)\n setOpenPopper(false)\n }\n\n const starRef = useRef<HTMLSpanElement>(null)\n\n return (\n <IconButtonCondensed\n aria-describedby={popperId}\n ref={buttonRef}\n onClick={(event) => {\n event.stopPropagation()\n setOpenPopper(!openPopper)\n }}\n onTouchStart={(event) => {\n event.stopPropagation()\n setOpenPopper(!openPopper)\n }}\n onMouseDown={(e) => e.stopPropagation()}\n sx={{ lineHeight: 0, p: 0.25 }}\n {...props}\n >\n <span ref={starRef}>\n <FavoriteToggleSVG favorite={favorite} />\n </span>\n <FavoritePopper\n sx={{ zIndex: 1301 }}\n name={name}\n favorite={favorite}\n favoriteRef={starRef}\n open={openPopper}\n onConfirmFavorite={onConfirmFavorite}\n onClickAway={() => setOpenPopper(false)}\n />\n {children}\n </IconButtonCondensed>\n )\n },\n)\n\nFavoriteIconButton.displayName = 'FavoriteIconButton'\n\nconst IconButtonCondensed = styled(IconButton, { name: 'IconButtonCondensed' })(({ theme }) => ({\n lineHeight: 0,\n padding: theme.spacing(0.25),\n}))\n","export interface FavoriteItemEvent {\n favorite?: boolean\n favoriteType?: FavoriteType\n favoriteValue?: string\n name?: string\n}\n\nexport type FavoriteType = 'address' | 'schema' | 'hash'\n\nexport const generateFavoriteEvent = (favorite?: boolean, favoriteType?: FavoriteType, favoriteValue?: string, name?: string): FavoriteItemEvent => ({\n favorite: !!favorite,\n favoriteType,\n favoriteValue,\n name,\n})\n","import { Star as StarIcon, StarBorder as StarBorderIcon } from '@mui/icons-material'\n\nexport const FavoriteToggleSVG: React.FC<{ favorite?: boolean }> = ({ favorite }) => (\n <>\n {favorite ? (\n <StarIcon className=\"favorite-icon\" component={'svg'} color=\"secondary\" fontSize=\"small\" />\n ) : (\n <StarBorderIcon className=\"favorite-icon\" fontSize=\"small\" />\n )}\n </>\n)\n","export const popperId = 'favorite-popper'\n","import { Card, CardContent, ClickAwayListener, Fade, Popper, PopperProps, styled, TextField } from '@mui/material'\nimport { forwardRef, RefObject, useEffect, useState } from 'react'\n\nimport { popperId } from './lib'\nimport { PopperButtonGroup } from './PopperButtonGroup'\n\nexport interface FavoritePopperProps extends PopperProps {\n favorite?: boolean\n favoriteRef?: RefObject<HTMLElement>\n name?: string\n onClickAway?: (event: MouseEvent | TouchEvent) => void\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\nexport const FavoritePopper = forwardRef<HTMLDivElement, FavoritePopperProps>(\n (\n {\n name: nameProp,\n favorite,\n favoriteRef,\n onClickAway = () => {\n return\n },\n onConfirmFavorite,\n ...props\n },\n ref,\n ) => {\n const [name, setName] = useState(nameProp)\n useEffect(() => {\n setName(nameProp)\n }, [nameProp])\n\n return (\n <ClickAwayListener onClickAway={onClickAway}>\n <PopperStyled\n id={popperId}\n anchorEl={favoriteRef?.current}\n onClick={(e) => e.stopPropagation()}\n onTouchStart={(e) => e.stopPropagation()}\n transition\n ref={ref}\n {...props}\n >\n {({ TransitionProps }) => (\n <Fade {...TransitionProps} timeout={350}>\n <Card>\n <CardContent sx={{ display: 'flex', gap: 1 }}>\n <TextField\n autoFocus\n label=\"Favorite Name\"\n placeholder=\"optional\"\n size=\"small\"\n value={name ?? ''}\n onChange={(e) => setName(e.target.value)}\n />\n <PopperButtonGroup favorite={favorite} onConfirmFavorite={onConfirmFavorite} name={name} />\n </CardContent>\n </Card>\n </Fade>\n )}\n </PopperStyled>\n </ClickAwayListener>\n )\n },\n)\n\nFavoritePopper.displayName = 'FavoritePopper'\n\n// Ensure the popper is over all other mui portal elements\nconst PopperStyled = styled(Popper, { name: 'PopperStyled' })(() => ({ zIndex: 9999 }))\n","import { Delete as DeleteIcon, Star as StarIcon } from '@mui/icons-material'\nimport { Button, ButtonGroup, ButtonGroupProps } from '@mui/material'\n\nexport interface FavoritePopperProps extends ButtonGroupProps {\n favorite?: boolean\n name?: string\n onConfirmFavorite?: (name?: string, newFavoriteState?: boolean) => void\n}\n\nexport const PopperButtonGroup: React.FC<FavoritePopperProps> = ({ name, onConfirmFavorite, favorite, ...props }) => {\n return (\n <ButtonGroup {...props}>\n <Button\n title=\"Save Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, true)\n }}\n >\n <StarIcon />\n </Button>\n {favorite ? (\n <Button\n title=\"Remove Favorite\"\n variant=\"contained\"\n onClick={(e) => {\n e.stopPropagation()\n onConfirmFavorite?.(name, false)\n }}\n >\n <DeleteIcon />\n </Button>\n ) : null}\n </ButtonGroup>\n )\n}\n"],"mappings":"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","names":["styled","forwardRef","useEffect","useState","StarIcon","jsx","jsx","jsxs","jsx","jsxs","forwardRef","useState","useEffect","name","styled"]}