@rio-cloud/uikit-mcp 1.1.7 → 1.1.9
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.
- package/README.md +24 -18
- package/dist/doc-metadata.json +125 -295
- package/dist/docs/components/accentBar.md +16 -69
- package/dist/docs/components/activity.md +7 -44
- package/dist/docs/components/animatedNumber.md +3 -11
- package/dist/docs/components/animatedTextReveal.md +6 -34
- package/dist/docs/components/animations.md +21 -54
- package/dist/docs/components/appHeader.md +11 -30
- package/dist/docs/components/appLayout.md +40 -193
- package/dist/docs/components/appNavigationBar.md +1 -24
- package/dist/docs/components/areaCharts.md +7 -22
- package/dist/docs/components/aspectRatioPlaceholder.md +1 -9
- package/dist/docs/components/assetTree.md +241 -280
- package/dist/docs/components/autosuggests.md +3 -102
- package/dist/docs/components/avatar.md +1 -16
- package/dist/docs/components/banner.md +4 -37
- package/dist/docs/components/barCharts.md +20 -75
- package/dist/docs/components/barList.md +10 -78
- package/dist/docs/components/basicMap.md +1 -67
- package/dist/docs/components/bottomSheet.md +2 -28
- package/dist/docs/components/button.md +12 -65
- package/dist/docs/components/buttonToolbar.md +5 -19
- package/dist/docs/components/calendarStripe.md +50 -100
- package/dist/docs/components/card.md +1 -9
- package/dist/docs/components/carousel.md +1 -14
- package/dist/docs/components/chartColors.md +1 -156
- package/dist/docs/components/chartsGettingStarted.md +1 -1
- package/dist/docs/components/chat.md +2 -81
- package/dist/docs/components/checkbox.md +11 -72
- package/dist/docs/components/circularProgress.md +8 -49
- package/dist/docs/components/clearableInput.md +3 -62
- package/dist/docs/components/collapse.md +2 -15
- package/dist/docs/components/composedCharts.md +16 -26
- package/dist/docs/components/contentLoader.md +7 -25
- package/dist/docs/components/dataTabs.md +16 -104
- package/dist/docs/components/datepickers.md +710 -962
- package/dist/docs/components/dialogs.md +5 -67
- package/dist/docs/components/divider.md +1 -33
- package/dist/docs/components/dropdowns.md +3424 -5567
- package/dist/docs/components/editableContent.md +4 -82
- package/dist/docs/components/expander.md +15 -88
- package/dist/docs/components/fade.md +4 -61
- package/dist/docs/components/fadeExpander.md +1 -7
- package/dist/docs/components/fadeUp.md +2 -76
- package/dist/docs/components/feedback.md +9 -68
- package/dist/docs/components/filePickers.md +4 -18
- package/dist/docs/components/formLabel.md +7 -27
- package/dist/docs/components/groupedItemList.md +2 -158
- package/dist/docs/components/iconList.md +7 -64
- package/dist/docs/components/imagePreloader.md +1 -9
- package/dist/docs/components/labeledElement.md +3 -18
- package/dist/docs/components/licensePlate.md +1 -43
- package/dist/docs/components/lineCharts.md +8 -39
- package/dist/docs/components/listMenu.md +2 -34
- package/dist/docs/components/loadMore.md +5 -24
- package/dist/docs/components/mainNavigation.md +1 -9
- package/dist/docs/components/mapCircle.md +1 -23
- package/dist/docs/components/mapCluster.md +2 -54
- package/dist/docs/components/mapContext.md +1 -23
- package/dist/docs/components/mapDraggableMarker.md +2 -28
- package/dist/docs/components/mapGettingStarted.md +2 -2
- package/dist/docs/components/mapInfoBubble.md +1 -27
- package/dist/docs/components/mapLayerGroup.md +1 -23
- package/dist/docs/components/mapMarker.md +1 -99
- package/dist/docs/components/mapPolygon.md +2 -116
- package/dist/docs/components/mapRoute.md +6 -1465
- package/dist/docs/components/mapRouteGenerator.md +1 -1
- package/dist/docs/components/mapSettings.md +11 -128
- package/dist/docs/components/mapUtils.md +10 -113
- package/dist/docs/components/multiselects.md +14 -163
- package/dist/docs/components/noData.md +8 -22
- package/dist/docs/components/notifications.md +3 -19
- package/dist/docs/components/numbercontrol.md +3 -47
- package/dist/docs/components/onboarding.md +3 -15
- package/dist/docs/components/page.md +1 -33
- package/dist/docs/components/pager.md +1 -17
- package/dist/docs/components/pieCharts.md +40 -71
- package/dist/docs/components/popover.md +1 -12
- package/dist/docs/components/position.md +2 -6
- package/dist/docs/components/radialBarCharts.md +32 -116
- package/dist/docs/components/radioCardGroup.md +6 -48
- package/dist/docs/components/radiobutton.md +6 -75
- package/dist/docs/components/releaseNotes.md +3 -21
- package/dist/docs/components/resizer.md +1 -7
- package/dist/docs/components/responsiveColumnStripe.md +9 -49
- package/dist/docs/components/responsiveVideo.md +1 -7
- package/dist/docs/components/rioglyph.md +1 -17
- package/dist/docs/components/rules.md +7 -70
- package/dist/docs/components/saveableInput.md +267 -401
- package/dist/docs/components/selects.md +27 -1164
- package/dist/docs/components/sidebar.md +6 -17
- package/dist/docs/components/sliders.md +1 -27
- package/dist/docs/components/smoothScrollbars.md +1 -73
- package/dist/docs/components/spinners.md +6 -51
- package/dist/docs/components/states.md +6 -92
- package/dist/docs/components/statsWidgets.md +1 -76
- package/dist/docs/components/statusBar.md +1 -57
- package/dist/docs/components/stepButton.md +2 -7
- package/dist/docs/components/steppedProgressBars.md +5 -62
- package/dist/docs/components/subNavigation.md +1 -31
- package/dist/docs/components/supportMarker.md +2 -14
- package/dist/docs/components/svgImage.md +1 -5
- package/dist/docs/components/switch.md +2 -33
- package/dist/docs/components/tables.md +1 -1
- package/dist/docs/components/tagManager.md +1 -41
- package/dist/docs/components/tags.md +1 -138
- package/dist/docs/components/teaser.md +2 -122
- package/dist/docs/components/textTruncateMiddle.md +2 -9
- package/dist/docs/components/timeline.md +1 -99
- package/dist/docs/components/timepicker.md +4 -79
- package/dist/docs/components/toggleButton.md +2 -15
- package/dist/docs/components/tooltip.md +9 -30
- package/dist/docs/components/tracker.md +2 -19
- package/dist/docs/components/virtualList.md +61 -130
- package/dist/docs/foundations.md +749 -4069
- package/dist/docs/start/changelog.md +5 -1
- package/dist/docs/start/goodtoknow.md +1 -1
- package/dist/docs/start/guidelines/color-combinations.md +149 -483
- package/dist/docs/start/guidelines/custom-css.md +1 -1
- package/dist/docs/start/guidelines/custom-rioglyph.md +1 -1
- package/dist/docs/start/guidelines/formatting.md +1 -1
- package/dist/docs/start/guidelines/iframe.md +4 -16
- package/dist/docs/start/guidelines/obfuscate-data.md +1 -1
- package/dist/docs/start/guidelines/print-css.md +1 -1
- package/dist/docs/start/guidelines/spinner.md +13 -67
- package/dist/docs/start/guidelines/state-in-url.md +1 -1
- package/dist/docs/start/guidelines/supported-browsers.md +1 -1
- package/dist/docs/start/guidelines/writing.md +1 -1
- package/dist/docs/start/howto.md +11 -11
- package/dist/docs/start/intro.md +1 -1
- package/dist/docs/start/responsiveness.md +1 -1
- package/dist/docs/utilities/classNames.md +3 -18
- package/dist/docs/utilities/deviceUtils.md +7 -13
- package/dist/docs/utilities/featureToggles.md +1 -1
- package/dist/docs/utilities/fuelTypeUtils.md +2 -12
- package/dist/docs/utilities/routeUtils.md +25 -343
- package/dist/docs/utilities/useAfterMount.md +1 -6
- package/dist/docs/utilities/useAutoAnimate.md +2 -15
- package/dist/docs/utilities/useAverage.md +1 -6
- package/dist/docs/utilities/useClickOutside.md +1 -5
- package/dist/docs/utilities/useClipboard.md +2 -6
- package/dist/docs/utilities/useCookies.md +2 -10
- package/dist/docs/utilities/useCount.md +7 -16
- package/dist/docs/utilities/useDarkMode.md +2 -6
- package/dist/docs/utilities/useDebugInfo.md +6 -20
- package/dist/docs/utilities/useEffectOnce.md +1 -6
- package/dist/docs/utilities/useElapsedTime.md +2 -6
- package/dist/docs/utilities/useElementSize.md +1 -7
- package/dist/docs/utilities/useEsc.md +1 -5
- package/dist/docs/utilities/useEvent.md +1 -5
- package/dist/docs/utilities/useFocusTrap.md +1 -5
- package/dist/docs/utilities/useFullscreen.md +2 -15
- package/dist/docs/utilities/useHover.md +1 -5
- package/dist/docs/utilities/useIncomingPostMessages.md +2 -18
- package/dist/docs/utilities/useInterval.md +2 -8
- package/dist/docs/utilities/useIsFocusWithin.md +1 -10
- package/dist/docs/utilities/useKey.md +1 -15
- package/dist/docs/utilities/useLocalStorage.md +2 -11
- package/dist/docs/utilities/useLocationSuggestions.md +1 -5
- package/dist/docs/utilities/useMax.md +1 -5
- package/dist/docs/utilities/useMin.md +1 -5
- package/dist/docs/utilities/useMutationObserver.md +3 -11
- package/dist/docs/utilities/useOnScreen.md +1 -8
- package/dist/docs/utilities/useOnlineStatus.md +1 -5
- package/dist/docs/utilities/usePostMessage.md +3 -9
- package/dist/docs/utilities/usePostMessageSender.md +3 -13
- package/dist/docs/utilities/usePrevious.md +1 -5
- package/dist/docs/utilities/useResizeObserver.md +3 -11
- package/dist/docs/utilities/useRioCookieConsent.md +1 -5
- package/dist/docs/utilities/useScrollPosition.md +3 -59
- package/dist/docs/utilities/useSearch.md +2 -16
- package/dist/docs/utilities/useSearchHighlight.md +13 -78
- package/dist/docs/utilities/useSorting.md +18 -43
- package/dist/docs/utilities/useStateWithValidation.md +1 -5
- package/dist/docs/utilities/useSum.md +1 -9
- package/dist/docs/utilities/useTableExport.md +42 -59
- package/dist/docs/utilities/useTableSelection.md +74 -119
- package/dist/docs/utilities/useTimeout.md +2 -6
- package/dist/docs/utilities/useToggle.md +4 -14
- package/dist/docs/utilities/useUrlState.md +2 -27
- package/dist/docs/utilities/useWindowResize.md +1 -5
- package/dist/index.mjs +46 -16
- package/dist/version.json +2 -2
- package/package.json +15 -9
- package/dist/docs/templates/common-table.md +0 -1112
- package/dist/docs/templates/detail-views.md +0 -942
- package/dist/docs/templates/expandable-details.md +0 -228
- package/dist/docs/templates/feature-cards.md +0 -549
- package/dist/docs/templates/form-summary.md +0 -199
- package/dist/docs/templates/form-toggle.md +0 -367
- package/dist/docs/templates/list-blocks.md +0 -1021
- package/dist/docs/templates/loading-progress.md +0 -109
- package/dist/docs/templates/options-panel.md +0 -152
- package/dist/docs/templates/panel-variants.md +0 -164
- package/dist/docs/templates/progress-cards.md +0 -607
- package/dist/docs/templates/progress-success.md +0 -142
- package/dist/docs/templates/settings-form.md +0 -434
- package/dist/docs/templates/stats-blocks.md +0 -1381
- package/dist/docs/templates/table-panel.md +0 -184
- package/dist/docs/templates/table-row-animation.md +0 -317
- package/dist/docs/templates/usage-cards.md +0 -227
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*Category:* Utilities
|
|
4
4
|
*Section:* Table & data hooks
|
|
5
5
|
*Source:* https://uikit.developers.rio.cloud/#/utilities/useTableSelection
|
|
6
|
-
*Captured:* 2026-
|
|
6
|
+
*Captured:* 2026-03-06T10:41:59.326Z
|
|
7
7
|
|
|
8
8
|
The useTableSelection hook simplifies the implementation of selection behavior in tables for single selection and multi-selection use cases. It’s especially useful for large datasets, as it optimizes performance by preventing unnecessary re-renders of all rows.
|
|
9
9
|
|
|
@@ -16,26 +16,13 @@ The useTableSelection hook simplifies the implementation of selection behavior i
|
|
|
16
16
|
Active row
|
|
17
17
|
-
|
|
18
18
|
|
|
19
|
-
|
|
19
|
+
Id First name Last name E-mail
|
|
20
20
|
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
#### Summary
|
|
28
|
-
|
|
29
|
-
Active row
|
|
30
|
-
-
|
|
31
|
-
|
|
32
|
-
IdFirst nameLast nameE-mail
|
|
33
|
-
|
|
34
|
-
1JesseHilpertLexus.Will@yahoo.com
|
|
35
|
-
2LuellaLittelCasey.Trantow@yahoo.com
|
|
36
|
-
3BeulahBartellBrady.Nader@gmail.com
|
|
37
|
-
4DionLubowitzPerry33@gmail.com
|
|
38
|
-
5TerrellBechtelarShirley32@gmail.com
|
|
21
|
+
1 Kenny Becker Geovany_Aufderhar-Reichel99@gmail.com
|
|
22
|
+
2 Lillie Littel Dariana.Sanford22@hotmail.com
|
|
23
|
+
3 Jackie Kozey Augustine21@hotmail.com
|
|
24
|
+
4 Lewis Franey Thaddeus_Littel@hotmail.com
|
|
25
|
+
5 Sarai Huels Kayley85@gmail.com
|
|
39
26
|
|
|
40
27
|
#### React (tsx)
|
|
41
28
|
|
|
@@ -266,13 +253,13 @@ const TableRow = React.memo(
|
|
|
266
253
|
<span>1</span>
|
|
267
254
|
</td>
|
|
268
255
|
<td data-field="First name">
|
|
269
|
-
<span>
|
|
256
|
+
<span>Kenny</span>
|
|
270
257
|
</td>
|
|
271
258
|
<td data-field="Last name">
|
|
272
|
-
<span>
|
|
259
|
+
<span>Becker</span>
|
|
273
260
|
</td>
|
|
274
261
|
<td data-field="E-mail">
|
|
275
|
-
<span>
|
|
262
|
+
<span>Geovany_Aufderhar-Reichel99@gmail.com</span>
|
|
276
263
|
</td>
|
|
277
264
|
</tr>
|
|
278
265
|
<tr data-id="2" class="cursor-pointer">
|
|
@@ -280,13 +267,13 @@ const TableRow = React.memo(
|
|
|
280
267
|
<span>2</span>
|
|
281
268
|
</td>
|
|
282
269
|
<td data-field="First name">
|
|
283
|
-
<span>
|
|
270
|
+
<span>Lillie</span>
|
|
284
271
|
</td>
|
|
285
272
|
<td data-field="Last name">
|
|
286
273
|
<span>Littel</span>
|
|
287
274
|
</td>
|
|
288
275
|
<td data-field="E-mail">
|
|
289
|
-
<span>
|
|
276
|
+
<span>Dariana.Sanford22@hotmail.com</span>
|
|
290
277
|
</td>
|
|
291
278
|
</tr>
|
|
292
279
|
<tr data-id="3" class="cursor-pointer">
|
|
@@ -294,13 +281,13 @@ const TableRow = React.memo(
|
|
|
294
281
|
<span>3</span>
|
|
295
282
|
</td>
|
|
296
283
|
<td data-field="First name">
|
|
297
|
-
<span>
|
|
284
|
+
<span>Jackie</span>
|
|
298
285
|
</td>
|
|
299
286
|
<td data-field="Last name">
|
|
300
|
-
<span>
|
|
287
|
+
<span>Kozey</span>
|
|
301
288
|
</td>
|
|
302
289
|
<td data-field="E-mail">
|
|
303
|
-
<span>
|
|
290
|
+
<span>Augustine21@hotmail.com</span>
|
|
304
291
|
</td>
|
|
305
292
|
</tr>
|
|
306
293
|
<tr data-id="4" class="cursor-pointer">
|
|
@@ -308,13 +295,13 @@ const TableRow = React.memo(
|
|
|
308
295
|
<span>4</span>
|
|
309
296
|
</td>
|
|
310
297
|
<td data-field="First name">
|
|
311
|
-
<span>
|
|
298
|
+
<span>Lewis</span>
|
|
312
299
|
</td>
|
|
313
300
|
<td data-field="Last name">
|
|
314
|
-
<span>
|
|
301
|
+
<span>Franey</span>
|
|
315
302
|
</td>
|
|
316
303
|
<td data-field="E-mail">
|
|
317
|
-
<span>
|
|
304
|
+
<span>Thaddeus_Littel@hotmail.com</span>
|
|
318
305
|
</td>
|
|
319
306
|
</tr>
|
|
320
307
|
<tr data-id="5" class="cursor-pointer">
|
|
@@ -322,13 +309,13 @@ const TableRow = React.memo(
|
|
|
322
309
|
<span>5</span>
|
|
323
310
|
</td>
|
|
324
311
|
<td data-field="First name">
|
|
325
|
-
<span>
|
|
312
|
+
<span>Sarai</span>
|
|
326
313
|
</td>
|
|
327
314
|
<td data-field="Last name">
|
|
328
|
-
<span>
|
|
315
|
+
<span>Huels</span>
|
|
329
316
|
</td>
|
|
330
317
|
<td data-field="E-mail">
|
|
331
|
-
<span>
|
|
318
|
+
<span>Kayley85@gmail.com</span>
|
|
332
319
|
</td>
|
|
333
320
|
</tr>
|
|
334
321
|
</tbody>
|
|
@@ -379,61 +366,29 @@ Active row
|
|
|
379
366
|
Selected rows
|
|
380
367
|
4
|
|
381
368
|
|
|
382
|
-
Deselect all
|
|
383
|
-
|
|
384
|
-
IdFirst nameLast nameE-mail
|
|
385
|
-
|
|
386
|
-
1JudithHalvorsonChasity_Johnston@yahoo.com
|
|
387
|
-
|
|
388
|
-
2LouTorphy-CollinsStacey74@gmail.com
|
|
389
|
-
|
|
390
|
-
3DerekOndrickaCarolina83@hotmail.com
|
|
391
|
-
|
|
392
|
-
4AllenSpinkaDawn_Lowe39@hotmail.com
|
|
393
|
-
|
|
394
|
-
5BruceKuvalisKay.Deckow73@yahoo.com
|
|
395
|
-
|
|
396
|
-
6EmilioBaumbachJuanita.Hilpert23@hotmail.com
|
|
397
|
-
|
|
398
|
-
7DarinJohnsonTwila.Leannon14@yahoo.com
|
|
399
|
-
|
|
400
|
-
8DallasKoelpinRusty_Thompson-Lehner99@gmail.com
|
|
401
|
-
|
|
402
|
-
9MauriceSwift-KemmerTim.Hamill65@gmail.com
|
|
403
|
-
|
|
404
|
-
10GeovanniConroyAugust95@hotmail.com
|
|
405
|
-
|
|
406
|
-
#### Summary
|
|
407
|
-
|
|
408
|
-
Active row
|
|
409
|
-
-
|
|
410
|
-
|
|
411
|
-
Selected rows
|
|
412
|
-
4
|
|
413
|
-
|
|
414
|
-
Deselect all ItemsSelect some rows
|
|
369
|
+
Deselect all Items Select some rows
|
|
415
370
|
|
|
416
|
-
|
|
371
|
+
Id First name Last name E-mail
|
|
417
372
|
|
|
418
|
-
|
|
373
|
+
1 Gunnar Boyer Willie.Quigley@yahoo.com
|
|
419
374
|
|
|
420
|
-
|
|
375
|
+
2 Claude Mueller Garry.Skiles@yahoo.com
|
|
421
376
|
|
|
422
|
-
|
|
377
|
+
3 Robbie Kuhn Arnulfo35@yahoo.com
|
|
423
378
|
|
|
424
|
-
|
|
379
|
+
4 Clementine Aufderhar Kim52@yahoo.com
|
|
425
380
|
|
|
426
|
-
|
|
381
|
+
5 Doug King Roger_Kunze@gmail.com
|
|
427
382
|
|
|
428
|
-
|
|
383
|
+
6 Opal Cassin-Davis Jeannie8@gmail.com
|
|
429
384
|
|
|
430
|
-
|
|
385
|
+
7 Amelia Cummerata Mitchell62@yahoo.com
|
|
431
386
|
|
|
432
|
-
|
|
387
|
+
8 Darnell Friesen Darrin.Turcotte@gmail.com
|
|
433
388
|
|
|
434
|
-
|
|
389
|
+
9 Colin Pagac Jenifer94@hotmail.com
|
|
435
390
|
|
|
436
|
-
|
|
391
|
+
10 Latoya Heller Hiram_Hansen52@hotmail.com
|
|
437
392
|
|
|
438
393
|
#### React (tsx)
|
|
439
394
|
|
|
@@ -732,7 +687,7 @@ const TableRow = React.memo(
|
|
|
732
687
|
<tr>
|
|
733
688
|
<th class="user-select-none sort-column table-checkbox" title="">
|
|
734
689
|
<div class="dropdown btn-group">
|
|
735
|
-
<button type="button" id="
|
|
690
|
+
<button type="button" id="vd2bi9o834i" class="btn btn-default btn-outline btn-sm btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
736
691
|
<span class="rioglyph rioglyph-checkboxes">
|
|
737
692
|
</span>
|
|
738
693
|
</button>
|
|
@@ -783,18 +738,18 @@ const TableRow = React.memo(
|
|
|
783
738
|
<span>1</span>
|
|
784
739
|
</td>
|
|
785
740
|
<td data-field="First name">
|
|
786
|
-
<span>
|
|
741
|
+
<span>Gunnar</span>
|
|
787
742
|
</td>
|
|
788
743
|
<td data-field="Last name">
|
|
789
|
-
<span>
|
|
744
|
+
<span>Boyer</span>
|
|
790
745
|
</td>
|
|
791
746
|
<td data-field="E-mail">
|
|
792
|
-
<span>
|
|
747
|
+
<span>Willie.Quigley@yahoo.com</span>
|
|
793
748
|
</td>
|
|
794
749
|
<td class="table-action">
|
|
795
750
|
<span>
|
|
796
751
|
<div class="dropdown btn-group">
|
|
797
|
-
<button type="button" id="
|
|
752
|
+
<button type="button" id="h9i2qtdynds" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
798
753
|
<span class="rioglyph rioglyph-option-vertical">
|
|
799
754
|
</span>
|
|
800
755
|
</button>
|
|
@@ -814,18 +769,18 @@ const TableRow = React.memo(
|
|
|
814
769
|
<span>2</span>
|
|
815
770
|
</td>
|
|
816
771
|
<td data-field="First name">
|
|
817
|
-
<span>
|
|
772
|
+
<span>Claude</span>
|
|
818
773
|
</td>
|
|
819
774
|
<td data-field="Last name">
|
|
820
|
-
<span>
|
|
775
|
+
<span>Mueller</span>
|
|
821
776
|
</td>
|
|
822
777
|
<td data-field="E-mail">
|
|
823
|
-
<span>
|
|
778
|
+
<span>Garry.Skiles@yahoo.com</span>
|
|
824
779
|
</td>
|
|
825
780
|
<td class="table-action">
|
|
826
781
|
<span>
|
|
827
782
|
<div class="dropdown btn-group">
|
|
828
|
-
<button type="button" id="
|
|
783
|
+
<button type="button" id="6p6n0fbipvv" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
829
784
|
<span class="rioglyph rioglyph-option-vertical">
|
|
830
785
|
</span>
|
|
831
786
|
</button>
|
|
@@ -845,18 +800,18 @@ const TableRow = React.memo(
|
|
|
845
800
|
<span>3</span>
|
|
846
801
|
</td>
|
|
847
802
|
<td data-field="First name">
|
|
848
|
-
<span>
|
|
803
|
+
<span>Robbie</span>
|
|
849
804
|
</td>
|
|
850
805
|
<td data-field="Last name">
|
|
851
|
-
<span>
|
|
806
|
+
<span>Kuhn</span>
|
|
852
807
|
</td>
|
|
853
808
|
<td data-field="E-mail">
|
|
854
|
-
<span>
|
|
809
|
+
<span>Arnulfo35@yahoo.com</span>
|
|
855
810
|
</td>
|
|
856
811
|
<td class="table-action">
|
|
857
812
|
<span>
|
|
858
813
|
<div class="dropdown btn-group">
|
|
859
|
-
<button type="button" id="
|
|
814
|
+
<button type="button" id="eg467cg5pfe" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
860
815
|
<span class="rioglyph rioglyph-option-vertical">
|
|
861
816
|
</span>
|
|
862
817
|
</button>
|
|
@@ -876,18 +831,18 @@ const TableRow = React.memo(
|
|
|
876
831
|
<span>4</span>
|
|
877
832
|
</td>
|
|
878
833
|
<td data-field="First name">
|
|
879
|
-
<span>
|
|
834
|
+
<span>Clementine</span>
|
|
880
835
|
</td>
|
|
881
836
|
<td data-field="Last name">
|
|
882
|
-
<span>
|
|
837
|
+
<span>Aufderhar</span>
|
|
883
838
|
</td>
|
|
884
839
|
<td data-field="E-mail">
|
|
885
|
-
<span>
|
|
840
|
+
<span>Kim52@yahoo.com</span>
|
|
886
841
|
</td>
|
|
887
842
|
<td class="table-action">
|
|
888
843
|
<span>
|
|
889
844
|
<div class="dropdown btn-group">
|
|
890
|
-
<button type="button" id="
|
|
845
|
+
<button type="button" id="c2cta8or466" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
891
846
|
<span class="rioglyph rioglyph-option-vertical">
|
|
892
847
|
</span>
|
|
893
848
|
</button>
|
|
@@ -907,18 +862,18 @@ const TableRow = React.memo(
|
|
|
907
862
|
<span>5</span>
|
|
908
863
|
</td>
|
|
909
864
|
<td data-field="First name">
|
|
910
|
-
<span>
|
|
865
|
+
<span>Doug</span>
|
|
911
866
|
</td>
|
|
912
867
|
<td data-field="Last name">
|
|
913
|
-
<span>
|
|
868
|
+
<span>King</span>
|
|
914
869
|
</td>
|
|
915
870
|
<td data-field="E-mail">
|
|
916
|
-
<span>
|
|
871
|
+
<span>Roger_Kunze@gmail.com</span>
|
|
917
872
|
</td>
|
|
918
873
|
<td class="table-action">
|
|
919
874
|
<span>
|
|
920
875
|
<div class="dropdown btn-group">
|
|
921
|
-
<button type="button" id="
|
|
876
|
+
<button type="button" id="cxspl17zl4g" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
922
877
|
<span class="rioglyph rioglyph-option-vertical">
|
|
923
878
|
</span>
|
|
924
879
|
</button>
|
|
@@ -938,18 +893,18 @@ const TableRow = React.memo(
|
|
|
938
893
|
<span>6</span>
|
|
939
894
|
</td>
|
|
940
895
|
<td data-field="First name">
|
|
941
|
-
<span>
|
|
896
|
+
<span>Opal</span>
|
|
942
897
|
</td>
|
|
943
898
|
<td data-field="Last name">
|
|
944
|
-
<span>
|
|
899
|
+
<span>Cassin-Davis</span>
|
|
945
900
|
</td>
|
|
946
901
|
<td data-field="E-mail">
|
|
947
|
-
<span>
|
|
902
|
+
<span>Jeannie8@gmail.com</span>
|
|
948
903
|
</td>
|
|
949
904
|
<td class="table-action">
|
|
950
905
|
<span>
|
|
951
906
|
<div class="dropdown btn-group">
|
|
952
|
-
<button type="button" id="
|
|
907
|
+
<button type="button" id="r05bz6znzue" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
953
908
|
<span class="rioglyph rioglyph-option-vertical">
|
|
954
909
|
</span>
|
|
955
910
|
</button>
|
|
@@ -969,18 +924,18 @@ const TableRow = React.memo(
|
|
|
969
924
|
<span>7</span>
|
|
970
925
|
</td>
|
|
971
926
|
<td data-field="First name">
|
|
972
|
-
<span>
|
|
927
|
+
<span>Amelia</span>
|
|
973
928
|
</td>
|
|
974
929
|
<td data-field="Last name">
|
|
975
|
-
<span>
|
|
930
|
+
<span>Cummerata</span>
|
|
976
931
|
</td>
|
|
977
932
|
<td data-field="E-mail">
|
|
978
|
-
<span>
|
|
933
|
+
<span>Mitchell62@yahoo.com</span>
|
|
979
934
|
</td>
|
|
980
935
|
<td class="table-action">
|
|
981
936
|
<span>
|
|
982
937
|
<div class="dropdown btn-group">
|
|
983
|
-
<button type="button" id="
|
|
938
|
+
<button type="button" id="29ecg4p4lma" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
984
939
|
<span class="rioglyph rioglyph-option-vertical">
|
|
985
940
|
</span>
|
|
986
941
|
</button>
|
|
@@ -1000,18 +955,18 @@ const TableRow = React.memo(
|
|
|
1000
955
|
<span>8</span>
|
|
1001
956
|
</td>
|
|
1002
957
|
<td data-field="First name">
|
|
1003
|
-
<span>
|
|
958
|
+
<span>Darnell</span>
|
|
1004
959
|
</td>
|
|
1005
960
|
<td data-field="Last name">
|
|
1006
|
-
<span>
|
|
961
|
+
<span>Friesen</span>
|
|
1007
962
|
</td>
|
|
1008
963
|
<td data-field="E-mail">
|
|
1009
|
-
<span>
|
|
964
|
+
<span>Darrin.Turcotte@gmail.com</span>
|
|
1010
965
|
</td>
|
|
1011
966
|
<td class="table-action">
|
|
1012
967
|
<span>
|
|
1013
968
|
<div class="dropdown btn-group">
|
|
1014
|
-
<button type="button" id="
|
|
969
|
+
<button type="button" id="kc1kec5jo5k" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
1015
970
|
<span class="rioglyph rioglyph-option-vertical">
|
|
1016
971
|
</span>
|
|
1017
972
|
</button>
|
|
@@ -1031,18 +986,18 @@ const TableRow = React.memo(
|
|
|
1031
986
|
<span>9</span>
|
|
1032
987
|
</td>
|
|
1033
988
|
<td data-field="First name">
|
|
1034
|
-
<span>
|
|
989
|
+
<span>Colin</span>
|
|
1035
990
|
</td>
|
|
1036
991
|
<td data-field="Last name">
|
|
1037
|
-
<span>
|
|
992
|
+
<span>Pagac</span>
|
|
1038
993
|
</td>
|
|
1039
994
|
<td data-field="E-mail">
|
|
1040
|
-
<span>
|
|
995
|
+
<span>Jenifer94@hotmail.com</span>
|
|
1041
996
|
</td>
|
|
1042
997
|
<td class="table-action">
|
|
1043
998
|
<span>
|
|
1044
999
|
<div class="dropdown btn-group">
|
|
1045
|
-
<button type="button" id="
|
|
1000
|
+
<button type="button" id="54dysoqiutq" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
1046
1001
|
<span class="rioglyph rioglyph-option-vertical">
|
|
1047
1002
|
</span>
|
|
1048
1003
|
</button>
|
|
@@ -1062,18 +1017,18 @@ const TableRow = React.memo(
|
|
|
1062
1017
|
<span>10</span>
|
|
1063
1018
|
</td>
|
|
1064
1019
|
<td data-field="First name">
|
|
1065
|
-
<span>
|
|
1020
|
+
<span>Latoya</span>
|
|
1066
1021
|
</td>
|
|
1067
1022
|
<td data-field="Last name">
|
|
1068
|
-
<span>
|
|
1023
|
+
<span>Heller</span>
|
|
1069
1024
|
</td>
|
|
1070
1025
|
<td data-field="E-mail">
|
|
1071
|
-
<span>
|
|
1026
|
+
<span>Hiram_Hansen52@hotmail.com</span>
|
|
1072
1027
|
</td>
|
|
1073
1028
|
<td class="table-action">
|
|
1074
1029
|
<span>
|
|
1075
1030
|
<div class="dropdown btn-group">
|
|
1076
|
-
<button type="button" id="
|
|
1031
|
+
<button type="button" id="qskqd5obqgh" class="btn btn-default btn-link btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
|
|
1077
1032
|
<span class="rioglyph rioglyph-option-vertical">
|
|
1078
1033
|
</span>
|
|
1079
1034
|
</button>
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*Category:* Utilities
|
|
4
4
|
*Section:* Lifecycle & execution hooks
|
|
5
5
|
*Source:* https://uikit.developers.rio.cloud/#/utilities/useTimeout
|
|
6
|
-
*Captured:* 2026-
|
|
6
|
+
*Captured:* 2026-03-06T10:41:36.496Z
|
|
7
7
|
|
|
8
8
|
The useTimeout hook allows for executing some code after a specified amount of time.
|
|
9
9
|
|
|
@@ -11,11 +11,7 @@ The useTimeout hook allows for executing some code after a specified amount of t
|
|
|
11
11
|
|
|
12
12
|
### Example: Example 1
|
|
13
13
|
|
|
14
|
-
Message
|
|
15
|
-
|
|
16
|
-
#### Summary
|
|
17
|
-
|
|
18
|
-
Message:...
|
|
14
|
+
Message: ...
|
|
19
15
|
|
|
20
16
|
#### React (tsx)
|
|
21
17
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*Category:* Utilities
|
|
4
4
|
*Section:* Lifecycle & execution hooks
|
|
5
5
|
*Source:* https://uikit.developers.rio.cloud/#/utilities/useToggle
|
|
6
|
-
*Captured:* 2026-
|
|
6
|
+
*Captured:* 2026-03-06T10:41:37.499Z
|
|
7
7
|
|
|
8
8
|
The useToggle hook is a custom React hook for managing a boolean state. It provides an intuitive API to toggle, enable, or disable the value. You can optionally initialize it with a default state. Use it to handle toggle-based logic like switches, modals, or content visibility in your React components.
|
|
9
9
|
|
|
@@ -11,20 +11,10 @@ The useToggle hook is a custom React hook for managing a boolean state. It provi
|
|
|
11
11
|
|
|
12
12
|
### Example: Example 1
|
|
13
13
|
|
|
14
|
-
Usage on
|
|
15
|
-
|
|
16
|
-
Usage on a Switch component
|
|
14
|
+
Usage on buttons Toggle is OFF
|
|
15
|
+
Toggle Enable Disable Usage on a Switch component
|
|
17
16
|
|
|
18
|
-
Usage for hiding
|
|
19
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In pharetra dui eget massa efficitur aliquam condimentum in felis. Integer eget metus vel nunc efficitur iaculis. Vivamus elementum ante et est sagittis semper. Ut consectetur enim nec tortor scelerisque tincidunt. Fusce ac ligula bibendum, rutrum libero quis, viverra sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis ut hendrerit massa, in molestie elit. Sed vitae orci ac purus volutpat posuere ac ut neque. Mauris ante orci, semper finibus lorem in, fringilla pretium velit.
|
|
20
|
-
|
|
21
|
-
#### Summary
|
|
22
|
-
|
|
23
|
-
Usage on buttonsToggle is OFF
|
|
24
|
-
ToggleEnableDisable
|
|
25
|
-
Usage on a Switch component
|
|
26
|
-
|
|
27
|
-
Usage for hiding contentHide content
|
|
17
|
+
Usage for hiding content Hide content
|
|
28
18
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In pharetra dui eget massa efficitur aliquam condimentum in felis. Integer eget metus vel nunc efficitur iaculis. Vivamus elementum ante et est sagittis semper. Ut consectetur enim nec tortor scelerisque tincidunt. Fusce ac ligula bibendum, rutrum libero quis, viverra sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis ut hendrerit massa, in molestie elit. Sed vitae orci ac purus volutpat posuere ac ut neque. Mauris ante orci, semper finibus lorem in, fringilla pretium velit.
|
|
29
19
|
|
|
30
20
|
#### React (tsx)
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*Category:* Utilities
|
|
4
4
|
*Section:* UI state & input hooks
|
|
5
5
|
*Source:* https://uikit.developers.rio.cloud/#/utilities/useUrlState
|
|
6
|
-
*Captured:* 2026-
|
|
6
|
+
*Captured:* 2026-03-06T10:41:53.460Z
|
|
7
7
|
|
|
8
8
|
The useUrlState hook keeps store state and URL search params in sync. Define a config once and use the hook to read URL state into the store and write store changes back to the URL.
|
|
9
9
|
|
|
@@ -26,38 +26,13 @@ History behavior: history: 'push' always creates a new entry. history: 'replace'
|
|
|
26
26
|
URL
|
|
27
27
|
Search query
|
|
28
28
|
|
|
29
|
-
View
|
|
29
|
+
View mode list grid
|
|
30
30
|
Amount (default: 1)
|
|
31
31
|
Tags (picklist)
|
|
32
32
|
Banana
|
|
33
33
|
Peach
|
|
34
34
|
Pear
|
|
35
35
|
Strawberry
|
|
36
|
-
|
|
37
|
-
Show archived
|
|
38
|
-
(default: "false" - will be omitted from the URL)
|
|
39
|
-
Current URL state (stored in my-service/#)
|
|
40
|
-
{
|
|
41
|
-
"query": "",
|
|
42
|
-
"view": "list",
|
|
43
|
-
"amount": 1,
|
|
44
|
-
"tags": [],
|
|
45
|
-
"showArchived": false
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
#### Summary
|
|
49
|
-
|
|
50
|
-
URL
|
|
51
|
-
Search query
|
|
52
|
-
|
|
53
|
-
View modelistgrid
|
|
54
|
-
Amount (default: 1)
|
|
55
|
-
Tags (picklist)
|
|
56
|
-
Banana
|
|
57
|
-
Peach
|
|
58
|
-
Pear
|
|
59
|
-
Strawberry
|
|
60
|
-
|
|
61
36
|
Show archived
|
|
62
37
|
(default: "false" - will be omitted from the URL)
|
|
63
38
|
Current URL state (stored in my-service/#)
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*Category:* Utilities
|
|
4
4
|
*Section:* DOM behavior hooks
|
|
5
5
|
*Source:* https://uikit.developers.rio.cloud/#/utilities/useWindowResize
|
|
6
|
-
*Captured:* 2026-
|
|
6
|
+
*Captured:* 2026-03-06T10:41:44.904Z
|
|
7
7
|
|
|
8
8
|
The useWindowResize hook allows to react on window size changes.
|
|
9
9
|
|
|
@@ -13,10 +13,6 @@ The useWindowResize hook allows to react on window size changes.
|
|
|
13
13
|
|
|
14
14
|
Width is more than 1024px
|
|
15
15
|
|
|
16
|
-
#### Summary
|
|
17
|
-
|
|
18
|
-
Width is more than 1024px
|
|
19
|
-
|
|
20
16
|
#### React (tsx)
|
|
21
17
|
|
|
22
18
|
```tsx
|