@100mslive/roomkit-react 0.2.1-alpha.1 → 0.2.1-alpha.2

Sign up to get free protection for your applications and to get access to all the features.
package/dist/index.js CHANGED
@@ -62,7 +62,7 @@ import {
62
62
  theme,
63
63
  useBorderAudioLevel,
64
64
  useTheme
65
- } from "./chunk-LRZEFY46.js";
65
+ } from "./chunk-AWWYBQSE.js";
66
66
  export {
67
67
  Accordion,
68
68
  AudioLevel,
@@ -1486,7 +1486,7 @@
1486
1486
  "format": "esm"
1487
1487
  },
1488
1488
  "src/Toast/Toast.tsx": {
1489
- "bytes": 4279,
1489
+ "bytes": 4297,
1490
1490
  "imports": [
1491
1491
  {
1492
1492
  "path": "react",
@@ -4478,7 +4478,7 @@
4478
4478
  "format": "cjs"
4479
4479
  },
4480
4480
  "../hms-video-store/dist/index.js": {
4481
- "bytes": 320481,
4481
+ "bytes": 320301,
4482
4482
  "imports": [
4483
4483
  {
4484
4484
  "path": "../../node_modules/reselect/es/index.js",
@@ -6211,7 +6211,7 @@
6211
6211
  "format": "esm"
6212
6212
  },
6213
6213
  "src/Prebuilt/components/Polls/CreatePollQuiz/PollsQuizMenu.jsx": {
6214
- "bytes": 7706,
6214
+ "bytes": 7668,
6215
6215
  "imports": [
6216
6216
  {
6217
6217
  "path": "react",
@@ -6504,7 +6504,7 @@
6504
6504
  "format": "esm"
6505
6505
  },
6506
6506
  "src/Prebuilt/components/Polls/CreateQuestions/QuestionForm.tsx": {
6507
- "bytes": 9971,
6507
+ "bytes": 10090,
6508
6508
  "imports": [
6509
6509
  {
6510
6510
  "path": "react",
@@ -6780,7 +6780,7 @@
6780
6780
  "format": "esm"
6781
6781
  },
6782
6782
  "src/Prebuilt/components/Polls/Voting/PeerParticipationSummary.tsx": {
6783
- "bytes": 2098,
6783
+ "bytes": 2194,
6784
6784
  "imports": [
6785
6785
  {
6786
6786
  "path": "react",
@@ -11738,7 +11738,7 @@
11738
11738
  "format": "esm"
11739
11739
  },
11740
11740
  "src/Prebuilt/components/Notifications/Notifications.tsx": {
11741
- "bytes": 7752,
11741
+ "bytes": 8209,
11742
11742
  "imports": [
11743
11743
  {
11744
11744
  "path": "react",
@@ -12572,7 +12572,7 @@
12572
12572
  "imports": [],
12573
12573
  "exports": [],
12574
12574
  "inputs": {},
12575
- "bytes": 3066863
12575
+ "bytes": 3066434
12576
12576
  },
12577
12577
  "dist/index.cjs.js": {
12578
12578
  "imports": [
@@ -15246,7 +15246,7 @@
15246
15246
  "entryPoint": "src/index.ts",
15247
15247
  "inputs": {
15248
15248
  "<define:process.env>": {
15249
- "bytesInOutput": 17933
15249
+ "bytesInOutput": 17187
15250
15250
  },
15251
15251
  "src/Theme/base.config.ts": {
15252
15252
  "bytesInOutput": 6104
@@ -15423,7 +15423,7 @@
15423
15423
  "bytesInOutput": 927
15424
15424
  },
15425
15425
  "src/Stats/formatBytes.ts": {
15426
- "bytesInOutput": 634
15426
+ "bytesInOutput": 636
15427
15427
  },
15428
15428
  "src/Stats/StyledStats.tsx": {
15429
15429
  "bytesInOutput": 1004
@@ -15453,7 +15453,7 @@
15453
15453
  "bytesInOutput": 144
15454
15454
  },
15455
15455
  "src/Toast/Toast.tsx": {
15456
- "bytesInOutput": 5140
15456
+ "bytesInOutput": 5162
15457
15457
  },
15458
15458
  "src/Toast/index.tsx": {
15459
15459
  "bytesInOutput": 129
@@ -15642,7 +15642,7 @@
15642
15642
  "bytesInOutput": 5459
15643
15643
  },
15644
15644
  "src/Prebuilt/components/StatsForNerds.jsx": {
15645
- "bytesInOutput": 11472
15645
+ "bytesInOutput": 11474
15646
15646
  },
15647
15647
  "src/Prebuilt/components/MoreSettings/BulkRoleChangeModal.jsx": {
15648
15648
  "bytesInOutput": 6192
@@ -15720,7 +15720,7 @@
15720
15720
  "bytesInOutput": 615
15721
15721
  },
15722
15722
  "../hms-video-store/dist/index.js": {
15723
- "bytesInOutput": 52645
15723
+ "bytesInOutput": 52763
15724
15724
  },
15725
15725
  "src/Prebuilt/components/hooks/usePlaylistMusic.js": {
15726
15726
  "bytesInOutput": 1384
@@ -15831,7 +15831,7 @@
15831
15831
  "bytesInOutput": 959
15832
15832
  },
15833
15833
  "src/Prebuilt/components/Polls/CreatePollQuiz/PollsQuizMenu.jsx": {
15834
- "bytesInOutput": 9466
15834
+ "bytesInOutput": 9019
15835
15835
  },
15836
15836
  "src/Prebuilt/components/Polls/CreateQuestions/DeleteQuestionModal.tsx": {
15837
15837
  "bytesInOutput": 2786
@@ -15855,7 +15855,7 @@
15855
15855
  "bytesInOutput": 5343
15856
15856
  },
15857
15857
  "src/Prebuilt/components/Polls/CreateQuestions/QuestionForm.tsx": {
15858
- "bytesInOutput": 10626
15858
+ "bytesInOutput": 10146
15859
15859
  },
15860
15860
  "src/Prebuilt/components/Polls/CreateQuestions/SavedQuestion.tsx": {
15861
15861
  "bytesInOutput": 2705
@@ -15873,7 +15873,7 @@
15873
15873
  "bytesInOutput": 2203
15874
15874
  },
15875
15875
  "src/Prebuilt/components/Polls/Voting/PeerParticipationSummary.tsx": {
15876
- "bytesInOutput": 2730
15876
+ "bytesInOutput": 2825
15877
15877
  },
15878
15878
  "src/Prebuilt/components/Polls/Voting/LeaderboardSummary.tsx": {
15879
15879
  "bytesInOutput": 5011
@@ -16026,7 +16026,7 @@
16026
16026
  "bytesInOutput": 1620
16027
16027
  },
16028
16028
  "src/Prebuilt/components/hooks/useTileLayout.tsx": {
16029
- "bytesInOutput": 4488
16029
+ "bytesInOutput": 4492
16030
16030
  },
16031
16031
  "src/Prebuilt/components/VideoLayouts/EqualProminence.tsx": {
16032
16032
  "bytesInOutput": 2453
@@ -16200,7 +16200,7 @@
16200
16200
  "bytesInOutput": 2281
16201
16201
  },
16202
16202
  "src/Prebuilt/components/Notifications/Notifications.tsx": {
16203
- "bytesInOutput": 8338
16203
+ "bytesInOutput": 8924
16204
16204
  },
16205
16205
  "src/Prebuilt/components/Notifications/index.tsx": {
16206
16206
  "bytesInOutput": 173
@@ -16242,7 +16242,7 @@
16242
16242
  "bytesInOutput": 2980
16243
16243
  }
16244
16244
  },
16245
- "bytes": 1439039
16245
+ "bytes": 1438195
16246
16246
  }
16247
16247
  }
16248
16248
  }
@@ -1486,7 +1486,7 @@
1486
1486
  "format": "esm"
1487
1487
  },
1488
1488
  "src/Toast/Toast.tsx": {
1489
- "bytes": 4279,
1489
+ "bytes": 4297,
1490
1490
  "imports": [
1491
1491
  {
1492
1492
  "path": "react",
@@ -4478,7 +4478,7 @@
4478
4478
  "format": "cjs"
4479
4479
  },
4480
4480
  "../hms-video-store/dist/index.js": {
4481
- "bytes": 320481,
4481
+ "bytes": 320301,
4482
4482
  "imports": [
4483
4483
  {
4484
4484
  "path": "../../node_modules/reselect/es/index.js",
@@ -6211,7 +6211,7 @@
6211
6211
  "format": "esm"
6212
6212
  },
6213
6213
  "src/Prebuilt/components/Polls/CreatePollQuiz/PollsQuizMenu.jsx": {
6214
- "bytes": 7706,
6214
+ "bytes": 7668,
6215
6215
  "imports": [
6216
6216
  {
6217
6217
  "path": "react",
@@ -6504,7 +6504,7 @@
6504
6504
  "format": "esm"
6505
6505
  },
6506
6506
  "src/Prebuilt/components/Polls/CreateQuestions/QuestionForm.tsx": {
6507
- "bytes": 9971,
6507
+ "bytes": 10090,
6508
6508
  "imports": [
6509
6509
  {
6510
6510
  "path": "react",
@@ -6780,7 +6780,7 @@
6780
6780
  "format": "esm"
6781
6781
  },
6782
6782
  "src/Prebuilt/components/Polls/Voting/PeerParticipationSummary.tsx": {
6783
- "bytes": 2098,
6783
+ "bytes": 2194,
6784
6784
  "imports": [
6785
6785
  {
6786
6786
  "path": "react",
@@ -11738,7 +11738,7 @@
11738
11738
  "format": "esm"
11739
11739
  },
11740
11740
  "src/Prebuilt/components/Notifications/Notifications.tsx": {
11741
- "bytes": 7752,
11741
+ "bytes": 8209,
11742
11742
  "imports": [
11743
11743
  {
11744
11744
  "path": "react",
@@ -12577,7 +12577,7 @@
12577
12577
  "dist/index.js": {
12578
12578
  "imports": [
12579
12579
  {
12580
- "path": "dist/chunk-LRZEFY46.js",
12580
+ "path": "dist/chunk-AWWYBQSE.js",
12581
12581
  "kind": "import-statement"
12582
12582
  }
12583
12583
  ],
@@ -12650,16 +12650,16 @@
12650
12650
  "inputs": {},
12651
12651
  "bytes": 1822
12652
12652
  },
12653
- "dist/HLSView-QPKBRL74.js.map": {
12653
+ "dist/HLSView-S5JHEMWJ.js.map": {
12654
12654
  "imports": [],
12655
12655
  "exports": [],
12656
12656
  "inputs": {},
12657
12657
  "bytes": 58021
12658
12658
  },
12659
- "dist/HLSView-QPKBRL74.js": {
12659
+ "dist/HLSView-S5JHEMWJ.js": {
12660
12660
  "imports": [
12661
12661
  {
12662
- "path": "dist/chunk-LRZEFY46.js",
12662
+ "path": "dist/chunk-AWWYBQSE.js",
12663
12663
  "kind": "import-statement"
12664
12664
  },
12665
12665
  {
@@ -12823,13 +12823,13 @@
12823
12823
  },
12824
12824
  "bytes": 36449
12825
12825
  },
12826
- "dist/chunk-LRZEFY46.js.map": {
12826
+ "dist/chunk-AWWYBQSE.js.map": {
12827
12827
  "imports": [],
12828
12828
  "exports": [],
12829
12829
  "inputs": {},
12830
- "bytes": 3004449
12830
+ "bytes": 3004013
12831
12831
  },
12832
- "dist/chunk-LRZEFY46.js": {
12832
+ "dist/chunk-AWWYBQSE.js": {
12833
12833
  "imports": [
12834
12834
  {
12835
12835
  "path": "react",
@@ -15047,7 +15047,7 @@
15047
15047
  "external": true
15048
15048
  },
15049
15049
  {
15050
- "path": "dist/HLSView-QPKBRL74.js",
15050
+ "path": "dist/HLSView-S5JHEMWJ.js",
15051
15051
  "kind": "dynamic-import"
15052
15052
  },
15053
15053
  {
@@ -15469,7 +15469,7 @@
15469
15469
  ],
15470
15470
  "inputs": {
15471
15471
  "<define:process.env>": {
15472
- "bytesInOutput": 17933
15472
+ "bytesInOutput": 17187
15473
15473
  },
15474
15474
  "../../node_modules/lodash/lodash.js": {
15475
15475
  "bytesInOutput": 224265
@@ -15664,7 +15664,7 @@
15664
15664
  "bytesInOutput": 7824
15665
15665
  },
15666
15666
  "src/Stats/formatBytes.ts": {
15667
- "bytesInOutput": 471
15667
+ "bytesInOutput": 473
15668
15668
  },
15669
15669
  "src/Stats/StyledStats.tsx": {
15670
15670
  "bytesInOutput": 708
@@ -15679,7 +15679,7 @@
15679
15679
  "bytesInOutput": 738
15680
15680
  },
15681
15681
  "src/Toast/Toast.tsx": {
15682
- "bytesInOutput": 4076
15682
+ "bytesInOutput": 4094
15683
15683
  },
15684
15684
  "src/Accordion/index.ts": {
15685
15685
  "bytesInOutput": 149
@@ -15865,7 +15865,7 @@
15865
15865
  "bytesInOutput": 2940
15866
15866
  },
15867
15867
  "src/Prebuilt/components/StatsForNerds.jsx": {
15868
- "bytesInOutput": 9585
15868
+ "bytesInOutput": 9587
15869
15869
  },
15870
15870
  "src/Prebuilt/components/MoreSettings/BulkRoleChangeModal.jsx": {
15871
15871
  "bytesInOutput": 5008
@@ -15892,7 +15892,7 @@
15892
15892
  "bytesInOutput": 10019
15893
15893
  },
15894
15894
  "../hms-video-store/dist/index.js": {
15895
- "bytesInOutput": 48115
15895
+ "bytesInOutput": 48233
15896
15896
  },
15897
15897
  "../../node_modules/reselect/es/index.js": {
15898
15898
  "bytesInOutput": 2537
@@ -16033,7 +16033,7 @@
16033
16033
  "bytesInOutput": 735
16034
16034
  },
16035
16035
  "src/Prebuilt/components/Polls/CreatePollQuiz/PollsQuizMenu.jsx": {
16036
- "bytesInOutput": 7927
16036
+ "bytesInOutput": 7547
16037
16037
  },
16038
16038
  "src/Prebuilt/components/Streaming/Common.jsx": {
16039
16039
  "bytesInOutput": 2247
@@ -16045,7 +16045,7 @@
16045
16045
  "bytesInOutput": 4875
16046
16046
  },
16047
16047
  "src/Prebuilt/components/Polls/CreateQuestions/QuestionForm.tsx": {
16048
- "bytesInOutput": 8578
16048
+ "bytesInOutput": 8169
16049
16049
  },
16050
16050
  "src/Prebuilt/components/Polls/CreateQuestions/DeleteQuestionModal.tsx": {
16051
16051
  "bytesInOutput": 2083
@@ -16078,7 +16078,7 @@
16078
16078
  "bytesInOutput": 1683
16079
16079
  },
16080
16080
  "src/Prebuilt/components/Polls/Voting/PeerParticipationSummary.tsx": {
16081
- "bytesInOutput": 2194
16081
+ "bytesInOutput": 2277
16082
16082
  },
16083
16083
  "src/Prebuilt/components/Polls/Voting/StatisticBox.tsx": {
16084
16084
  "bytesInOutput": 634
@@ -16231,7 +16231,7 @@
16231
16231
  "bytesInOutput": 1204
16232
16232
  },
16233
16233
  "src/Prebuilt/components/hooks/useTileLayout.tsx": {
16234
- "bytesInOutput": 3837
16234
+ "bytesInOutput": 3841
16235
16235
  },
16236
16236
  "src/Prebuilt/components/VideoLayouts/RoleProminence.tsx": {
16237
16237
  "bytesInOutput": 1737
@@ -16312,7 +16312,7 @@
16312
16312
  "bytesInOutput": 27
16313
16313
  },
16314
16314
  "src/Prebuilt/components/Notifications/Notifications.tsx": {
16315
- "bytesInOutput": 7354
16315
+ "bytesInOutput": 7908
16316
16316
  },
16317
16317
  "src/Prebuilt/components/Toast/ToastBatcher.js": {
16318
16318
  "bytesInOutput": 1768
@@ -16384,7 +16384,7 @@
16384
16384
  "bytesInOutput": 651
16385
16385
  }
16386
16386
  },
16387
- "bytes": 1220642
16387
+ "bytes": 1219888
16388
16388
  }
16389
16389
  }
16390
16390
  }
package/package.json CHANGED
@@ -10,9 +10,14 @@
10
10
  "prebuilt",
11
11
  "roomkit"
12
12
  ],
13
- "version": "0.2.1-alpha.1",
13
+ "version": "0.2.1-alpha.2",
14
14
  "author": "100ms",
15
15
  "license": "MIT",
16
+ "repository": {
17
+ "type": "git",
18
+ "url": "https://github.com/100mslive/web-sdks.git",
19
+ "directory": "packages/roomkit-react"
20
+ },
16
21
  "files": [
17
22
  "dist",
18
23
  "src"
@@ -77,10 +82,10 @@
77
82
  "react": ">=17.0.2 <19.0.0"
78
83
  },
79
84
  "dependencies": {
80
- "@100mslive/hls-player": "0.2.1-alpha.1",
81
- "@100mslive/hms-virtual-background": "1.12.1-alpha.1",
82
- "@100mslive/react-icons": "0.9.1-alpha.1",
83
- "@100mslive/react-sdk": "0.9.1-alpha.1",
85
+ "@100mslive/hls-player": "0.2.1-alpha.2",
86
+ "@100mslive/hms-virtual-background": "1.12.1-alpha.2",
87
+ "@100mslive/react-icons": "0.9.1-alpha.2",
88
+ "@100mslive/react-sdk": "0.9.1-alpha.2",
84
89
  "@100mslive/types-prebuilt": "0.12.5",
85
90
  "@emoji-mart/data": "^1.0.6",
86
91
  "@emoji-mart/react": "^1.0.1",
@@ -115,5 +120,5 @@
115
120
  "uuid": "^8.3.2",
116
121
  "worker-timers": "^7.0.40"
117
122
  },
118
- "gitHead": "8e59b80ba249933faedfafd0c9fef523a07dc74c"
123
+ "gitHead": "28ace828c5944beff16c169195c807e4750e817e"
119
124
  }
@@ -38,6 +38,9 @@ import { useIsNotificationDisabled, useSubscribedNotifications } from '../AppDat
38
38
  import { getMetadata } from '../../common/utils';
39
39
  // @ts-ignore: No implicit Any
40
40
  import { ROLE_CHANGE_DECLINED } from '../../common/constants';
41
+
42
+ const pollToastKey: Record<string, string> = {};
43
+
41
44
  export function Notifications() {
42
45
  const localPeerID = useHMSStore(selectLocalPeerID);
43
46
  const notification = useHMSNotifications();
@@ -151,7 +154,8 @@ export function Notifications() {
151
154
  case HMSNotificationTypes.POLL_STARTED:
152
155
  if (notification.data.startedBy !== localPeerID && screenProps.screenType !== 'hls_live_streaming') {
153
156
  const pollStartedBy = vanillaStore.getState(selectPeerNameByID(notification.data.startedBy)) || 'Participant';
154
- ToastManager.addToast({
157
+
158
+ const pollToastID = ToastManager.addToast({
155
159
  title: `${pollStartedBy} started a ${notification.data.type}: ${notification.data.title}`,
156
160
  action: (
157
161
  <Button
@@ -167,7 +171,16 @@ export function Notifications() {
167
171
  {notification.data.type === 'quiz' ? 'Answer' : 'Vote'}
168
172
  </Button>
169
173
  ),
174
+ duration: Infinity,
170
175
  });
176
+ pollToastKey[notification.data.id] = pollToastID;
177
+ }
178
+ break;
179
+ case HMSNotificationTypes.POLL_STOPPED:
180
+ const pollID = notification?.data.id;
181
+ if (pollID && pollToastKey?.[pollID]) {
182
+ ToastManager.removeToast(pollToastKey?.[notification.data.id]);
183
+ delete pollToastKey[notification?.data.id];
171
184
  }
172
185
  break;
173
186
  default:
@@ -67,7 +67,6 @@ const AddMenu = () => {
67
67
  const actions = useHMSActions();
68
68
  const [title, setTitle] = useState('');
69
69
  const localPeerRoleName = useHMSStore(selectLocalPeerRoleName);
70
- const [anonymous, setAnonymous] = useState(false);
71
70
  const [hideVoteCount, setHideVoteCount] = useState(false);
72
71
  const [error, setError] = useState();
73
72
  const [titleError, setTitleError] = useState('');
@@ -141,12 +140,12 @@ const AddMenu = () => {
141
140
  Hide Vote Count
142
141
  </Text>
143
142
  </Flex>
144
- <Flex align="center" css={{ mt: '$10' }}>
143
+ {/* <Flex align="center" css={{ mt: '$10' }}>
145
144
  <Switch onCheckedChange={value => setAnonymous(value)} css={{ mr: '$6' }} />
146
145
  <Text variant="body2" css={{ c: '$on_surface_medium' }}>
147
146
  Make Results Anonymous
148
147
  </Text>
149
- </Flex>
148
+ </Flex> */}
150
149
  {/* <Timer
151
150
  timer={timer}
152
151
  setTimer={setTimer}
@@ -164,7 +163,7 @@ const AddMenu = () => {
164
163
  .createPoll({
165
164
  id,
166
165
  title,
167
- anonymous,
166
+ anonymous: false,
168
167
  rolesThatCanViewResponses: hideVoteCount && localPeerRoleName ? [localPeerRoleName] : undefined,
169
168
  type: interactionType.toLowerCase(),
170
169
  // duration: showTimerDropDown ? timer : undefined,
@@ -6,7 +6,8 @@ import {
6
6
  HMSPollQuestionType,
7
7
  } from '@100mslive/react-sdk';
8
8
  import { AddCircleIcon, TrashIcon } from '@100mslive/react-icons';
9
- import { Button, Dropdown, Flex, IconButton, Input, Switch, Text, TextArea, Tooltip } from '../../../..';
9
+ // import { Button, Dropdown, Flex, IconButton, Input, Switch, Text, TextArea, Tooltip } from '../../../..';
10
+ import { Button, Dropdown, Flex, IconButton, Input, Text, TextArea, Tooltip } from '../../../..';
10
11
  // @ts-ignore
11
12
  import { DialogDropdownTrigger } from '../../../primitives/DropdownTrigger';
12
13
  // @ts-ignore
@@ -50,7 +51,7 @@ export const QuestionForm = ({
50
51
  { text: '', isCorrectAnswer: false },
51
52
  ],
52
53
  );
53
- const [skippable, setSkippable] = useState(false);
54
+ // const [skippable, setSkippable] = useState(false);
54
55
  const isValid = isValidQuestion({
55
56
  text,
56
57
  type,
@@ -241,12 +242,12 @@ export const QuestionForm = ({
241
242
  }}
242
243
  />
243
244
  </Flex>
244
- <Flex justify="between" css={{ mt: '$md', gap: '$6', w: '100%' }}>
245
+ {/* <Flex justify="between" css={{ mt: '$md', gap: '$6', w: '100%' }}>
245
246
  <Text variant="sm" css={{ color: '$on_surface_medium' }}>
246
247
  Allow to skip
247
248
  </Text>
248
249
  <Switch defaultChecked={skippable} onCheckedChange={checked => setSkippable(checked)} />
249
- </Flex>
250
+ </Flex> */}
250
251
  </>
251
252
  ) : null}
252
253
  </>
@@ -274,7 +275,7 @@ export const QuestionForm = ({
274
275
  text,
275
276
  type,
276
277
  options,
277
- skippable,
278
+ skippable: false,
278
279
  draftID: question.draftID,
279
280
  weight,
280
281
  });
@@ -29,7 +29,10 @@ export const PeerParticipationSummary = ({ quiz }: { quiz: HMSPoll }) => {
29
29
  }/${summary.totalUsers})`,
30
30
  },
31
31
  { title: 'Avg. Time Taken', value: summary.avgTime },
32
- { title: 'Avg. Score', value: summary.avgScore },
32
+ {
33
+ title: 'Avg. Score',
34
+ value: Number.isInteger(summary.avgScore) ? summary.avgScore : summary.avgScore.toFixed(2),
35
+ },
33
36
  ]
34
37
  : [
35
38
  { title: 'Your rank', value: peerEntry?.position ? `${peerEntry.position}/${summary.totalUsers}` : '-' },
@@ -78,6 +78,7 @@ const ToastClose = styled(ToastPrimitives.Close, {});
78
78
  const ToastAction = styled(ToastPrimitives.Action, {
79
79
  cursor: 'pointer',
80
80
  background: 'none',
81
+ border: 'none',
81
82
  });
82
83
  const ToastViewport = styled(ToastPrimitives.Viewport, {
83
84
  position: 'fixed',