@dxos/react-ui 0.8.1 → 0.8.2-main.10c050d

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 (135) hide show
  1. package/dist/lib/browser/chunk-5Y5JI6KC.mjs +4355 -0
  2. package/dist/lib/browser/chunk-5Y5JI6KC.mjs.map +7 -0
  3. package/dist/lib/browser/index.mjs +75 -2986
  4. package/dist/lib/browser/index.mjs.map +4 -4
  5. package/dist/lib/browser/meta.json +1 -1
  6. package/dist/lib/browser/testing/index.mjs +85 -0
  7. package/dist/lib/browser/testing/index.mjs.map +7 -0
  8. package/dist/lib/node/chunk-KMS7RFL7.cjs +4340 -0
  9. package/dist/lib/node/chunk-KMS7RFL7.cjs.map +7 -0
  10. package/dist/lib/node/index.cjs +71 -2946
  11. package/dist/lib/node/index.cjs.map +4 -4
  12. package/dist/lib/node/meta.json +1 -1
  13. package/dist/lib/node/testing/index.cjs +114 -0
  14. package/dist/lib/node/testing/index.cjs.map +7 -0
  15. package/dist/lib/node-esm/chunk-ANVE7WX5.mjs +4357 -0
  16. package/dist/lib/node-esm/chunk-ANVE7WX5.mjs.map +7 -0
  17. package/dist/lib/node-esm/index.mjs +74 -2986
  18. package/dist/lib/node-esm/index.mjs.map +4 -4
  19. package/dist/lib/node-esm/meta.json +1 -1
  20. package/dist/lib/node-esm/testing/index.mjs +86 -0
  21. package/dist/lib/node-esm/testing/index.mjs.map +7 -0
  22. package/dist/types/src/components/Avatars/Avatar.d.ts +4 -4
  23. package/dist/types/src/components/Avatars/Avatar.d.ts.map +1 -1
  24. package/dist/types/src/components/Avatars/Avatar.stories.d.ts +3 -3
  25. package/dist/types/src/components/Avatars/Avatar.stories.d.ts.map +1 -1
  26. package/dist/types/src/components/Avatars/AvatarGroup.stories.d.ts +0 -1
  27. package/dist/types/src/components/Avatars/AvatarGroup.stories.d.ts.map +1 -1
  28. package/dist/types/src/components/Buttons/Button.stories.d.ts +10 -44
  29. package/dist/types/src/components/Buttons/Button.stories.d.ts.map +1 -1
  30. package/dist/types/src/components/Buttons/IconButton.d.ts +4 -6
  31. package/dist/types/src/components/Buttons/IconButton.d.ts.map +1 -1
  32. package/dist/types/src/components/Buttons/IconButton.stories.d.ts +7 -6
  33. package/dist/types/src/components/Buttons/IconButton.stories.d.ts.map +1 -1
  34. package/dist/types/src/components/Buttons/Toggle.stories.d.ts.map +1 -1
  35. package/dist/types/src/components/Buttons/ToggleGroup.stories.d.ts +1 -4
  36. package/dist/types/src/components/Buttons/ToggleGroup.stories.d.ts.map +1 -1
  37. package/dist/types/src/components/Clipboard/ClipboardProvider.d.ts.map +1 -1
  38. package/dist/types/src/components/Clipboard/CopyButton.d.ts +2 -1
  39. package/dist/types/src/components/Clipboard/CopyButton.d.ts.map +1 -1
  40. package/dist/types/src/components/Clipboard/index.d.ts +2 -2
  41. package/dist/types/src/components/DensityProvider/DensityProvider.d.ts.map +1 -1
  42. package/dist/types/src/components/Dialogs/AlertDialog.stories.d.ts +2 -2
  43. package/dist/types/src/components/Dialogs/AlertDialog.stories.d.ts.map +1 -1
  44. package/dist/types/src/components/Dialogs/Dialog.d.ts +2 -2
  45. package/dist/types/src/components/Dialogs/Dialog.d.ts.map +1 -1
  46. package/dist/types/src/components/Dialogs/Dialog.stories.d.ts +2 -2
  47. package/dist/types/src/components/Dialogs/Dialog.stories.d.ts.map +1 -1
  48. package/dist/types/src/components/ElevationProvider/ElevationProvider.d.ts.map +1 -1
  49. package/dist/types/src/components/Input/Input.d.ts +1 -1
  50. package/dist/types/src/components/Input/Input.d.ts.map +1 -1
  51. package/dist/types/src/components/Input/Input.stories.d.ts +33 -159
  52. package/dist/types/src/components/Input/Input.stories.d.ts.map +1 -1
  53. package/dist/types/src/components/Lists/ListDropIndicator.d.ts.map +1 -1
  54. package/dist/types/src/components/Lists/Tree.stories.d.ts.map +1 -1
  55. package/dist/types/src/components/Lists/TreeDropIndicator.d.ts.map +1 -1
  56. package/dist/types/src/components/Lists/Treegrid.stories.d.ts +1 -1
  57. package/dist/types/src/components/Lists/Treegrid.stories.d.ts.map +1 -1
  58. package/dist/types/src/components/Main/Main.d.ts.map +1 -1
  59. package/dist/types/src/components/Main/Main.stories.d.ts.map +1 -1
  60. package/dist/types/src/components/Main/useSwipeToDismiss.d.ts.map +1 -1
  61. package/dist/types/src/components/Message/Message.stories.d.ts +8 -2
  62. package/dist/types/src/components/Message/Message.stories.d.ts.map +1 -1
  63. package/dist/types/src/components/Popover/Popover.d.ts +15 -6
  64. package/dist/types/src/components/Popover/Popover.d.ts.map +1 -1
  65. package/dist/types/src/components/Popover/Popover.stories.d.ts +5 -1
  66. package/dist/types/src/components/Popover/Popover.stories.d.ts.map +1 -1
  67. package/dist/types/src/components/ScrollArea/ScrollArea.d.ts.map +1 -1
  68. package/dist/types/src/components/ScrollArea/ScrollArea.stories.d.ts.map +1 -1
  69. package/dist/types/src/components/Status/Status.stories.d.ts.map +1 -1
  70. package/dist/types/src/components/ThemeProvider/ThemeProvider.d.ts.map +1 -1
  71. package/dist/types/src/components/ThemeProvider/TranslationsProvider.d.ts +1 -1
  72. package/dist/types/src/components/ThemeProvider/TranslationsProvider.d.ts.map +1 -1
  73. package/dist/types/src/components/Toast/Toast.stories.d.ts +2 -2
  74. package/dist/types/src/components/Toast/Toast.stories.d.ts.map +1 -1
  75. package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts.map +1 -1
  76. package/dist/types/src/components/Tooltip/Tooltip.d.ts +92 -20
  77. package/dist/types/src/components/Tooltip/Tooltip.d.ts.map +1 -1
  78. package/dist/types/src/components/Tooltip/Tooltip.stories.d.ts +40 -17
  79. package/dist/types/src/components/Tooltip/Tooltip.stories.d.ts.map +1 -1
  80. package/dist/types/src/components/index.d.ts +1 -1
  81. package/dist/types/src/components/index.d.ts.map +1 -1
  82. package/dist/types/src/hooks/useDensityContext.d.ts.map +1 -1
  83. package/dist/types/src/hooks/useElevationContext.d.ts.map +1 -1
  84. package/dist/types/src/hooks/useIconHref.d.ts.map +1 -1
  85. package/dist/types/src/hooks/useSafeCollisionPadding.d.ts.map +1 -1
  86. package/dist/types/src/hooks/useVisualViewport.d.ts.map +1 -1
  87. package/dist/types/src/playground/Controls.stories.d.ts +1 -1
  88. package/dist/types/src/playground/Controls.stories.d.ts.map +1 -1
  89. package/dist/types/src/playground/Custom.stories.d.ts +8 -0
  90. package/dist/types/src/playground/Custom.stories.d.ts.map +1 -0
  91. package/dist/types/src/testing/decorators/index.d.ts +1 -1
  92. package/dist/types/src/testing/decorators/index.d.ts.map +1 -1
  93. package/dist/types/src/testing/decorators/{withVariants.d.ts → withSurfaceVariantsLayout.d.ts} +2 -3
  94. package/dist/types/src/testing/decorators/withSurfaceVariantsLayout.d.ts.map +1 -0
  95. package/dist/types/tsconfig.tsbuildinfo +1 -1
  96. package/package.json +25 -15
  97. package/src/components/Avatars/Avatar.stories.tsx +27 -27
  98. package/src/components/Avatars/Avatar.tsx +24 -21
  99. package/src/components/Avatars/AvatarGroup.stories.tsx +4 -5
  100. package/src/components/Breadcrumb/Breadcrumb.stories.tsx +2 -2
  101. package/src/components/Buttons/Button.stories.tsx +20 -15
  102. package/src/components/Buttons/IconButton.stories.tsx +9 -10
  103. package/src/components/Buttons/IconButton.tsx +9 -38
  104. package/src/components/Buttons/Toggle.stories.tsx +2 -2
  105. package/src/components/Buttons/ToggleGroup.stories.tsx +3 -7
  106. package/src/components/Clipboard/CopyButton.tsx +22 -24
  107. package/src/components/Dialogs/AlertDialog.stories.tsx +4 -11
  108. package/src/components/Dialogs/Dialog.stories.tsx +3 -3
  109. package/src/components/Dialogs/Dialog.tsx +8 -4
  110. package/src/components/Input/Input.stories.tsx +69 -58
  111. package/src/components/Input/Input.tsx +1 -0
  112. package/src/components/Lists/Tree.stories.tsx +2 -2
  113. package/src/components/Lists/Treegrid.stories.tsx +12 -12
  114. package/src/components/Main/Main.stories.tsx +2 -2
  115. package/src/components/Main/Main.tsx +1 -0
  116. package/src/components/Menus/ContextMenu.stories.tsx +2 -2
  117. package/src/components/Menus/DropdownMenu.stories.tsx +2 -2
  118. package/src/components/Message/Message.stories.tsx +10 -4
  119. package/src/components/Popover/Popover.stories.tsx +2 -2
  120. package/src/components/Popover/Popover.tsx +8 -4
  121. package/src/components/ScrollArea/ScrollArea.stories.tsx +4 -4
  122. package/src/components/ScrollArea/ScrollArea.tsx +3 -0
  123. package/src/components/Select/Select.stories.tsx +2 -2
  124. package/src/components/Toast/Toast.stories.tsx +15 -10
  125. package/src/components/Toolbar/Toolbar.stories.tsx +2 -2
  126. package/src/components/Tooltip/Tooltip.stories.tsx +43 -18
  127. package/src/components/Tooltip/Tooltip.tsx +733 -58
  128. package/src/components/index.ts +1 -1
  129. package/src/playground/Controls.stories.tsx +4 -4
  130. package/src/playground/Custom.stories.tsx +137 -0
  131. package/src/playground/Typography.stories.tsx +2 -2
  132. package/src/testing/decorators/index.ts +1 -1
  133. package/src/testing/decorators/withSurfaceVariantsLayout.tsx +53 -0
  134. package/dist/types/src/testing/decorators/withVariants.d.ts.map +0 -1
  135. package/src/testing/decorators/withVariants.tsx +0 -45
@@ -1,9 +1,7 @@
1
1
  "use strict";
2
- var __create = Object.create;
3
2
  var __defProp = Object.defineProperty;
4
3
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
4
  var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
5
  var __hasOwnProp = Object.prototype.hasOwnProperty;
8
6
  var __export = (target, all) => {
9
7
  for (var name in all)
@@ -18,2959 +16,84 @@ var __copyProps = (to, from, except, desc) => {
18
16
  return to;
19
17
  };
20
18
  var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
21
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
22
- // If the importer is in node compatibility mode or this is not an ESM
23
- // file that has been converted to a CommonJS file using a Babel-
24
- // compatible transform (i.e. "__esModule" has not been set), then set
25
- // "default" to the CommonJS "module.exports" for node compatibility.
26
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
27
- mod
28
- ));
29
19
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
30
20
  var node_exports = {};
31
21
  __export(node_exports, {
32
- AlertDialog: () => AlertDialog,
33
- AnchoredOverflow: () => AnchoredOverflow,
34
- Avatar: () => Avatar,
35
- BUTTON_GROUP_NAME: () => BUTTON_GROUP_NAME,
36
- Breadcrumb: () => Breadcrumb,
37
- Button: () => Button,
38
- ButtonGroup: () => ButtonGroup,
39
- Clipboard: () => Clipboard,
40
- ContextMenu: () => ContextMenu2,
41
- DensityContext: () => DensityContext,
42
- DensityProvider: () => DensityProvider,
43
- Dialog: () => Dialog,
44
- DropdownMenu: () => DropdownMenu,
45
- ElevationContext: () => ElevationContext,
46
- ElevationProvider: () => ElevationProvider,
47
- Icon: () => Icon,
48
- IconButton: () => IconButton,
49
- Input: () => Input,
50
- LIST_ITEM_NAME: () => import_react_list.LIST_ITEM_NAME,
51
- LIST_NAME: () => import_react_list.LIST_NAME,
52
- Link: () => Link,
53
- List: () => List,
54
- ListItem: () => ListItem,
55
- Main: () => Main,
56
- Message: () => Message,
57
- Popover: () => Popover,
58
- ScrollArea: () => ScrollArea,
59
- Select: () => Select,
60
- Separator: () => Separator4,
61
- Status: () => Status,
62
- Tag: () => Tag,
63
- ThemeContext: () => ThemeContext,
64
- ThemeProvider: () => ThemeProvider,
65
- Toast: () => Toast,
66
- Toggle: () => Toggle,
67
- ToggleGroup: () => ToggleGroup,
68
- ToggleGroupItem: () => ToggleGroupItem,
69
- Toolbar: () => Toolbar,
70
- Tooltip: () => Tooltip,
22
+ AlertDialog: () => import_chunk_KMS7RFL7.AlertDialog,
23
+ AnchoredOverflow: () => import_chunk_KMS7RFL7.AnchoredOverflow,
24
+ Avatar: () => import_chunk_KMS7RFL7.Avatar,
25
+ BUTTON_GROUP_NAME: () => import_chunk_KMS7RFL7.BUTTON_GROUP_NAME,
26
+ Breadcrumb: () => import_chunk_KMS7RFL7.Breadcrumb,
27
+ Button: () => import_chunk_KMS7RFL7.Button,
28
+ ButtonGroup: () => import_chunk_KMS7RFL7.ButtonGroup,
29
+ Clipboard: () => import_chunk_KMS7RFL7.Clipboard,
30
+ ContextMenu: () => import_chunk_KMS7RFL7.ContextMenu,
31
+ DensityContext: () => import_chunk_KMS7RFL7.DensityContext,
32
+ DensityProvider: () => import_chunk_KMS7RFL7.DensityProvider,
33
+ Dialog: () => import_chunk_KMS7RFL7.Dialog,
34
+ DropdownMenu: () => import_chunk_KMS7RFL7.DropdownMenu,
35
+ ElevationContext: () => import_chunk_KMS7RFL7.ElevationContext,
36
+ ElevationProvider: () => import_chunk_KMS7RFL7.ElevationProvider,
37
+ Icon: () => import_chunk_KMS7RFL7.Icon,
38
+ IconButton: () => import_chunk_KMS7RFL7.IconButton,
39
+ Input: () => import_chunk_KMS7RFL7.Input,
40
+ LIST_ITEM_NAME: () => import_chunk_KMS7RFL7.LIST_ITEM_NAME,
41
+ LIST_NAME: () => import_chunk_KMS7RFL7.LIST_NAME,
42
+ Link: () => import_chunk_KMS7RFL7.Link,
43
+ List: () => import_chunk_KMS7RFL7.List,
44
+ ListItem: () => import_chunk_KMS7RFL7.ListItem,
45
+ Main: () => import_chunk_KMS7RFL7.Main,
46
+ Message: () => import_chunk_KMS7RFL7.Message,
47
+ Popover: () => import_chunk_KMS7RFL7.Popover,
48
+ ScrollArea: () => import_chunk_KMS7RFL7.ScrollArea,
49
+ Select: () => import_chunk_KMS7RFL7.Select,
50
+ Separator: () => import_chunk_KMS7RFL7.Separator,
51
+ Status: () => import_chunk_KMS7RFL7.Status,
52
+ Tag: () => import_chunk_KMS7RFL7.Tag,
53
+ ThemeContext: () => import_chunk_KMS7RFL7.ThemeContext,
54
+ ThemeProvider: () => import_chunk_KMS7RFL7.ThemeProvider,
55
+ Toast: () => import_chunk_KMS7RFL7.Toast,
56
+ Toggle: () => import_chunk_KMS7RFL7.Toggle,
57
+ ToggleGroup: () => import_chunk_KMS7RFL7.ToggleGroup,
58
+ ToggleGroupItem: () => import_chunk_KMS7RFL7.ToggleGroupItem,
59
+ Toolbar: () => import_chunk_KMS7RFL7.Toolbar,
60
+ Tooltip: () => import_chunk_KMS7RFL7.Tooltip,
71
61
  Trans: () => import_react_i18next.Trans,
72
- Tree: () => Tree,
73
- TreeItem: () => TreeItem,
74
- Treegrid: () => Treegrid,
75
- createDropdownMenuScope: () => createDropdownMenuScope,
76
- createPopoverScope: () => createPopoverScope,
77
- hasIosKeyboard: () => hasIosKeyboard,
78
- initialSafeArea: () => initialSafeArea,
79
- isLabel: () => isLabel,
80
- toLocalizedString: () => toLocalizedString,
81
- useAvatarContext: () => useAvatarContext,
82
- useButtonGroupContext: () => useButtonGroupContext,
83
- useClipboard: () => useClipboard,
84
- useDensityContext: () => useDensityContext,
85
- useDropdownMenuContext: () => useDropdownMenuContext,
86
- useDropdownMenuMenuScope: () => useDropdownMenuMenuScope,
87
- useElevationContext: () => useElevationContext,
88
- useIconHref: () => useIconHref,
89
- useLandmarkMover: () => useLandmarkMover,
90
- useListContext: () => import_react_list.useListContext,
91
- useListItemContext: () => import_react_list.useListItemContext,
92
- useMainContext: () => useMainContext,
93
- useSafeArea: () => useSafeArea,
94
- useSidebars: () => useSidebars,
95
- useThemeContext: () => useThemeContext,
96
- useTranslation: () => useTranslation,
97
- useTranslationsContext: () => useTranslationsContext,
98
- useVisualViewport: () => useVisualViewport
62
+ Tree: () => import_chunk_KMS7RFL7.Tree,
63
+ TreeItem: () => import_chunk_KMS7RFL7.TreeItem,
64
+ Treegrid: () => import_chunk_KMS7RFL7.Treegrid,
65
+ createDropdownMenuScope: () => import_chunk_KMS7RFL7.createDropdownMenuScope,
66
+ createPopoverScope: () => import_chunk_KMS7RFL7.createPopoverScope,
67
+ createTooltipScope: () => import_chunk_KMS7RFL7.createTooltipScope,
68
+ hasIosKeyboard: () => import_chunk_KMS7RFL7.hasIosKeyboard,
69
+ initialSafeArea: () => import_chunk_KMS7RFL7.initialSafeArea,
70
+ isLabel: () => import_chunk_KMS7RFL7.isLabel,
71
+ toLocalizedString: () => import_chunk_KMS7RFL7.toLocalizedString,
72
+ useAvatarContext: () => import_chunk_KMS7RFL7.useAvatarContext,
73
+ useButtonGroupContext: () => import_chunk_KMS7RFL7.useButtonGroupContext,
74
+ useClipboard: () => import_chunk_KMS7RFL7.useClipboard,
75
+ useDensityContext: () => import_chunk_KMS7RFL7.useDensityContext,
76
+ useDropdownMenuContext: () => import_chunk_KMS7RFL7.useDropdownMenuContext,
77
+ useDropdownMenuMenuScope: () => import_chunk_KMS7RFL7.useDropdownMenuMenuScope,
78
+ useElevationContext: () => import_chunk_KMS7RFL7.useElevationContext,
79
+ useIconHref: () => import_chunk_KMS7RFL7.useIconHref,
80
+ useLandmarkMover: () => import_chunk_KMS7RFL7.useLandmarkMover,
81
+ useListContext: () => import_chunk_KMS7RFL7.useListContext,
82
+ useListItemContext: () => import_chunk_KMS7RFL7.useListItemContext,
83
+ useMainContext: () => import_chunk_KMS7RFL7.useMainContext,
84
+ useSafeArea: () => import_chunk_KMS7RFL7.useSafeArea,
85
+ useSidebars: () => import_chunk_KMS7RFL7.useSidebars,
86
+ useThemeContext: () => import_chunk_KMS7RFL7.useThemeContext,
87
+ useTooltipContext: () => import_chunk_KMS7RFL7.useTooltipContext,
88
+ useTranslation: () => import_chunk_KMS7RFL7.useTranslation,
89
+ useTranslationsContext: () => import_chunk_KMS7RFL7.useTranslationsContext,
90
+ useVisualViewport: () => import_chunk_KMS7RFL7.useVisualViewport
99
91
  });
100
92
  module.exports = __toCommonJS(node_exports);
93
+ var import_chunk_KMS7RFL7 = require("./chunk-KMS7RFL7.cjs");
101
94
  var import_react_i18next = require("react-i18next");
102
95
  __reExport(node_exports, require("@dxos/react-hooks"), module.exports);
103
96
  __reExport(node_exports, require("@dxos/react-ui-types"), module.exports);
104
- var import_react_primitive = require("@radix-ui/react-primitive");
105
- var import_react_slot = require("@radix-ui/react-slot");
106
- var import_react = __toESM(require("react"));
107
- var import_react2 = require("react");
108
- var import_react3 = require("react");
109
- var import_react4 = require("react");
110
- var import_debug = require("@dxos/debug");
111
- var import_react5 = require("react");
112
- var import_react_hooks = require("@dxos/react-hooks");
113
- var import_react6 = require("react");
114
- var import_locale = require("date-fns/locale");
115
- var import_i18next = __toESM(require("i18next"));
116
- var import_react7 = __toESM(require("react"));
117
- var import_react_i18next2 = require("react-i18next");
118
- var import_react8 = require("react");
119
- var import_react_hooks2 = require("@dxos/react-hooks");
120
- var import_dx_avatar = require("@dxos/lit-ui/dx-avatar.pcss");
121
- var import_react9 = require("@lit/react");
122
- var import_react_context = require("@radix-ui/react-context");
123
- var import_react_primitive2 = require("@radix-ui/react-primitive");
124
- var import_react_slot2 = require("@radix-ui/react-slot");
125
- var import_react10 = __toESM(require("react"));
126
- var import_lit_ui = require("@dxos/lit-ui");
127
- var import_react_hooks3 = require("@dxos/react-hooks");
128
- var import_react_ui_theme = require("@dxos/react-ui-theme");
129
- var import_react11 = require("@phosphor-icons/react");
130
- var import_react_primitive3 = require("@radix-ui/react-primitive");
131
- var import_react_slot3 = require("@radix-ui/react-slot");
132
- var import_react12 = __toESM(require("react"));
133
- var import_react_primitive4 = require("@radix-ui/react-primitive");
134
- var import_react_slot4 = require("@radix-ui/react-slot");
135
- var import_react13 = __toESM(require("react"));
136
- var import_react_context2 = require("@radix-ui/react-context");
137
- var import_react_primitive5 = require("@radix-ui/react-primitive");
138
- var import_react_slot5 = require("@radix-ui/react-slot");
139
- var import_react14 = __toESM(require("react"));
140
- var import_react15 = __toESM(require("react"));
141
- var import_react16 = __toESM(require("react"));
142
- var import_react_tooltip = require("@radix-ui/react-tooltip");
143
- var import_react17 = __toESM(require("react"));
144
- var import_react18 = require("react");
145
- var import_react_toggle = require("@radix-ui/react-toggle");
146
- var import_react19 = __toESM(require("react"));
147
- var import_react_toggle_group = require("@radix-ui/react-toggle-group");
148
- var import_react20 = __toESM(require("react"));
149
- var import_react21 = __toESM(require("react"));
150
- var import_react22 = __toESM(require("react"));
151
- var import_react_ui_theme2 = require("@dxos/react-ui-theme");
152
- var import_keyborg = require("keyborg");
153
- var import_react23 = __toESM(require("react"));
154
- var import_react24 = __toESM(require("react"));
155
- var import_react25 = __toESM(require("react"));
156
- var import_react_context3 = require("@radix-ui/react-context");
157
- var import_react_dialog = require("@radix-ui/react-dialog");
158
- var import_react26 = __toESM(require("react"));
159
- var import_react_alert_dialog = require("@radix-ui/react-alert-dialog");
160
- var import_react_context4 = require("@radix-ui/react-context");
161
- var import_react27 = __toESM(require("react"));
162
- var ContextMenuPrimitive = __toESM(require("@radix-ui/react-context-menu"));
163
- var import_react_primitive6 = require("@radix-ui/react-primitive");
164
- var import_react_slot6 = require("@radix-ui/react-slot");
165
- var import_react28 = __toESM(require("react"));
166
- var import_primitive = require("@radix-ui/primitive");
167
- var import_react_compose_refs = require("@radix-ui/react-compose-refs");
168
- var import_react_context5 = require("@radix-ui/react-context");
169
- var import_react_id = require("@radix-ui/react-id");
170
- var MenuPrimitive = __toESM(require("@radix-ui/react-menu"));
171
- var import_react_menu = require("@radix-ui/react-menu");
172
- var import_react_primitive7 = require("@radix-ui/react-primitive");
173
- var import_react_slot7 = require("@radix-ui/react-slot");
174
- var import_react_use_controllable_state = require("@radix-ui/react-use-controllable-state");
175
- var import_react29 = __toESM(require("react"));
176
- var import_react_checkbox = require("@radix-ui/react-checkbox");
177
- var import_react_use_controllable_state2 = require("@radix-ui/react-use-controllable-state");
178
- var import_react30 = __toESM(require("react"));
179
- var import_react_input = require("@dxos/react-input");
180
- var import_react_ui_theme3 = require("@dxos/react-ui-theme");
181
- var import_react31 = require("@phosphor-icons/react");
182
- var import_react_slot8 = require("@radix-ui/react-slot");
183
- var import_react32 = __toESM(require("react"));
184
- var import_react_list = require("@dxos/react-list");
185
- var import_react33 = __toESM(require("react"));
186
- var import_react34 = __toESM(require("react"));
187
- var import_react35 = __toESM(require("react"));
188
- var import_react_tabster = require("@fluentui/react-tabster");
189
- var import_react_context6 = require("@radix-ui/react-context");
190
- var import_react_primitive8 = require("@radix-ui/react-primitive");
191
- var import_react_slot9 = require("@radix-ui/react-slot");
192
- var import_react_use_controllable_state3 = require("@radix-ui/react-use-controllable-state");
193
- var import_react36 = __toESM(require("react"));
194
- var import_react_context7 = require("@radix-ui/react-context");
195
- var import_react_dialog2 = require("@radix-ui/react-dialog");
196
- var import_react_primitive9 = require("@radix-ui/react-primitive");
197
- var import_react_slot10 = require("@radix-ui/react-slot");
198
- var import_react_use_controllable_state4 = require("@radix-ui/react-use-controllable-state");
199
- var import_react37 = __toESM(require("react"));
200
- var import_log = require("@dxos/log");
201
- var import_react_hooks4 = require("@dxos/react-hooks");
202
- var import_react38 = require("react");
203
- var import_react_context8 = require("@radix-ui/react-context");
204
- var import_react_primitive10 = require("@radix-ui/react-primitive");
205
- var import_react_slot11 = require("@radix-ui/react-slot");
206
- var import_react39 = __toESM(require("react"));
207
- var import_react_hooks5 = require("@dxos/react-hooks");
208
- var import_primitive2 = require("@radix-ui/primitive");
209
- var import_react_compose_refs2 = require("@radix-ui/react-compose-refs");
210
- var import_react_context9 = require("@radix-ui/react-context");
211
- var import_react_dismissable_layer = require("@radix-ui/react-dismissable-layer");
212
- var import_react_focus_guards = require("@radix-ui/react-focus-guards");
213
- var import_react_focus_scope = require("@radix-ui/react-focus-scope");
214
- var import_react_id2 = require("@radix-ui/react-id");
215
- var PopperPrimitive = __toESM(require("@radix-ui/react-popper"));
216
- var import_react_popper = require("@radix-ui/react-popper");
217
- var import_react_portal = require("@radix-ui/react-portal");
218
- var import_react_presence = require("@radix-ui/react-presence");
219
- var import_react_primitive11 = require("@radix-ui/react-primitive");
220
- var import_react_slot12 = require("@radix-ui/react-slot");
221
- var import_react_use_controllable_state5 = require("@radix-ui/react-use-controllable-state");
222
- var import_aria_hidden = require("aria-hidden");
223
- var import_react40 = __toESM(require("react"));
224
- var import_react_remove_scroll = require("react-remove-scroll");
225
- var import_react41 = __toESM(require("react"));
226
- var import_react_scroll_area = require("@radix-ui/react-scroll-area");
227
- var import_react42 = __toESM(require("react"));
228
- var import_react43 = require("@phosphor-icons/react");
229
- var SelectPrimitive = __toESM(require("@radix-ui/react-select"));
230
- var import_react44 = __toESM(require("react"));
231
- var import_react_separator = require("@radix-ui/react-separator");
232
- var import_react45 = __toESM(require("react"));
233
- var import_react_primitive12 = require("@radix-ui/react-primitive");
234
- var import_react_slot13 = require("@radix-ui/react-slot");
235
- var import_react46 = __toESM(require("react"));
236
- var import_react_primitive13 = require("@radix-ui/react-primitive");
237
- var import_react_slot14 = require("@radix-ui/react-slot");
238
- var import_react_toast = require("@radix-ui/react-toast");
239
- var import_react47 = __toESM(require("react"));
240
- var ToolbarPrimitive = __toESM(require("@radix-ui/react-toolbar"));
241
- var import_react48 = __toESM(require("react"));
242
- var useDensityContext = (propsDensity) => {
243
- const { density } = (0, import_react2.useContext)(DensityContext);
244
- return propsDensity ?? density;
245
- };
246
- var useElevationContext = (propsElevation) => {
247
- const { elevation } = (0, import_react3.useContext)(ElevationContext);
248
- return propsElevation ?? elevation;
249
- };
250
- var useThemeContext = () => (0, import_react4.useContext)(ThemeContext) ?? (0, import_debug.raise)(new Error("Missing ThemeContext"));
251
- var ICONS_URL = "/icons.svg";
252
- var useIconHref = (icon) => {
253
- const { noCache } = useThemeContext();
254
- const url = noCache ? `${ICONS_URL}?nocache=${(/* @__PURE__ */ new Date()).getMinutes()}` : ICONS_URL;
255
- return icon ? `${url}#${icon}` : void 0;
256
- };
257
- var initialSafeArea = {
258
- top: NaN,
259
- right: NaN,
260
- bottom: NaN,
261
- left: NaN
262
- };
263
- var useSafeArea = () => {
264
- const [padding, setPadding] = (0, import_react5.useState)(initialSafeArea);
265
- const handleResize = (0, import_react5.useCallback)(() => {
266
- setPadding({
267
- top: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-top")),
268
- right: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-right")),
269
- bottom: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-bottom")),
270
- left: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-left"))
271
- });
272
- }, []);
273
- (0, import_react_hooks.useResize)(handleResize);
274
- return padding;
275
- };
276
- var initialLng = "en-US";
277
- var initialNs = "dxos-common";
278
- var initialDtLocale = import_locale.enUS;
279
- var isLabel = (o) => typeof o === "string" || Array.isArray(o) && o.length === 2 && typeof o[0] === "string" && !!o[1] && typeof o[1] === "object" && "ns" in o[1] && typeof o[1].ns === "string";
280
- var toLocalizedString = (label, t) => Array.isArray(label) ? t(...label) : label;
281
- var resources = {
282
- [initialLng]: {
283
- [initialNs]: {
284
- "loading translations": "Loading translations\u2026"
285
- }
286
- }
287
- };
288
- void import_i18next.default.use(import_react_i18next2.initReactI18next).init({
289
- resources,
290
- lng: initialLng,
291
- defaultNS: initialNs,
292
- interpolation: {
293
- escapeValue: false
294
- }
295
- });
296
- var TranslationsContext = /* @__PURE__ */ (0, import_react7.createContext)({
297
- appNs: initialNs,
298
- dtLocale: initialDtLocale
299
- });
300
- var useTranslation = (...args) => {
301
- const result = (0, import_react_i18next2.useTranslation)(...args);
302
- const { dtLocale } = (0, import_react7.useContext)(TranslationsContext);
303
- return {
304
- ...result,
305
- dtLocale
306
- };
307
- };
308
- var TranslationsProvider = ({ fallback, resourceExtensions, children, appNs, dtLocale }) => {
309
- const [loaded, setLoaded] = (0, import_react7.useState)(false);
310
- (0, import_react7.useEffect)(() => {
311
- setLoaded(false);
312
- if (resourceExtensions && resourceExtensions.length) {
313
- resourceExtensions.forEach((resource) => {
314
- Object.keys(resource).forEach((language) => {
315
- Object.keys(resource[language]).forEach((ns) => {
316
- import_i18next.default.addResourceBundle(language, ns, resource[language][ns]);
317
- });
318
- });
319
- });
320
- }
321
- setLoaded(true);
322
- }, [
323
- resourceExtensions
324
- ]);
325
- return /* @__PURE__ */ import_react7.default.createElement(TranslationsContext.Provider, {
326
- value: {
327
- appNs: appNs ?? initialNs,
328
- dtLocale: dtLocale ?? initialDtLocale
329
- }
330
- }, /* @__PURE__ */ import_react7.default.createElement(import_react7.Suspense, {
331
- fallback
332
- }, loaded ? children : fallback));
333
- };
334
- var useTranslationsContext = () => (0, import_react6.useContext)(TranslationsContext);
335
- var useVisualViewport = (deps) => {
336
- const [width, setWidth] = (0, import_react8.useState)(null);
337
- const [height, setHeight] = (0, import_react8.useState)(null);
338
- const handleResize = (0, import_react8.useCallback)(() => {
339
- if (window.visualViewport) {
340
- setWidth(window.visualViewport.width);
341
- setHeight(window.visualViewport.height);
342
- }
343
- }, []);
344
- (0, import_react_hooks2.useResize)(handleResize);
345
- return {
346
- width,
347
- height
348
- };
349
- };
350
- var AnchoredOverflowRoot = /* @__PURE__ */ (0, import_react.forwardRef)(({ asChild, classNames, children, ...props }, forwardedRef) => {
351
- const { tx } = useThemeContext();
352
- const Root5 = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.div;
353
- return /* @__PURE__ */ import_react.default.createElement(Root5, {
354
- role: "none",
355
- ...props,
356
- className: tx("anchoredOverflow.root", "overflow-anchored", {}, classNames),
357
- ref: forwardedRef
358
- }, children);
359
- });
360
- var AnchoredOverflowAnchor = /* @__PURE__ */ (0, import_react.forwardRef)(({ asChild, classNames, children, ...props }, forwardedRef) => {
361
- const { tx } = useThemeContext();
362
- const Root5 = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.div;
363
- return /* @__PURE__ */ import_react.default.createElement(Root5, {
364
- role: "none",
365
- ...props,
366
- className: tx("anchoredOverflow.anchor", "overflow-anchor", {}, classNames),
367
- ref: forwardedRef
368
- }, children);
369
- });
370
- var AnchoredOverflow = {
371
- Root: AnchoredOverflowRoot,
372
- Anchor: AnchoredOverflowAnchor
373
- };
374
- var AVATAR_NAME = "Avatar";
375
- var [AvatarProvider, useAvatarContext] = (0, import_react_context.createContext)(AVATAR_NAME);
376
- var AvatarRoot = ({ children, labelId: propsLabelId, descriptionId: propsDescriptionId }) => {
377
- const labelId = (0, import_react_hooks3.useId)("avatar__label", propsLabelId);
378
- const descriptionId = (0, import_react_hooks3.useId)("avatar__description", propsDescriptionId);
379
- return /* @__PURE__ */ import_react10.default.createElement(AvatarProvider, {
380
- labelId,
381
- descriptionId
382
- }, children);
383
- };
384
- var DxAvatar = (0, import_react9.createComponent)({
385
- tagName: "dx-avatar",
386
- elementClass: import_lit_ui.DxAvatar,
387
- react: import_react10.default
388
- });
389
- var AvatarContent = ({ icon, classNames, ...props }) => {
390
- const href = useIconHref(icon);
391
- const { labelId, descriptionId } = useAvatarContext("AvatarContent");
392
- return /* @__PURE__ */ import_react10.default.createElement(DxAvatar, {
393
- ...props,
394
- icon: href,
395
- labelId,
396
- "aria-describedby": descriptionId,
397
- rootClassName: (0, import_react_ui_theme.mx)(classNames)
398
- });
399
- };
400
- var AvatarLabel = /* @__PURE__ */ (0, import_react10.forwardRef)(({ asChild, srOnly, classNames, ...props }, forwardedRef) => {
401
- const Root5 = asChild ? import_react_slot2.Slot : import_react_primitive2.Primitive.span;
402
- const { tx } = useThemeContext();
403
- const { labelId } = useAvatarContext("AvatarLabel");
404
- return /* @__PURE__ */ import_react10.default.createElement(Root5, {
405
- ...props,
406
- id: labelId,
407
- ref: forwardedRef,
408
- className: tx("avatar.label", "avatar__label", {
409
- srOnly
410
- }, classNames)
411
- });
412
- });
413
- var AvatarDescription = /* @__PURE__ */ (0, import_react10.forwardRef)(({ asChild, srOnly, classNames, ...props }, forwardedRef) => {
414
- const Root5 = asChild ? import_react_slot2.Slot : import_react_primitive2.Primitive.span;
415
- const { tx } = useThemeContext();
416
- const { descriptionId } = useAvatarContext("AvatarDescription");
417
- return /* @__PURE__ */ import_react10.default.createElement(Root5, {
418
- ...props,
419
- id: descriptionId,
420
- ref: forwardedRef,
421
- className: tx("avatar.description", "avatar__description", {
422
- srOnly
423
- }, classNames)
424
- });
425
- });
426
- var Avatar = {
427
- Root: AvatarRoot,
428
- Content: AvatarContent,
429
- Label: AvatarLabel,
430
- Description: AvatarDescription
431
- };
432
- var Link = /* @__PURE__ */ (0, import_react13.forwardRef)(({ asChild, variant, classNames, ...props }, forwardedRef) => {
433
- const { tx } = useThemeContext();
434
- const Root5 = asChild ? import_react_slot4.Slot : import_react_primitive4.Primitive.a;
435
- return /* @__PURE__ */ import_react13.default.createElement(Root5, {
436
- ...props,
437
- className: tx("link.root", "link", {
438
- variant
439
- }, classNames),
440
- ref: forwardedRef
441
- });
442
- });
443
- var BreadcrumbRoot = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
444
- const { tx } = useThemeContext();
445
- const Root5 = asChild ? import_react_slot3.Slot : import_react_primitive3.Primitive.div;
446
- return /* @__PURE__ */ import_react12.default.createElement(Root5, {
447
- role: "navigation",
448
- ...props,
449
- className: tx("breadcrumb.root", "breadcrumb", {}, classNames),
450
- ref: forwardedRef
451
- });
452
- });
453
- var BreadcrumbList = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
454
- const { tx } = useThemeContext();
455
- const Root5 = asChild ? import_react_slot3.Slot : import_react_primitive3.Primitive.ol;
456
- return /* @__PURE__ */ import_react12.default.createElement(Root5, {
457
- role: "list",
458
- ...props,
459
- className: tx("breadcrumb.list", "breadcrumb__list", {}, classNames),
460
- ref: forwardedRef
461
- });
462
- });
463
- var BreadcrumbListItem = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
464
- const { tx } = useThemeContext();
465
- const Root5 = asChild ? import_react_slot3.Slot : import_react_primitive3.Primitive.li;
466
- return /* @__PURE__ */ import_react12.default.createElement(Root5, {
467
- role: "listitem",
468
- ...props,
469
- className: tx("breadcrumb.listItem", "breadcrumb__list__item", {}, classNames),
470
- ref: forwardedRef
471
- });
472
- });
473
- var BreadcrumbLink = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, ...props }, forwardedRef) => {
474
- const Root5 = asChild ? import_react_slot3.Slot : Link;
475
- return /* @__PURE__ */ import_react12.default.createElement(Root5, {
476
- ...props,
477
- ref: forwardedRef
478
- });
479
- });
480
- var BreadcrumbCurrent = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
481
- const { tx } = useThemeContext();
482
- const Root5 = asChild ? import_react_slot3.Slot : "h1";
483
- return /* @__PURE__ */ import_react12.default.createElement(Root5, {
484
- ...props,
485
- "aria-current": "page",
486
- className: tx("breadcrumb.current", "breadcrumb__item__heading--current", {}, classNames),
487
- ref: forwardedRef
488
- });
489
- });
490
- var BreadcrumbSeparator = ({ children, classNames, ...props }) => {
491
- const { tx } = useThemeContext();
492
- return /* @__PURE__ */ import_react12.default.createElement(import_react_primitive3.Primitive.span, {
493
- role: "separator",
494
- "aria-hidden": "true",
495
- ...props,
496
- className: tx("breadcrumb.separator", "breadcrumb__separator", {}, classNames)
497
- }, children ?? /* @__PURE__ */ import_react12.default.createElement(import_react11.Dot, {
498
- weight: "bold"
499
- }));
500
- };
501
- var Breadcrumb = {
502
- Root: BreadcrumbRoot,
503
- List: BreadcrumbList,
504
- ListItem: BreadcrumbListItem,
505
- Link: BreadcrumbLink,
506
- Current: BreadcrumbCurrent,
507
- Separator: BreadcrumbSeparator
508
- };
509
- var BUTTON_GROUP_NAME = "ButtonGroup";
510
- var BUTTON_NAME = "Button";
511
- var [ButtonGroupProvider, useButtonGroupContext] = (0, import_react_context2.createContext)(BUTTON_GROUP_NAME, {
512
- inGroup: false
513
- });
514
- var Button = /* @__PURE__ */ (0, import_react14.memo)(/* @__PURE__ */ (0, import_react14.forwardRef)(({ classNames, children, density: propsDensity, elevation: propsElevation, variant = "default", asChild, ...props }, ref) => {
515
- const { inGroup } = useButtonGroupContext(BUTTON_NAME);
516
- const { tx } = useThemeContext();
517
- const elevation = useElevationContext(propsElevation);
518
- const density = useDensityContext(propsDensity);
519
- const Root5 = asChild ? import_react_slot5.Slot : import_react_primitive5.Primitive.button;
520
- return /* @__PURE__ */ import_react14.default.createElement(Root5, {
521
- ref,
522
- ...props,
523
- "data-variant": variant,
524
- "data-density": density,
525
- "data-props": inGroup ? "grouped" : "",
526
- className: tx("button.root", "button", {
527
- variant,
528
- inGroup,
529
- disabled: props.disabled,
530
- density,
531
- elevation
532
- }, classNames),
533
- ...props.disabled && {
534
- disabled: true
535
- }
536
- }, children);
537
- }));
538
- Button.displayName = BUTTON_NAME;
539
- var ButtonGroup = /* @__PURE__ */ (0, import_react14.forwardRef)(({ children, elevation: propsElevation, classNames, asChild, ...props }, forwardedRef) => {
540
- const { tx } = useThemeContext();
541
- const elevation = useElevationContext(propsElevation);
542
- const Root5 = asChild ? import_react_slot5.Slot : import_react_primitive5.Primitive.div;
543
- return /* @__PURE__ */ import_react14.default.createElement(Root5, {
544
- role: "none",
545
- ...props,
546
- className: tx("button.group", "button-group", {
547
- elevation
548
- }, classNames),
549
- ref: forwardedRef
550
- }, /* @__PURE__ */ import_react14.default.createElement(ButtonGroupProvider, {
551
- inGroup: true
552
- }, children));
553
- });
554
- ButtonGroup.displayName = BUTTON_GROUP_NAME;
555
- var Icon = /* @__PURE__ */ (0, import_react16.memo)(/* @__PURE__ */ (0, import_react16.forwardRef)(({ icon, classNames, size, ...props }, forwardedRef) => {
556
- const { tx } = useThemeContext();
557
- const href = useIconHref(icon);
558
- return /* @__PURE__ */ import_react16.default.createElement("svg", {
559
- ...props,
560
- className: tx("icon.root", "icon", {
561
- size
562
- }, classNames),
563
- ref: forwardedRef
564
- }, /* @__PURE__ */ import_react16.default.createElement("use", {
565
- href
566
- }));
567
- }));
568
- var propIsNumber = (prop) => Number.isFinite(prop);
569
- var propsIsRecord = (prop) => !!(prop && typeof prop === "object");
570
- var safePadding = (propsPadding, safePadding2, side) => {
571
- return (propIsNumber(safePadding2[side]) ? safePadding2[side] : 0) + (propIsNumber(propsPadding) ? propsPadding : propsIsRecord(propsPadding) ? propsPadding[side] ?? 0 : 0);
572
- };
573
- var useSafeCollisionPadding = (collisionPadding) => {
574
- const { safeAreaPadding } = useThemeContext();
575
- return (0, import_react18.useMemo)(() => ({
576
- top: safePadding(collisionPadding, safeAreaPadding, "top"),
577
- right: safePadding(collisionPadding, safeAreaPadding, "right"),
578
- bottom: safePadding(collisionPadding, safeAreaPadding, "bottom"),
579
- left: safePadding(collisionPadding, safeAreaPadding, "left")
580
- }), [
581
- collisionPadding,
582
- safeAreaPadding
583
- ]);
584
- };
585
- var TooltipProvider = import_react_tooltip.Provider;
586
- var TooltipRoot = import_react_tooltip.Root;
587
- var TooltipPortal = import_react_tooltip.TooltipPortal;
588
- var TooltipTrigger = import_react_tooltip.TooltipTrigger;
589
- var TooltipArrow = /* @__PURE__ */ (0, import_react17.forwardRef)(({ classNames, ...props }, forwardedRef) => {
590
- const { tx } = useThemeContext();
591
- return /* @__PURE__ */ import_react17.default.createElement(import_react_tooltip.TooltipArrow, {
592
- ...props,
593
- className: tx("tooltip.arrow", "tooltip__arrow", {}, classNames),
594
- ref: forwardedRef
595
- });
596
- });
597
- var TooltipContent = /* @__PURE__ */ (0, import_react17.forwardRef)(({ classNames, collisionPadding = 8, ...props }, forwardedRef) => {
598
- const { tx } = useThemeContext();
599
- const elevation = useElevationContext();
600
- const safeCollisionPadding = useSafeCollisionPadding(collisionPadding);
601
- return /* @__PURE__ */ import_react17.default.createElement(import_react_tooltip.TooltipContent, {
602
- sideOffset: 4,
603
- ...props,
604
- collisionPadding: safeCollisionPadding,
605
- className: tx("tooltip.content", "tooltip", {
606
- elevation
607
- }, classNames),
608
- ref: forwardedRef
609
- });
610
- });
611
- var Tooltip = {
612
- Provider: TooltipProvider,
613
- Root: TooltipRoot,
614
- Portal: TooltipPortal,
615
- Trigger: TooltipTrigger,
616
- Arrow: TooltipArrow,
617
- Content: TooltipContent
618
- };
619
- var IconOnlyButton = /* @__PURE__ */ (0, import_react15.forwardRef)(({ noTooltip, tooltipPortal = true, tooltipZIndex: zIndex, tooltipSide, suppressNextTooltip, ...props }, forwardedRef) => {
620
- const [triggerTooltipOpen, setTriggerTooltipOpen] = (0, import_react15.useState)(false);
621
- if (noTooltip) {
622
- return /* @__PURE__ */ import_react15.default.createElement(LabelledIconButton, {
623
- ...props,
624
- ref: forwardedRef
625
- });
626
- }
627
- const content = /* @__PURE__ */ import_react15.default.createElement(Tooltip.Content, {
628
- ...zIndex && {
629
- style: {
630
- zIndex
631
- }
632
- },
633
- side: tooltipSide
634
- }, props.label, /* @__PURE__ */ import_react15.default.createElement(Tooltip.Arrow, null));
635
- return /* @__PURE__ */ import_react15.default.createElement(Tooltip.Root, {
636
- open: triggerTooltipOpen,
637
- onOpenChange: (nextOpen) => {
638
- if (suppressNextTooltip?.current) {
639
- setTriggerTooltipOpen(false);
640
- suppressNextTooltip.current = false;
641
- } else {
642
- setTriggerTooltipOpen(nextOpen);
643
- }
644
- }
645
- }, /* @__PURE__ */ import_react15.default.createElement(Tooltip.Trigger, {
646
- asChild: true
647
- }, /* @__PURE__ */ import_react15.default.createElement(LabelledIconButton, {
648
- ...props,
649
- ref: forwardedRef
650
- })), tooltipPortal ? /* @__PURE__ */ import_react15.default.createElement(Tooltip.Portal, null, content) : content);
651
- });
652
- var LabelledIconButton = /* @__PURE__ */ (0, import_react15.forwardRef)(({ icon, size, iconOnly, label, classNames, iconClassNames, caretDown, suppressNextTooltip, ...props }, forwardedRef) => {
653
- const { tx } = useThemeContext();
654
- return /* @__PURE__ */ import_react15.default.createElement(Button, {
655
- ...props,
656
- classNames: tx("iconButton.root", "iconButton", {}, classNames),
657
- ref: forwardedRef
658
- }, /* @__PURE__ */ import_react15.default.createElement(Icon, {
659
- icon,
660
- size,
661
- classNames: iconClassNames
662
- }), /* @__PURE__ */ import_react15.default.createElement("span", {
663
- className: iconOnly ? "sr-only" : void 0
664
- }, label), caretDown && /* @__PURE__ */ import_react15.default.createElement(Icon, {
665
- size: 3,
666
- icon: "ph--caret-down--bold"
667
- }));
668
- });
669
- var IconButton = /* @__PURE__ */ (0, import_react15.forwardRef)((props, forwardedRef) => props.iconOnly ? /* @__PURE__ */ import_react15.default.createElement(IconOnlyButton, {
670
- ...props,
671
- ref: forwardedRef
672
- }) : /* @__PURE__ */ import_react15.default.createElement(LabelledIconButton, {
673
- ...props,
674
- ref: forwardedRef
675
- }));
676
- var Toggle = /* @__PURE__ */ (0, import_react19.forwardRef)(({ defaultPressed, pressed, onPressedChange, ...props }, forwardedRef) => {
677
- return /* @__PURE__ */ import_react19.default.createElement(import_react_toggle.Toggle, {
678
- defaultPressed,
679
- pressed,
680
- onPressedChange,
681
- asChild: true
682
- }, /* @__PURE__ */ import_react19.default.createElement(Button, {
683
- ...props,
684
- ref: forwardedRef
685
- }));
686
- });
687
- var ToggleGroup = /* @__PURE__ */ (0, import_react20.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
688
- return /* @__PURE__ */ import_react20.default.createElement(import_react_toggle_group.ToggleGroup, {
689
- ...props,
690
- asChild: true
691
- }, /* @__PURE__ */ import_react20.default.createElement(ButtonGroup, {
692
- classNames,
693
- children,
694
- ref: forwardedRef
695
- }));
696
- });
697
- var ToggleGroupItem = /* @__PURE__ */ (0, import_react20.forwardRef)(({ variant, elevation, density, classNames, children, ...props }, forwardedRef) => {
698
- return /* @__PURE__ */ import_react20.default.createElement(import_react_toggle_group.ToggleGroupItem, {
699
- ...props,
700
- asChild: true
701
- }, /* @__PURE__ */ import_react20.default.createElement(Button, {
702
- variant,
703
- elevation,
704
- density,
705
- classNames,
706
- children,
707
- ref: forwardedRef
708
- }));
709
- });
710
- var ClipboardContext = /* @__PURE__ */ (0, import_react21.createContext)({
711
- textValue: "",
712
- setTextValue: async (_) => {
713
- }
714
- });
715
- var useClipboard = () => (0, import_react21.useContext)(ClipboardContext);
716
- var ClipboardProvider = ({ children }) => {
717
- const [textValue, setInternalTextValue] = (0, import_react21.useState)("");
718
- const setTextValue = (0, import_react21.useCallback)(async (nextValue) => {
719
- await navigator.clipboard.writeText(nextValue);
720
- return setInternalTextValue(nextValue);
721
- }, []);
722
- return /* @__PURE__ */ import_react21.default.createElement(ClipboardContext.Provider, {
723
- value: {
724
- textValue,
725
- setTextValue
726
- }
727
- }, children);
728
- };
729
- var hasIosKeyboard = () => {
730
- return !!navigator.userAgent.match(/iP(ad|od|hone).+Safari/);
731
- };
732
- var DensityContext = /* @__PURE__ */ (0, import_react24.createContext)({
733
- density: "fine"
734
- });
735
- var DensityProvider = ({ density, children }) => /* @__PURE__ */ import_react24.default.createElement(DensityContext.Provider, {
736
- value: {
737
- density
738
- }
739
- }, children);
740
- var ElevationContext = /* @__PURE__ */ (0, import_react25.createContext)({
741
- elevation: "base"
742
- });
743
- var ElevationProvider = ({ elevation, children }) => /* @__PURE__ */ import_react25.default.createElement(ElevationContext.Provider, {
744
- value: {
745
- elevation
746
- }
747
- }, children);
748
- var ThemeContext = /* @__PURE__ */ (0, import_react23.createContext)(void 0);
749
- var ThemeProvider = ({ children, fallback = null, resourceExtensions, appNs, tx = (_path, defaultClassName, _styleProps, ..._options) => defaultClassName, themeMode = "dark", rootDensity = "fine", ...rest }) => {
750
- (0, import_react23.useEffect)(() => {
751
- if (document.defaultView) {
752
- const kb = (0, import_keyborg.createKeyborg)(document.defaultView);
753
- kb.subscribe(handleInputModalityChange);
754
- return () => kb.unsubscribe(handleInputModalityChange);
755
- }
756
- }, []);
757
- const safeAreaPadding = useSafeArea();
758
- const contextValue = (0, import_react23.useMemo)(() => ({
759
- tx,
760
- themeMode,
761
- hasIosKeyboard: hasIosKeyboard(),
762
- safeAreaPadding,
763
- ...rest
764
- }), [
765
- tx,
766
- themeMode,
767
- safeAreaPadding,
768
- rest
769
- ]);
770
- return /* @__PURE__ */ import_react23.default.createElement(ThemeContext.Provider, {
771
- value: contextValue
772
- }, /* @__PURE__ */ import_react23.default.createElement(TranslationsProvider, {
773
- fallback,
774
- resourceExtensions,
775
- appNs
776
- }, /* @__PURE__ */ import_react23.default.createElement(ElevationProvider, {
777
- elevation: "base"
778
- }, /* @__PURE__ */ import_react23.default.createElement(DensityProvider, {
779
- density: rootDensity
780
- }, children))));
781
- };
782
- var handleInputModalityChange = (isUsingKeyboard) => {
783
- if (isUsingKeyboard) {
784
- document.body.setAttribute("data-is-keyboard", "true");
785
- } else {
786
- document.body.removeAttribute("data-is-keyboard");
787
- }
788
- };
789
- var inactiveLabelStyles = "invisible bs-px -mbe-px overflow-hidden";
790
- var CopyButton = ({ value, classNames, iconProps, ...props }) => {
791
- const { t } = useTranslation("os");
792
- const { textValue, setTextValue } = useClipboard();
793
- const isCopied = textValue === value;
794
- return /* @__PURE__ */ import_react22.default.createElement(Button, {
795
- ...props,
796
- classNames: [
797
- "inline-flex flex-col justify-center",
798
- classNames
799
- ],
800
- onClick: () => setTextValue(value),
801
- "data-testid": "copy-invitation"
802
- }, /* @__PURE__ */ import_react22.default.createElement("div", {
803
- role: "none",
804
- className: (0, import_react_ui_theme2.mx)("flex gap-1 items-center", isCopied && inactiveLabelStyles)
805
- }, /* @__PURE__ */ import_react22.default.createElement("span", {
806
- className: "pli-1"
807
- }, t("copy label")), /* @__PURE__ */ import_react22.default.createElement(Icon, {
808
- icon: "ph--copy--regular",
809
- size: 5,
810
- ...iconProps
811
- })), /* @__PURE__ */ import_react22.default.createElement("div", {
812
- role: "none",
813
- className: (0, import_react_ui_theme2.mx)("flex gap-1 items-center", !isCopied && inactiveLabelStyles)
814
- }, /* @__PURE__ */ import_react22.default.createElement("span", {
815
- className: "pli-1"
816
- }, t("copy success label")), /* @__PURE__ */ import_react22.default.createElement(Icon, {
817
- icon: "ph--check--regular",
818
- size: 5,
819
- ...iconProps
820
- })));
821
- };
822
- var CopyButtonIconOnly = ({ value, classNames, iconProps, variant, ...props }) => {
823
- const { t } = useTranslation("os");
824
- const { textValue, setTextValue } = useClipboard();
825
- const isCopied = textValue === value;
826
- const label = isCopied ? t("copy success label") : props.label ?? t("copy label");
827
- const [open, setOpen] = (0, import_react22.useState)(false);
828
- return /* @__PURE__ */ import_react22.default.createElement(Tooltip.Root, {
829
- delayDuration: 1500,
830
- open,
831
- onOpenChange: setOpen
832
- }, /* @__PURE__ */ import_react22.default.createElement(Tooltip.Portal, null, /* @__PURE__ */ import_react22.default.createElement(Tooltip.Content, {
833
- side: "bottom",
834
- sideOffset: 12
835
- }, /* @__PURE__ */ import_react22.default.createElement("span", null, label), /* @__PURE__ */ import_react22.default.createElement(Tooltip.Arrow, null))), /* @__PURE__ */ import_react22.default.createElement(Tooltip.Trigger, {
836
- "aria-label": label,
837
- ...props,
838
- onClick: () => setTextValue(value).then(() => setOpen(true)),
839
- "data-testid": "copy-invitation",
840
- asChild: true
841
- }, /* @__PURE__ */ import_react22.default.createElement(Button, {
842
- variant,
843
- classNames: [
844
- "inline-flex flex-col justify-center",
845
- classNames
846
- ]
847
- }, /* @__PURE__ */ import_react22.default.createElement(Icon, {
848
- icon: "ph--copy--regular",
849
- size: 5,
850
- ...iconProps
851
- }))));
852
- };
853
- var Clipboard = {
854
- Button: CopyButton,
855
- IconButton: CopyButtonIconOnly,
856
- Provider: ClipboardProvider
857
- };
858
- var DialogRoot = (props) => /* @__PURE__ */ import_react26.default.createElement(ElevationProvider, {
859
- elevation: "dialog"
860
- }, /* @__PURE__ */ import_react26.default.createElement(import_react_dialog.Root, props));
861
- var DialogTrigger = import_react_dialog.DialogTrigger;
862
- var DialogPortal = import_react_dialog.DialogPortal;
863
- var DialogTitle = /* @__PURE__ */ (0, import_react26.forwardRef)(({ classNames, srOnly, ...props }, forwardedRef) => {
864
- const { tx } = useThemeContext();
865
- return /* @__PURE__ */ import_react26.default.createElement(import_react_dialog.DialogTitle, {
866
- ...props,
867
- className: tx("dialog.title", "dialog__title", {
868
- srOnly
869
- }, classNames),
870
- ref: forwardedRef
871
- });
872
- });
873
- var DialogDescription = /* @__PURE__ */ (0, import_react26.forwardRef)(({ classNames, srOnly, ...props }, forwardedRef) => {
874
- const { tx } = useThemeContext();
875
- return /* @__PURE__ */ import_react26.default.createElement(import_react_dialog.DialogDescription, {
876
- ...props,
877
- className: tx("dialog.description", "dialog__description", {
878
- srOnly
879
- }, classNames),
880
- ref: forwardedRef
881
- });
882
- });
883
- var DialogClose = import_react_dialog.DialogClose;
884
- var DIALOG_OVERLAY_NAME = "DialogOverlay";
885
- var DIALOG_CONTENT_NAME = "DialogContent";
886
- var [OverlayLayoutProvider, useOverlayLayoutContext] = (0, import_react_context3.createContext)(DIALOG_OVERLAY_NAME, {
887
- inOverlayLayout: false
888
- });
889
- var DialogOverlay = /* @__PURE__ */ (0, import_react26.forwardRef)(({ classNames, children, blockAlign, ...props }, forwardedRef) => {
890
- const { tx } = useThemeContext();
891
- return /* @__PURE__ */ import_react26.default.createElement(import_react_dialog.DialogOverlay, {
892
- ...props,
893
- className: tx("dialog.overlay", "dialog__overlay", {}, classNames),
894
- ref: forwardedRef,
895
- "data-block-align": blockAlign
896
- }, /* @__PURE__ */ import_react26.default.createElement(OverlayLayoutProvider, {
897
- inOverlayLayout: true
898
- }, children));
899
- });
900
- DialogOverlay.displayName = DIALOG_OVERLAY_NAME;
901
- var DialogContent = /* @__PURE__ */ (0, import_react26.forwardRef)(({ classNames, children, inOverlayLayout: propsInOverlayLayout, ...props }, forwardedRef) => {
902
- const { tx } = useThemeContext();
903
- const { inOverlayLayout } = useOverlayLayoutContext(DIALOG_CONTENT_NAME);
904
- return /* @__PURE__ */ import_react26.default.createElement(import_react_dialog.DialogContent, {
905
- ...props,
906
- className: tx("dialog.content", "dialog", {
907
- inOverlayLayout: propsInOverlayLayout || inOverlayLayout
908
- }, classNames),
909
- ref: forwardedRef
910
- }, children);
911
- });
912
- DialogContent.displayName = DIALOG_CONTENT_NAME;
913
- var Dialog = {
914
- Root: DialogRoot,
915
- Trigger: DialogTrigger,
916
- Portal: DialogPortal,
917
- Overlay: DialogOverlay,
918
- Content: DialogContent,
919
- Title: DialogTitle,
920
- Description: DialogDescription,
921
- Close: DialogClose
922
- };
923
- var AlertDialogRoot = (props) => /* @__PURE__ */ import_react27.default.createElement(ElevationProvider, {
924
- elevation: "dialog"
925
- }, /* @__PURE__ */ import_react27.default.createElement(import_react_alert_dialog.Root, props));
926
- var AlertDialogTrigger = import_react_alert_dialog.AlertDialogTrigger;
927
- var AlertDialogPortal = import_react_alert_dialog.AlertDialogPortal;
928
- var AlertDialogCancel = import_react_alert_dialog.AlertDialogCancel;
929
- var AlertDialogAction = import_react_alert_dialog.AlertDialogAction;
930
- var AlertDialogTitle = /* @__PURE__ */ (0, import_react27.forwardRef)(({ classNames, srOnly, ...props }, forwardedRef) => {
931
- const { tx } = useThemeContext();
932
- return /* @__PURE__ */ import_react27.default.createElement(import_react_alert_dialog.AlertDialogTitle, {
933
- ...props,
934
- className: tx("dialog.title", "dialog--alert__title", {
935
- srOnly
936
- }, classNames),
937
- ref: forwardedRef
938
- });
939
- });
940
- var AlertDialogDescription = /* @__PURE__ */ (0, import_react27.forwardRef)(({ classNames, srOnly, ...props }, forwardedRef) => {
941
- const { tx } = useThemeContext();
942
- return /* @__PURE__ */ import_react27.default.createElement(import_react_alert_dialog.AlertDialogDescription, {
943
- ...props,
944
- className: tx("dialog.description", "dialog--alert__description", {
945
- srOnly
946
- }, classNames),
947
- ref: forwardedRef
948
- });
949
- });
950
- var ALERT_DIALOG_OVERLAY_NAME = "AlertDialogOverlay";
951
- var ALERT_DIALOG_CONTENT_NAME = "AlertDialogContent";
952
- var [OverlayLayoutProvider2, useOverlayLayoutContext2] = (0, import_react_context4.createContext)(ALERT_DIALOG_OVERLAY_NAME, {
953
- inOverlayLayout: false
954
- });
955
- var AlertDialogOverlay = /* @__PURE__ */ (0, import_react27.forwardRef)(({ classNames, children, blockAlign, ...props }, forwardedRef) => {
956
- const { tx } = useThemeContext();
957
- return /* @__PURE__ */ import_react27.default.createElement(import_react_alert_dialog.AlertDialogOverlay, {
958
- ...props,
959
- className: tx("dialog.overlay", "dialog--alert__overlay", {}, classNames, "data-[block-align=start]:justify-center", "data-[block-align=start]:items-start", "data-[block-align=center]:place-content-center"),
960
- ref: forwardedRef,
961
- "data-block-align": blockAlign
962
- }, /* @__PURE__ */ import_react27.default.createElement(OverlayLayoutProvider2, {
963
- inOverlayLayout: true
964
- }, children));
965
- });
966
- AlertDialogOverlay.displayName = ALERT_DIALOG_OVERLAY_NAME;
967
- var AlertDialogContent = /* @__PURE__ */ (0, import_react27.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
968
- const { tx } = useThemeContext();
969
- const { inOverlayLayout } = useOverlayLayoutContext2(ALERT_DIALOG_CONTENT_NAME);
970
- return /* @__PURE__ */ import_react27.default.createElement(import_react_alert_dialog.AlertDialogContent, {
971
- ...props,
972
- className: tx("dialog.content", "dialog--alert", {
973
- inOverlayLayout
974
- }, classNames),
975
- ref: forwardedRef
976
- }, children);
977
- });
978
- AlertDialogContent.displayName = ALERT_DIALOG_CONTENT_NAME;
979
- var AlertDialog = {
980
- Root: AlertDialogRoot,
981
- Trigger: AlertDialogTrigger,
982
- Portal: AlertDialogPortal,
983
- Overlay: AlertDialogOverlay,
984
- Content: AlertDialogContent,
985
- Title: AlertDialogTitle,
986
- Description: AlertDialogDescription,
987
- Cancel: AlertDialogCancel,
988
- Action: AlertDialogAction
989
- };
990
- var ContextMenuRoot = ContextMenuPrimitive.ContextMenu;
991
- var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
992
- var ContextMenuPortal = ContextMenuPrimitive.Portal;
993
- var ContextMenuContent = /* @__PURE__ */ (0, import_react28.forwardRef)(({ classNames, children, collisionPadding = 8, ...props }, forwardedRef) => {
994
- const { tx } = useThemeContext();
995
- const elevation = useElevationContext();
996
- const safeCollisionPadding = useSafeCollisionPadding(collisionPadding);
997
- return /* @__PURE__ */ import_react28.default.createElement(ContextMenuPrimitive.Content, {
998
- ...props,
999
- collisionPadding: safeCollisionPadding,
1000
- className: tx("menu.content", "menu", {
1001
- elevation
1002
- }, classNames),
1003
- ref: forwardedRef
1004
- }, children);
1005
- });
1006
- var ContextMenuViewport = /* @__PURE__ */ (0, import_react28.forwardRef)(({ classNames, asChild, children, ...props }, forwardedRef) => {
1007
- const { tx } = useThemeContext();
1008
- const Root5 = asChild ? import_react_slot6.Slot : import_react_primitive6.Primitive.div;
1009
- return /* @__PURE__ */ import_react28.default.createElement(Root5, {
1010
- ...props,
1011
- className: tx("menu.viewport", "menu__viewport", {}, classNames),
1012
- ref: forwardedRef
1013
- }, children);
1014
- });
1015
- var ContextMenuArrow = /* @__PURE__ */ (0, import_react28.forwardRef)(({ classNames, ...props }, forwardedRef) => {
1016
- const { tx } = useThemeContext();
1017
- return /* @__PURE__ */ import_react28.default.createElement(ContextMenuPrimitive.Arrow, {
1018
- ...props,
1019
- className: tx("menu.arrow", "menu__arrow", {}, classNames),
1020
- ref: forwardedRef
1021
- });
1022
- });
1023
- var ContextMenuGroup = ContextMenuPrimitive.Group;
1024
- var ContextMenuItemIndicator = ContextMenuPrimitive.ItemIndicator;
1025
- var ContextMenuItem = /* @__PURE__ */ (0, import_react28.forwardRef)(({ classNames, ...props }, forwardedRef) => {
1026
- const { tx } = useThemeContext();
1027
- return /* @__PURE__ */ import_react28.default.createElement(ContextMenuPrimitive.Item, {
1028
- ...props,
1029
- className: tx("menu.item", "menu__item", {}, classNames),
1030
- ref: forwardedRef
1031
- });
1032
- });
1033
- var ContextMenuCheckboxItem = /* @__PURE__ */ (0, import_react28.forwardRef)(({ classNames, ...props }, forwardedRef) => {
1034
- const { tx } = useThemeContext();
1035
- return /* @__PURE__ */ import_react28.default.createElement(ContextMenuPrimitive.CheckboxItem, {
1036
- ...props,
1037
- className: tx("menu.item", "menu__item--checkbox", {}, classNames),
1038
- ref: forwardedRef
1039
- });
1040
- });
1041
- var ContextMenuSeparator = /* @__PURE__ */ (0, import_react28.forwardRef)(({ classNames, ...props }, forwardedRef) => {
1042
- const { tx } = useThemeContext();
1043
- return /* @__PURE__ */ import_react28.default.createElement(ContextMenuPrimitive.Separator, {
1044
- ...props,
1045
- className: tx("menu.separator", "menu__item", {}, classNames),
1046
- ref: forwardedRef
1047
- });
1048
- });
1049
- var ContextMenuGroupLabel = /* @__PURE__ */ (0, import_react28.forwardRef)(({ classNames, ...props }, forwardedRef) => {
1050
- const { tx } = useThemeContext();
1051
- return /* @__PURE__ */ import_react28.default.createElement(ContextMenuPrimitive.Label, {
1052
- ...props,
1053
- className: tx("menu.groupLabel", "menu__group__label", {}, classNames),
1054
- ref: forwardedRef
1055
- });
1056
- });
1057
- var ContextMenu2 = {
1058
- Root: ContextMenuRoot,
1059
- Trigger: ContextMenuTrigger,
1060
- Portal: ContextMenuPortal,
1061
- Content: ContextMenuContent,
1062
- Viewport: ContextMenuViewport,
1063
- Arrow: ContextMenuArrow,
1064
- Group: ContextMenuGroup,
1065
- Item: ContextMenuItem,
1066
- CheckboxItem: ContextMenuCheckboxItem,
1067
- ItemIndicator: ContextMenuItemIndicator,
1068
- Separator: ContextMenuSeparator,
1069
- GroupLabel: ContextMenuGroupLabel
1070
- };
1071
- var DROPDOWN_MENU_NAME = "DropdownMenu";
1072
- var [createDropdownMenuContext, createDropdownMenuScope] = (0, import_react_context5.createContextScope)(DROPDOWN_MENU_NAME, [
1073
- import_react_menu.createMenuScope
1074
- ]);
1075
- var useMenuScope = (0, import_react_menu.createMenuScope)();
1076
- var [DropdownMenuProvider, useDropdownMenuContext] = createDropdownMenuContext(DROPDOWN_MENU_NAME);
1077
- var DropdownMenuRoot = (props) => {
1078
- const { __scopeDropdownMenu, children, dir, open: openProp, defaultOpen, onOpenChange, modal = true } = props;
1079
- const menuScope = useMenuScope(__scopeDropdownMenu);
1080
- const triggerRef = (0, import_react29.useRef)(null);
1081
- const [open = false, setOpen] = (0, import_react_use_controllable_state.useControllableState)({
1082
- prop: openProp,
1083
- defaultProp: defaultOpen,
1084
- onChange: onOpenChange
1085
- });
1086
- return /* @__PURE__ */ import_react29.default.createElement(DropdownMenuProvider, {
1087
- scope: __scopeDropdownMenu,
1088
- triggerId: (0, import_react_id.useId)(),
1089
- triggerRef,
1090
- contentId: (0, import_react_id.useId)(),
1091
- open,
1092
- onOpenChange: setOpen,
1093
- onOpenToggle: (0, import_react29.useCallback)(() => setOpen((prevOpen) => !prevOpen), [
1094
- setOpen
1095
- ]),
1096
- modal
1097
- }, /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Root, {
1098
- ...menuScope,
1099
- open,
1100
- onOpenChange: setOpen,
1101
- dir,
1102
- modal
1103
- }, children));
1104
- };
1105
- DropdownMenuRoot.displayName = DROPDOWN_MENU_NAME;
1106
- var TRIGGER_NAME = "DropdownMenuTrigger";
1107
- var DropdownMenuTrigger = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1108
- const { __scopeDropdownMenu, disabled = false, ...triggerProps } = props;
1109
- const context = useDropdownMenuContext(TRIGGER_NAME, __scopeDropdownMenu);
1110
- const menuScope = useMenuScope(__scopeDropdownMenu);
1111
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Anchor, {
1112
- asChild: true,
1113
- ...menuScope
1114
- }, /* @__PURE__ */ import_react29.default.createElement(import_react_primitive7.Primitive.button, {
1115
- type: "button",
1116
- id: context.triggerId,
1117
- "aria-haspopup": "menu",
1118
- "aria-expanded": context.open,
1119
- "aria-controls": context.open ? context.contentId : void 0,
1120
- "data-state": context.open ? "open" : "closed",
1121
- "data-disabled": disabled ? "" : void 0,
1122
- disabled,
1123
- ...triggerProps,
1124
- ref: (0, import_react_compose_refs.composeRefs)(forwardedRef, context.triggerRef),
1125
- onPointerDown: (0, import_primitive.composeEventHandlers)(props.onPointerDown, (event) => {
1126
- if (!disabled && event.button === 0 && event.ctrlKey === false) {
1127
- context.onOpenToggle();
1128
- if (!context.open) {
1129
- event.preventDefault();
1130
- }
1131
- }
1132
- }),
1133
- onKeyDown: (0, import_primitive.composeEventHandlers)(props.onKeyDown, (event) => {
1134
- if (disabled) {
1135
- return;
1136
- }
1137
- if ([
1138
- "Enter",
1139
- " "
1140
- ].includes(event.key)) {
1141
- context.onOpenToggle();
1142
- }
1143
- if (event.key === "ArrowDown") {
1144
- context.onOpenChange(true);
1145
- }
1146
- if ([
1147
- "Enter",
1148
- " ",
1149
- "ArrowDown"
1150
- ].includes(event.key)) {
1151
- event.preventDefault();
1152
- }
1153
- })
1154
- }));
1155
- });
1156
- DropdownMenuTrigger.displayName = TRIGGER_NAME;
1157
- var VIRTUAL_TRIGGER_NAME = "DropdownMenuVirtualTrigger";
1158
- var DropdownMenuVirtualTrigger = (props) => {
1159
- const { __scopeDropdownMenu, virtualRef } = props;
1160
- const context = useDropdownMenuContext(VIRTUAL_TRIGGER_NAME, __scopeDropdownMenu);
1161
- const menuScope = useMenuScope(__scopeDropdownMenu);
1162
- (0, import_react29.useEffect)(() => {
1163
- if (virtualRef.current) {
1164
- context.triggerRef.current = virtualRef.current;
1165
- }
1166
- });
1167
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Anchor, {
1168
- ...menuScope,
1169
- virtualRef
1170
- });
1171
- };
1172
- DropdownMenuVirtualTrigger.displayName = VIRTUAL_TRIGGER_NAME;
1173
- var PORTAL_NAME = "DropdownMenuPortal";
1174
- var DropdownMenuPortal = (props) => {
1175
- const { __scopeDropdownMenu, ...portalProps } = props;
1176
- const menuScope = useMenuScope(__scopeDropdownMenu);
1177
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Portal, {
1178
- ...menuScope,
1179
- ...portalProps
1180
- });
1181
- };
1182
- DropdownMenuPortal.displayName = PORTAL_NAME;
1183
- var DropdownMenuViewport = /* @__PURE__ */ (0, import_react29.forwardRef)(({ classNames, asChild, children, ...props }, forwardedRef) => {
1184
- const { tx } = useThemeContext();
1185
- const Root5 = asChild ? import_react_slot7.Slot : import_react_primitive7.Primitive.div;
1186
- return /* @__PURE__ */ import_react29.default.createElement(Root5, {
1187
- ...props,
1188
- className: tx("menu.viewport", "menu__viewport", {}, classNames),
1189
- ref: forwardedRef
1190
- }, children);
1191
- });
1192
- var CONTENT_NAME = "DropdownMenuContent";
1193
- var DropdownMenuContent = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1194
- const { __scopeDropdownMenu, classNames, collisionPadding = 8, ...contentProps } = props;
1195
- const { tx } = useThemeContext();
1196
- const context = useDropdownMenuContext(CONTENT_NAME, __scopeDropdownMenu);
1197
- const elevation = useElevationContext();
1198
- const menuScope = useMenuScope(__scopeDropdownMenu);
1199
- const hasInteractedOutsideRef = (0, import_react29.useRef)(false);
1200
- const safeCollisionPadding = useSafeCollisionPadding(collisionPadding);
1201
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Content, {
1202
- id: context.contentId,
1203
- "aria-labelledby": context.triggerId,
1204
- ...menuScope,
1205
- ...contentProps,
1206
- collisionPadding: safeCollisionPadding,
1207
- ref: forwardedRef,
1208
- onCloseAutoFocus: (0, import_primitive.composeEventHandlers)(props.onCloseAutoFocus, (event) => {
1209
- if (!hasInteractedOutsideRef.current) {
1210
- context.triggerRef.current?.focus();
1211
- }
1212
- hasInteractedOutsideRef.current = false;
1213
- event.preventDefault();
1214
- }),
1215
- onInteractOutside: (0, import_primitive.composeEventHandlers)(props.onInteractOutside, (event) => {
1216
- const originalEvent = event.detail.originalEvent;
1217
- const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
1218
- const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
1219
- if (!context.modal || isRightClick) {
1220
- hasInteractedOutsideRef.current = true;
1221
- }
1222
- }),
1223
- className: tx("menu.content", "menu", {
1224
- elevation
1225
- }, classNames),
1226
- style: {
1227
- ...props.style,
1228
- // re-namespace exposed content custom properties
1229
- ...{
1230
- "--radix-dropdown-menu-content-transform-origin": "var(--radix-popper-transform-origin)",
1231
- "--radix-dropdown-menu-content-available-width": "var(--radix-popper-available-width)",
1232
- "--radix-dropdown-menu-content-available-height": "var(--radix-popper-available-height)",
1233
- "--radix-dropdown-menu-trigger-width": "var(--radix-popper-anchor-width)",
1234
- "--radix-dropdown-menu-trigger-height": "var(--radix-popper-anchor-height)"
1235
- }
1236
- }
1237
- });
1238
- });
1239
- DropdownMenuContent.displayName = CONTENT_NAME;
1240
- var GROUP_NAME = "DropdownMenuGroup";
1241
- var DropdownMenuGroup = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1242
- const { __scopeDropdownMenu, ...groupProps } = props;
1243
- const menuScope = useMenuScope(__scopeDropdownMenu);
1244
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Group, {
1245
- ...menuScope,
1246
- ...groupProps,
1247
- ref: forwardedRef
1248
- });
1249
- });
1250
- DropdownMenuGroup.displayName = GROUP_NAME;
1251
- var LABEL_NAME = "DropdownMenuLabel";
1252
- var DropdownMenuGroupLabel = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1253
- const { __scopeDropdownMenu, classNames, ...labelProps } = props;
1254
- const menuScope = useMenuScope(__scopeDropdownMenu);
1255
- const { tx } = useThemeContext();
1256
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Label, {
1257
- ...menuScope,
1258
- ...labelProps,
1259
- className: tx("menu.groupLabel", "menu__group__label", {}, classNames),
1260
- ref: forwardedRef
1261
- });
1262
- });
1263
- DropdownMenuGroupLabel.displayName = LABEL_NAME;
1264
- var ITEM_NAME = "DropdownMenuItem";
1265
- var DropdownMenuItem = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1266
- const { __scopeDropdownMenu, classNames, ...itemProps } = props;
1267
- const menuScope = useMenuScope(__scopeDropdownMenu);
1268
- const { tx } = useThemeContext();
1269
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Item, {
1270
- ...menuScope,
1271
- ...itemProps,
1272
- className: tx("menu.item", "menu__item", {}, classNames),
1273
- ref: forwardedRef
1274
- });
1275
- });
1276
- DropdownMenuItem.displayName = ITEM_NAME;
1277
- var CHECKBOX_ITEM_NAME = "DropdownMenuCheckboxItem";
1278
- var DropdownMenuCheckboxItem = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1279
- const { __scopeDropdownMenu, classNames, ...checkboxItemProps } = props;
1280
- const menuScope = useMenuScope(__scopeDropdownMenu);
1281
- const { tx } = useThemeContext();
1282
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.CheckboxItem, {
1283
- ...menuScope,
1284
- ...checkboxItemProps,
1285
- className: tx("menu.item", "menu__item--checkbox", {}, classNames),
1286
- ref: forwardedRef
1287
- });
1288
- });
1289
- DropdownMenuCheckboxItem.displayName = CHECKBOX_ITEM_NAME;
1290
- var RADIO_GROUP_NAME = "DropdownMenuRadioGroup";
1291
- var DropdownMenuRadioGroup = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1292
- const { __scopeDropdownMenu, ...radioGroupProps } = props;
1293
- const menuScope = useMenuScope(__scopeDropdownMenu);
1294
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.RadioGroup, {
1295
- ...menuScope,
1296
- ...radioGroupProps,
1297
- ref: forwardedRef
1298
- });
1299
- });
1300
- DropdownMenuRadioGroup.displayName = RADIO_GROUP_NAME;
1301
- var RADIO_ITEM_NAME = "DropdownMenuRadioItem";
1302
- var DropdownMenuRadioItem = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1303
- const { __scopeDropdownMenu, ...radioItemProps } = props;
1304
- const menuScope = useMenuScope(__scopeDropdownMenu);
1305
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.RadioItem, {
1306
- ...menuScope,
1307
- ...radioItemProps,
1308
- ref: forwardedRef
1309
- });
1310
- });
1311
- DropdownMenuRadioItem.displayName = RADIO_ITEM_NAME;
1312
- var INDICATOR_NAME = "DropdownMenuItemIndicator";
1313
- var DropdownMenuItemIndicator = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1314
- const { __scopeDropdownMenu, ...itemIndicatorProps } = props;
1315
- const menuScope = useMenuScope(__scopeDropdownMenu);
1316
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.ItemIndicator, {
1317
- ...menuScope,
1318
- ...itemIndicatorProps,
1319
- ref: forwardedRef
1320
- });
1321
- });
1322
- DropdownMenuItemIndicator.displayName = INDICATOR_NAME;
1323
- var SEPARATOR_NAME = "DropdownMenuSeparator";
1324
- var DropdownMenuSeparator = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1325
- const { __scopeDropdownMenu, classNames, ...separatorProps } = props;
1326
- const menuScope = useMenuScope(__scopeDropdownMenu);
1327
- const { tx } = useThemeContext();
1328
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Separator, {
1329
- ...menuScope,
1330
- ...separatorProps,
1331
- className: tx("menu.separator", "menu__item", {}, classNames),
1332
- ref: forwardedRef
1333
- });
1334
- });
1335
- DropdownMenuSeparator.displayName = SEPARATOR_NAME;
1336
- var ARROW_NAME = "DropdownMenuArrow";
1337
- var DropdownMenuArrow = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1338
- const { __scopeDropdownMenu, classNames, ...arrowProps } = props;
1339
- const menuScope = useMenuScope(__scopeDropdownMenu);
1340
- const { tx } = useThemeContext();
1341
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Arrow, {
1342
- ...menuScope,
1343
- ...arrowProps,
1344
- className: tx("menu.arrow", "menu__arrow", {}, classNames),
1345
- ref: forwardedRef
1346
- });
1347
- });
1348
- DropdownMenuArrow.displayName = ARROW_NAME;
1349
- var DropdownMenuSub = (props) => {
1350
- const { __scopeDropdownMenu, children, open: openProp, onOpenChange, defaultOpen } = props;
1351
- const menuScope = useMenuScope(__scopeDropdownMenu);
1352
- const [open = false, setOpen] = (0, import_react_use_controllable_state.useControllableState)({
1353
- prop: openProp,
1354
- defaultProp: defaultOpen,
1355
- onChange: onOpenChange
1356
- });
1357
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.Sub, {
1358
- ...menuScope,
1359
- open,
1360
- onOpenChange: setOpen
1361
- }, children);
1362
- };
1363
- var SUB_TRIGGER_NAME = "DropdownMenuSubTrigger";
1364
- var DropdownMenuSubTrigger = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1365
- const { __scopeDropdownMenu, ...subTriggerProps } = props;
1366
- const menuScope = useMenuScope(__scopeDropdownMenu);
1367
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.SubTrigger, {
1368
- ...menuScope,
1369
- ...subTriggerProps,
1370
- ref: forwardedRef
1371
- });
1372
- });
1373
- DropdownMenuSubTrigger.displayName = SUB_TRIGGER_NAME;
1374
- var SUB_CONTENT_NAME = "DropdownMenuSubContent";
1375
- var DropdownMenuSubContent = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
1376
- const { __scopeDropdownMenu, ...subContentProps } = props;
1377
- const menuScope = useMenuScope(__scopeDropdownMenu);
1378
- return /* @__PURE__ */ import_react29.default.createElement(MenuPrimitive.SubContent, {
1379
- ...menuScope,
1380
- ...subContentProps,
1381
- ref: forwardedRef,
1382
- style: {
1383
- ...props.style,
1384
- // re-namespace exposed content custom properties
1385
- ...{
1386
- "--radix-dropdown-menu-content-transform-origin": "var(--radix-popper-transform-origin)",
1387
- "--radix-dropdown-menu-content-available-width": "var(--radix-popper-available-width)",
1388
- "--radix-dropdown-menu-content-available-height": "var(--radix-popper-available-height)",
1389
- "--radix-dropdown-menu-trigger-width": "var(--radix-popper-anchor-width)",
1390
- "--radix-dropdown-menu-trigger-height": "var(--radix-popper-anchor-height)"
1391
- }
1392
- }
1393
- });
1394
- });
1395
- DropdownMenuSubContent.displayName = SUB_CONTENT_NAME;
1396
- var DropdownMenu = {
1397
- Root: DropdownMenuRoot,
1398
- Trigger: DropdownMenuTrigger,
1399
- VirtualTrigger: DropdownMenuVirtualTrigger,
1400
- Portal: DropdownMenuPortal,
1401
- Content: DropdownMenuContent,
1402
- Viewport: DropdownMenuViewport,
1403
- Group: DropdownMenuGroup,
1404
- GroupLabel: DropdownMenuGroupLabel,
1405
- Item: DropdownMenuItem,
1406
- CheckboxItem: DropdownMenuCheckboxItem,
1407
- RadioGroup: DropdownMenuRadioGroup,
1408
- RadioItem: DropdownMenuRadioItem,
1409
- ItemIndicator: DropdownMenuItemIndicator,
1410
- Separator: DropdownMenuSeparator,
1411
- Arrow: DropdownMenuArrow,
1412
- Sub: DropdownMenuSub,
1413
- SubTrigger: DropdownMenuSubTrigger,
1414
- SubContent: DropdownMenuSubContent
1415
- };
1416
- var useDropdownMenuMenuScope = useMenuScope;
1417
- var Label3 = /* @__PURE__ */ (0, import_react30.forwardRef)(({ srOnly, classNames, children, ...props }, forwardedRef) => {
1418
- const { tx } = useThemeContext();
1419
- return /* @__PURE__ */ import_react30.default.createElement(import_react_input.Label, {
1420
- ...props,
1421
- className: tx("input.label", "input__label", {
1422
- srOnly
1423
- }, classNames),
1424
- ref: forwardedRef
1425
- }, children);
1426
- });
1427
- var Description = /* @__PURE__ */ (0, import_react30.forwardRef)(({ srOnly, classNames, children, ...props }, forwardedRef) => {
1428
- const { tx } = useThemeContext();
1429
- return /* @__PURE__ */ import_react30.default.createElement(import_react_input.Description, {
1430
- ...props,
1431
- className: tx("input.description", "input__description", {
1432
- srOnly
1433
- }, classNames),
1434
- ref: forwardedRef
1435
- }, children);
1436
- });
1437
- var Validation = /* @__PURE__ */ (0, import_react30.forwardRef)(({ __inputScope, srOnly, classNames, children, ...props }, forwardedRef) => {
1438
- const { tx } = useThemeContext();
1439
- const { validationValence } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
1440
- return /* @__PURE__ */ import_react30.default.createElement(import_react_input.Validation, {
1441
- ...props,
1442
- className: tx("input.validation", `input__validation-message input__validation-message--${validationValence}`, {
1443
- srOnly,
1444
- validationValence
1445
- }, classNames),
1446
- ref: forwardedRef
1447
- }, children);
1448
- });
1449
- var DescriptionAndValidation = /* @__PURE__ */ (0, import_react30.forwardRef)(({ srOnly, classNames, children, ...props }, forwardedRef) => {
1450
- const { tx } = useThemeContext();
1451
- return /* @__PURE__ */ import_react30.default.createElement(import_react_input.DescriptionAndValidation, {
1452
- ...props,
1453
- className: tx("input.descriptionAndValidation", "input__description-and-validation", {
1454
- srOnly
1455
- }, classNames),
1456
- ref: forwardedRef
1457
- }, children);
1458
- });
1459
- var PinInput = /* @__PURE__ */ (0, import_react30.forwardRef)(({ density: propsDensity, elevation: propsElevation, segmentClassName: propsSegmentClassName, inputClassName, variant, ...props }, forwardedRef) => {
1460
- const { hasIosKeyboard: hasIosKeyboard2 } = useThemeContext();
1461
- const { tx } = useThemeContext();
1462
- const density = useDensityContext(propsDensity);
1463
- const elevation = useElevationContext(propsElevation);
1464
- const segmentClassName = (0, import_react30.useCallback)(({ focused, validationValence }) => tx("input.input", "input--pin-segment", {
1465
- variant: "static",
1466
- focused,
1467
- disabled: props.disabled,
1468
- density,
1469
- elevation,
1470
- validationValence
1471
- }, propsSegmentClassName), [
1472
- tx,
1473
- props.disabled,
1474
- elevation,
1475
- propsElevation,
1476
- density
1477
- ]);
1478
- return /* @__PURE__ */ import_react30.default.createElement(import_react_input.PinInput, {
1479
- ...props,
1480
- segmentClassName,
1481
- ...props.autoFocus && !hasIosKeyboard2 && {
1482
- autoFocus: true
1483
- },
1484
- inputClassName: tx("input.inputWithSegments", "input input--pin", {
1485
- disabled: props.disabled
1486
- }, inputClassName),
1487
- ref: forwardedRef
1488
- });
1489
- });
1490
- var TextInput = /* @__PURE__ */ (0, import_react30.forwardRef)(({ __inputScope, classNames, density: propsDensity, elevation: propsElevation, variant, ...props }, forwardedRef) => {
1491
- const { hasIosKeyboard: hasIosKeyboard2 } = useThemeContext();
1492
- const themeContextValue = useThemeContext();
1493
- const density = useDensityContext(propsDensity);
1494
- const elevation = useElevationContext(propsElevation);
1495
- const { validationValence } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
1496
- const { tx } = themeContextValue;
1497
- return /* @__PURE__ */ import_react30.default.createElement(import_react_input.TextInput, {
1498
- ...props,
1499
- className: tx("input.input", "input", {
1500
- variant,
1501
- disabled: props.disabled,
1502
- density,
1503
- elevation,
1504
- validationValence
1505
- }, classNames),
1506
- ...props.autoFocus && !hasIosKeyboard2 && {
1507
- autoFocus: true
1508
- },
1509
- ref: forwardedRef
1510
- });
1511
- });
1512
- var TextArea = /* @__PURE__ */ (0, import_react30.forwardRef)(({ __inputScope, classNames, density: propsDensity, elevation: propsElevation, variant, ...props }, forwardedRef) => {
1513
- const { hasIosKeyboard: hasIosKeyboard2 } = useThemeContext();
1514
- const { tx } = useThemeContext();
1515
- const density = useDensityContext(propsDensity);
1516
- const elevation = useElevationContext(propsElevation);
1517
- const { validationValence } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
1518
- return /* @__PURE__ */ import_react30.default.createElement(import_react_input.TextArea, {
1519
- ...props,
1520
- className: tx("input.input", "input--text-area", {
1521
- variant,
1522
- disabled: props.disabled,
1523
- density,
1524
- elevation,
1525
- validationValence
1526
- }, classNames),
1527
- ...props.autoFocus && !hasIosKeyboard2 && {
1528
- autoFocus: true
1529
- },
1530
- ref: forwardedRef
1531
- });
1532
- });
1533
- var Checkbox = /* @__PURE__ */ (0, import_react30.forwardRef)(({ __inputScope, checked: propsChecked, defaultChecked: propsDefaultChecked, onCheckedChange: propsOnCheckedChange, size, weight = "bold", classNames, ...props }, forwardedRef) => {
1534
- const [checked, onCheckedChange] = (0, import_react_use_controllable_state2.useControllableState)({
1535
- prop: propsChecked,
1536
- defaultProp: propsDefaultChecked,
1537
- onChange: propsOnCheckedChange
1538
- });
1539
- const { id, validationValence, descriptionId, errorMessageId } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
1540
- const { tx } = useThemeContext();
1541
- return /* @__PURE__ */ import_react30.default.createElement(import_react_checkbox.Root, {
1542
- ...props,
1543
- checked,
1544
- onCheckedChange,
1545
- id,
1546
- "aria-describedby": descriptionId,
1547
- ...validationValence === "error" && {
1548
- "aria-invalid": "true",
1549
- "aria-errormessage": errorMessageId
1550
- },
1551
- className: tx("input.checkbox", "input--checkbox", {
1552
- size
1553
- }, "shrink-0", classNames),
1554
- ref: forwardedRef
1555
- }, /* @__PURE__ */ import_react30.default.createElement(Icon, {
1556
- icon: checked === "indeterminate" ? "ph--minus--regular" : "ph--check--regular",
1557
- classNames: tx("input.checkboxIndicator", "input--checkbox__indicator", {
1558
- size,
1559
- checked
1560
- })
1561
- }));
1562
- });
1563
- var Switch = /* @__PURE__ */ (0, import_react30.forwardRef)(({ __inputScope, checked: propsChecked, defaultChecked: propsDefaultChecked, onCheckedChange: propsOnCheckedChange, classNames, ...props }, forwardedRef) => {
1564
- const [checked, onCheckedChange] = (0, import_react_use_controllable_state2.useControllableState)({
1565
- prop: propsChecked,
1566
- defaultProp: propsDefaultChecked ?? false,
1567
- onChange: propsOnCheckedChange
1568
- });
1569
- const { id, validationValence, descriptionId, errorMessageId } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
1570
- return /* @__PURE__ */ import_react30.default.createElement("input", {
1571
- type: "checkbox",
1572
- className: (0, import_react_ui_theme3.mx)("dx-checkbox--switch dx-focus-ring", classNames),
1573
- checked,
1574
- onChange: (event) => {
1575
- onCheckedChange(event.target.checked);
1576
- },
1577
- id,
1578
- "aria-describedby": descriptionId,
1579
- ...props,
1580
- ...validationValence === "error" && {
1581
- "aria-invalid": "true",
1582
- "aria-errormessage": errorMessageId
1583
- },
1584
- ref: forwardedRef
1585
- });
1586
- });
1587
- var Input = {
1588
- Root: import_react_input.InputRoot,
1589
- PinInput,
1590
- TextInput,
1591
- TextArea,
1592
- Checkbox,
1593
- Switch,
1594
- Label: Label3,
1595
- Description,
1596
- Validation,
1597
- DescriptionAndValidation
1598
- };
1599
- var edgeToOrientationMap = {
1600
- top: "horizontal",
1601
- bottom: "horizontal",
1602
- left: "vertical",
1603
- right: "vertical"
1604
- };
1605
- var orientationStyles = {
1606
- horizontal: "h-[--line-thickness] left-[calc(var(--line-inset)+var(--terminal-radius))] right-[--line-inset] before:left-[--terminal-inset]",
1607
- vertical: "w-[--line-thickness] top-[calc(var(--line-inset)+var(--terminal-radius))] bottom-[--line-inset] before:top-[--terminal-inset]"
1608
- };
1609
- var edgeStyles = {
1610
- top: "top-[--line-offset] before:top-[--offset-terminal]",
1611
- right: "right-[--line-offset] before:right-[--offset-terminal]",
1612
- bottom: "bottom-[--line-offset] before:bottom-[--offset-terminal]",
1613
- left: "left-[--line-offset] before:left-[--offset-terminal]"
1614
- };
1615
- var strokeSize = 2;
1616
- var terminalSize = 8;
1617
- var offsetToAlignTerminalWithLine = (strokeSize - terminalSize) / 2;
1618
- var ListDropIndicator = ({ edge, gap = 0, lineInset = 0, terminalInset = lineInset - terminalSize }) => {
1619
- const orientation = edgeToOrientationMap[edge];
1620
- return /* @__PURE__ */ import_react33.default.createElement("div", {
1621
- role: "none",
1622
- style: {
1623
- "--line-thickness": `${strokeSize}px`,
1624
- "--line-offset": `calc(-0.5 * (${gap}px + ${strokeSize}px))`,
1625
- "--line-inset": `${lineInset}px`,
1626
- "--terminal-size": `${terminalSize}px`,
1627
- "--terminal-radius": `${terminalSize / 2}px`,
1628
- "--terminal-inset": `${terminalInset}px`,
1629
- "--offset-terminal": `${offsetToAlignTerminalWithLine}px`
1630
- },
1631
- className: `absolute z-10 pointer-events-none bg-accentSurface before:content-[''] before:w-[--terminal-size] before:h-[--terminal-size] box-border before:absolute before:border-[length:--line-thickness] before:border-solid before:border-accentSurface before:rounded-full ${orientationStyles[orientation]} ${edgeStyles[edge]}`
1632
- });
1633
- };
1634
- var List = /* @__PURE__ */ (0, import_react32.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
1635
- const { tx } = useThemeContext();
1636
- const density = useDensityContext(props.density);
1637
- return /* @__PURE__ */ import_react32.default.createElement(DensityProvider, {
1638
- density
1639
- }, /* @__PURE__ */ import_react32.default.createElement(import_react_list.List, {
1640
- ...props,
1641
- className: tx("list.root", "list", {}, classNames),
1642
- ref: forwardedRef
1643
- }, children));
1644
- });
1645
- var ListItemEndcap = /* @__PURE__ */ (0, import_react32.forwardRef)(({ children, classNames, asChild, ...props }, forwardedRef) => {
1646
- const Root5 = asChild ? import_react_slot8.Slot : "div";
1647
- const density = useDensityContext();
1648
- const { tx } = useThemeContext();
1649
- return /* @__PURE__ */ import_react32.default.createElement(Root5, {
1650
- ...!asChild && {
1651
- role: "none"
1652
- },
1653
- ...props,
1654
- className: tx("list.item.endcap", "list__listItem__endcap", {
1655
- density
1656
- }, classNames),
1657
- ref: forwardedRef
1658
- }, children);
1659
- });
1660
- var MockListItemOpenTrigger = ({ classNames, ...props }) => {
1661
- const density = useDensityContext();
1662
- const { tx } = useThemeContext();
1663
- return /* @__PURE__ */ import_react32.default.createElement("div", {
1664
- role: "none",
1665
- ...props,
1666
- className: tx("list.item.openTrigger", "list__listItem__openTrigger--mock", {
1667
- density
1668
- }, classNames)
1669
- });
1670
- };
1671
- var ListItemHeading = /* @__PURE__ */ (0, import_react32.forwardRef)(({ children, classNames, ...props }, forwardedRef) => {
1672
- const { tx } = useThemeContext();
1673
- const density = useDensityContext();
1674
- return /* @__PURE__ */ import_react32.default.createElement(import_react_list.ListItemHeading, {
1675
- ...props,
1676
- className: tx("list.item.heading", "list__listItem__heading", {
1677
- density
1678
- }, classNames),
1679
- ref: forwardedRef
1680
- }, children);
1681
- });
1682
- var ListItemOpenTrigger = /* @__PURE__ */ (0, import_react32.forwardRef)(({ __listItemScope, classNames, children, ...props }, forwardedRef) => {
1683
- const { tx } = useThemeContext();
1684
- const density = useDensityContext();
1685
- const { open } = (0, import_react_list.useListItemContext)(import_react_list.LIST_ITEM_NAME, __listItemScope);
1686
- const Icon3 = open ? import_react31.CaretDown : import_react31.CaretRight;
1687
- return /* @__PURE__ */ import_react32.default.createElement(import_react_list.ListItemOpenTrigger, {
1688
- ...props,
1689
- className: tx("list.item.openTrigger", "list__listItem__openTrigger", {
1690
- density
1691
- }, classNames),
1692
- ref: forwardedRef
1693
- }, children || /* @__PURE__ */ import_react32.default.createElement(Icon3, {
1694
- weight: "bold",
1695
- className: tx("list.item.openTriggerIcon", "list__listItem__openTrigger__icon", {})
1696
- }));
1697
- });
1698
- var ListItemRoot = /* @__PURE__ */ (0, import_react32.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
1699
- const { tx } = useThemeContext();
1700
- const density = useDensityContext();
1701
- return /* @__PURE__ */ import_react32.default.createElement(import_react_list.ListItem, {
1702
- ...props,
1703
- className: tx("list.item.root", "list__listItem", {
1704
- density,
1705
- collapsible: props.collapsible
1706
- }, classNames),
1707
- ref: forwardedRef
1708
- }, children);
1709
- });
1710
- var ListItem = {
1711
- Root: ListItemRoot,
1712
- Endcap: ListItemEndcap,
1713
- Heading: ListItemHeading,
1714
- OpenTrigger: ListItemOpenTrigger,
1715
- CollapsibleContent: import_react_list.ListItemCollapsibleContent,
1716
- MockOpenTrigger: MockListItemOpenTrigger,
1717
- DropIndicator: ListDropIndicator
1718
- };
1719
- var edgeToOrientationMap2 = {
1720
- "reorder-above": "sibling",
1721
- "reorder-below": "sibling",
1722
- "make-child": "child",
1723
- reparent: "child"
1724
- };
1725
- var orientationStyles2 = {
1726
- // TODO(wittjosiah): Stop using left/right here.
1727
- sibling: "bs-[--line-thickness] left-[--horizontal-indent] right-0 bg-accentSurface before:left-[--negative-terminal-size]",
1728
- child: "is-full block-start-0 block-end-0 border-[length:--line-thickness] before:invisible"
1729
- };
1730
- var instructionStyles = {
1731
- "reorder-above": "block-start-[--line-offset] before:block-start-[--offset-terminal]",
1732
- "reorder-below": "block-end-[--line-offset] before:block-end-[--offset-terminal]",
1733
- "make-child": "border-accentSurface",
1734
- // TODO(wittjosiah): This is not occurring in the current implementation.
1735
- reparent: ""
1736
- };
1737
- var strokeSize2 = 2;
1738
- var terminalSize2 = 8;
1739
- var offsetToAlignTerminalWithLine2 = (strokeSize2 - terminalSize2) / 2;
1740
- var TreeDropIndicator = ({ instruction, gap = 0 }) => {
1741
- const lineOffset = `calc(-0.5 * (${gap}px + ${strokeSize2}px))`;
1742
- const isBlocked = instruction.type === "instruction-blocked";
1743
- const desiredInstruction = isBlocked ? instruction.desired : instruction;
1744
- const orientation = edgeToOrientationMap2[desiredInstruction.type];
1745
- if (isBlocked) {
1746
- return null;
1747
- }
1748
- return /* @__PURE__ */ import_react35.default.createElement("div", {
1749
- style: {
1750
- "--line-thickness": `${strokeSize2}px`,
1751
- "--line-offset": `${lineOffset}`,
1752
- "--terminal-size": `${terminalSize2}px`,
1753
- "--terminal-radius": `${terminalSize2 / 2}px`,
1754
- "--negative-terminal-size": `-${terminalSize2}px`,
1755
- "--offset-terminal": `${offsetToAlignTerminalWithLine2}px`,
1756
- "--horizontal-indent": `${desiredInstruction.currentLevel * desiredInstruction.indentPerLevel + 4}px`
1757
- },
1758
- className: `absolute z-10 pointer-events-none before:is-[--terminal-size] before:bs-[--terminal-size] box-border before:absolute before:border-[length:--line-thickness] before:border-solid before:border-accentSurface before:rounded-full ${orientationStyles2[orientation]} ${instructionStyles[desiredInstruction.type]}`
1759
- });
1760
- };
1761
- var TreeRoot = /* @__PURE__ */ (0, import_react34.forwardRef)((props, forwardedRef) => {
1762
- return /* @__PURE__ */ import_react34.default.createElement(List, {
1763
- ...props,
1764
- ref: forwardedRef
1765
- });
1766
- });
1767
- var TreeBranch = /* @__PURE__ */ (0, import_react34.forwardRef)(({ __listScope, ...props }, forwardedRef) => {
1768
- const { headingId } = (0, import_react_list.useListItemContext)(import_react_list.LIST_ITEM_NAME, __listScope);
1769
- return /* @__PURE__ */ import_react34.default.createElement(List, {
1770
- ...props,
1771
- "aria-labelledby": headingId,
1772
- ref: forwardedRef
1773
- });
1774
- });
1775
- var TreeItemRoot = /* @__PURE__ */ (0, import_react34.forwardRef)((props, forwardedRef) => {
1776
- return /* @__PURE__ */ import_react34.default.createElement(ListItem.Root, {
1777
- role: "treeitem",
1778
- ...props,
1779
- ref: forwardedRef
1780
- });
1781
- });
1782
- var TreeItemHeading = ListItem.Heading;
1783
- var TreeItemOpenTrigger = ListItem.OpenTrigger;
1784
- var MockTreeItemOpenTrigger = ListItem.MockOpenTrigger;
1785
- var TreeItemBody = ListItem.CollapsibleContent;
1786
- var Tree = {
1787
- Root: TreeRoot,
1788
- Branch: TreeBranch
1789
- };
1790
- var TreeItem = {
1791
- Root: TreeItemRoot,
1792
- Heading: TreeItemHeading,
1793
- Body: TreeItemBody,
1794
- OpenTrigger: TreeItemOpenTrigger,
1795
- MockOpenTrigger: MockTreeItemOpenTrigger,
1796
- DropIndicator: TreeDropIndicator
1797
- };
1798
- var TREEGRID_ROW_NAME = "TreegridRow";
1799
- var [createTreegridRowContext, createTreegridRowScope] = (0, import_react_context6.createContextScope)(TREEGRID_ROW_NAME, []);
1800
- var [TreegridRowProvider, useTreegridRowContext] = createTreegridRowContext(TREEGRID_ROW_NAME);
1801
- var PATH_SEPARATOR = "~";
1802
- var PARENT_OF_SEPARATOR = " ";
1803
- var TreegridRoot = /* @__PURE__ */ (0, import_react36.forwardRef)(({ asChild, classNames, children, style, gridTemplateColumns, ...props }, forwardedRef) => {
1804
- const { tx } = useThemeContext();
1805
- const Root5 = asChild ? import_react_slot9.Slot : import_react_primitive8.Primitive.div;
1806
- const arrowNavigationAttrs = (0, import_react_tabster.useArrowNavigationGroup)({
1807
- axis: "vertical",
1808
- tabbable: false,
1809
- circular: true
1810
- });
1811
- return /* @__PURE__ */ import_react36.default.createElement(Root5, {
1812
- role: "treegrid",
1813
- ...arrowNavigationAttrs,
1814
- ...props,
1815
- className: tx("treegrid.root", "treegrid", {}, classNames),
1816
- style: {
1817
- ...style,
1818
- gridTemplateColumns
1819
- },
1820
- ref: forwardedRef
1821
- }, children);
1822
- });
1823
- var TreegridRow = /* @__PURE__ */ (0, import_react36.forwardRef)(({ __treegridRowScope, asChild, classNames, children, id, parentOf, open: propsOpen, defaultOpen, onOpenChange: propsOnOpenChange, ...props }, forwardedRef) => {
1824
- const { tx } = useThemeContext();
1825
- const Root5 = asChild ? import_react_slot9.Slot : import_react_primitive8.Primitive.div;
1826
- const pathParts = id.split(PATH_SEPARATOR);
1827
- const level = pathParts.length - 1;
1828
- const [open, onOpenChange] = (0, import_react_use_controllable_state3.useControllableState)({
1829
- prop: propsOpen,
1830
- onChange: propsOnOpenChange,
1831
- defaultProp: defaultOpen
1832
- });
1833
- const focusableGroupAttrs = (0, import_react_tabster.useFocusableGroup)({
1834
- tabBehavior: "limited"
1835
- });
1836
- const arrowGroupAttrs = (0, import_react_tabster.useArrowNavigationGroup)({
1837
- axis: "horizontal",
1838
- tabbable: false,
1839
- circular: false,
1840
- memorizeCurrent: false
1841
- });
1842
- return /* @__PURE__ */ import_react36.default.createElement(TreegridRowProvider, {
1843
- open,
1844
- onOpenChange,
1845
- scope: __treegridRowScope
1846
- }, /* @__PURE__ */ import_react36.default.createElement(Root5, {
1847
- role: "row",
1848
- "aria-level": level,
1849
- className: tx("treegrid.row", "treegrid__row", {
1850
- level
1851
- }, classNames),
1852
- ...parentOf && {
1853
- "aria-expanded": open,
1854
- "aria-owns": parentOf
1855
- },
1856
- tabIndex: 0,
1857
- ...focusableGroupAttrs,
1858
- ...props,
1859
- id,
1860
- ref: forwardedRef
1861
- }, /* @__PURE__ */ import_react36.default.createElement("div", {
1862
- role: "none",
1863
- className: "contents",
1864
- ...arrowGroupAttrs
1865
- }, children)));
1866
- });
1867
- var TreegridCell = /* @__PURE__ */ (0, import_react36.forwardRef)(({ classNames, children, indent, ...props }, forwardedRef) => {
1868
- const { tx } = useThemeContext();
1869
- return /* @__PURE__ */ import_react36.default.createElement("div", {
1870
- role: "gridcell",
1871
- className: tx("treegrid.cell", "treegrid__cell", {
1872
- indent
1873
- }, classNames),
1874
- ...props,
1875
- ref: forwardedRef
1876
- }, children);
1877
- });
1878
- var Treegrid = {
1879
- Root: TreegridRoot,
1880
- Row: TreegridRow,
1881
- Cell: TreegridCell,
1882
- PARENT_OF_SEPARATOR,
1883
- PATH_SEPARATOR,
1884
- createTreegridRowScope,
1885
- useTreegridRowContext
1886
- };
1887
- var MotionState;
1888
- (function(MotionState2) {
1889
- MotionState2[MotionState2["IDLE"] = 0] = "IDLE";
1890
- MotionState2[MotionState2["DEBOUNCING"] = 1] = "DEBOUNCING";
1891
- MotionState2[MotionState2["FOLLOWING"] = 2] = "FOLLOWING";
1892
- })(MotionState || (MotionState = {}));
1893
- var useSwipeToDismiss = (ref, {
1894
- onDismiss,
1895
- dismissThreshold = 64,
1896
- debounceThreshold = 8,
1897
- offset = 0
1898
- /* side = 'inline-start' */
1899
- }) => {
1900
- const $root = ref.current;
1901
- const [motionState, setMotionState] = (0, import_react38.useState)(0);
1902
- const [gestureStartX, setGestureStartX] = (0, import_react38.useState)(0);
1903
- const setIdle = (0, import_react38.useCallback)(() => {
1904
- setMotionState(0);
1905
- $root?.style.removeProperty("inset-inline-start");
1906
- $root?.style.setProperty("transition-duration", "200ms");
1907
- }, [
1908
- $root
1909
- ]);
1910
- const setFollowing = (0, import_react38.useCallback)(() => {
1911
- setMotionState(2);
1912
- $root?.style.setProperty("transition-duration", "0ms");
1913
- }, [
1914
- $root
1915
- ]);
1916
- const handlePointerDown = (0, import_react38.useCallback)(({ screenX }) => {
1917
- if (motionState === 0) {
1918
- setMotionState(1);
1919
- setGestureStartX(screenX);
1920
- }
1921
- }, [
1922
- motionState
1923
- ]);
1924
- const handlePointerMove = (0, import_react38.useCallback)(({ screenX }) => {
1925
- if ($root) {
1926
- const delta = Math.min(screenX - gestureStartX, 0);
1927
- switch (motionState) {
1928
- case 2:
1929
- if (Math.abs(delta) > dismissThreshold) {
1930
- setIdle();
1931
- onDismiss?.();
1932
- } else {
1933
- $root.style.setProperty("inset-inline-start", `${offset + delta}px`);
1934
- }
1935
- break;
1936
- case 1:
1937
- if (Math.abs(delta) > debounceThreshold) {
1938
- setFollowing();
1939
- }
1940
- break;
1941
- }
1942
- }
1943
- }, [
1944
- $root,
1945
- motionState,
1946
- gestureStartX
1947
- ]);
1948
- const handlePointerUp = (0, import_react38.useCallback)(() => {
1949
- setIdle();
1950
- }, [
1951
- setIdle
1952
- ]);
1953
- (0, import_react38.useEffect)(() => {
1954
- $root?.addEventListener("pointerdown", handlePointerDown);
1955
- return () => {
1956
- $root?.removeEventListener("pointerdown", handlePointerDown);
1957
- };
1958
- }, [
1959
- $root,
1960
- handlePointerDown
1961
- ]);
1962
- (0, import_react38.useEffect)(() => {
1963
- $root && document.documentElement.addEventListener("pointermove", handlePointerMove);
1964
- return () => {
1965
- document.documentElement.removeEventListener("pointermove", handlePointerMove);
1966
- };
1967
- }, [
1968
- $root,
1969
- handlePointerMove
1970
- ]);
1971
- (0, import_react38.useEffect)(() => {
1972
- $root && document.documentElement.addEventListener("pointerup", handlePointerUp);
1973
- return () => {
1974
- document.documentElement.removeEventListener("pointerup", handlePointerUp);
1975
- };
1976
- }, [
1977
- $root,
1978
- handlePointerUp
1979
- ]);
1980
- };
1981
- var __dxlog_file = "/home/runner/work/dxos/dxos/packages/ui/react-ui/src/components/Main/Main.tsx";
1982
- var MAIN_ROOT_NAME = "MainRoot";
1983
- var NAVIGATION_SIDEBAR_NAME = "NavigationSidebar";
1984
- var COMPLEMENTARY_SIDEBAR_NAME = "ComplementarySidebar";
1985
- var MAIN_NAME = "Main";
1986
- var GENERIC_CONSUMER_NAME = "GenericConsumer";
1987
- var landmarkAttr = "data-main-landmark";
1988
- var useLandmarkMover = (propsOnKeyDown, landmark) => {
1989
- const handleKeyDown = (0, import_react37.useCallback)((event) => {
1990
- const target = event.target;
1991
- if (event.target === event.currentTarget && event.key === "Tab" && target.hasAttribute(landmarkAttr)) {
1992
- event.preventDefault();
1993
- const landmarks = Array.from(document.querySelectorAll(`[${landmarkAttr}]:not([inert])`)).map((el) => el.hasAttribute(landmarkAttr) ? parseInt(el.getAttribute(landmarkAttr)) : NaN).sort();
1994
- const l = landmarks.length;
1995
- const cursor = landmarks.indexOf(parseInt(target.getAttribute(landmarkAttr)));
1996
- const nextLandmark = landmarks[(cursor + l + (event.getModifierState("Shift") ? -1 : 1)) % l];
1997
- document.querySelector(`[${landmarkAttr}="${nextLandmark}"]`)?.focus();
1998
- }
1999
- propsOnKeyDown?.(event);
2000
- }, [
2001
- propsOnKeyDown
2002
- ]);
2003
- const focusableGroupAttrs = window ? {} : {
2004
- tabBehavior: "limited",
2005
- ignoreDefaultKeydown: {
2006
- Tab: true
2007
- }
2008
- };
2009
- return {
2010
- onKeyDown: handleKeyDown,
2011
- [landmarkAttr]: landmark,
2012
- tabIndex: 0,
2013
- ...focusableGroupAttrs
2014
- };
2015
- };
2016
- var [MainProvider, useMainContext] = (0, import_react_context7.createContext)(MAIN_NAME, {
2017
- resizing: false,
2018
- navigationSidebarState: "closed",
2019
- setNavigationSidebarState: (nextState) => {
2020
- import_log.log.warn("Attempt to set sidebar state without initializing `MainRoot`", void 0, {
2021
- F: __dxlog_file,
2022
- L: 82,
2023
- S: void 0,
2024
- C: (f, a) => f(...a)
2025
- });
2026
- },
2027
- complementarySidebarState: "closed",
2028
- setComplementarySidebarState: (nextState) => {
2029
- import_log.log.warn("Attempt to set sidebar state without initializing `MainRoot`", void 0, {
2030
- F: __dxlog_file,
2031
- L: 87,
2032
- S: void 0,
2033
- C: (f, a) => f(...a)
2034
- });
2035
- }
2036
- });
2037
- var useSidebars = (consumerName = GENERIC_CONSUMER_NAME) => {
2038
- const { setNavigationSidebarState, navigationSidebarState, setComplementarySidebarState, complementarySidebarState } = useMainContext(consumerName);
2039
- return {
2040
- navigationSidebarState,
2041
- setNavigationSidebarState,
2042
- toggleNavigationSidebar: (0, import_react37.useCallback)(() => setNavigationSidebarState(navigationSidebarState === "expanded" ? "closed" : "expanded"), [
2043
- navigationSidebarState,
2044
- setNavigationSidebarState
2045
- ]),
2046
- openNavigationSidebar: (0, import_react37.useCallback)(() => setNavigationSidebarState("expanded"), []),
2047
- collapseNavigationSidebar: (0, import_react37.useCallback)(() => setNavigationSidebarState("collapsed"), []),
2048
- closeNavigationSidebar: (0, import_react37.useCallback)(() => setNavigationSidebarState("closed"), []),
2049
- complementarySidebarState,
2050
- setComplementarySidebarState,
2051
- toggleComplementarySidebar: (0, import_react37.useCallback)(() => setComplementarySidebarState(complementarySidebarState === "expanded" ? "closed" : "expanded"), [
2052
- complementarySidebarState,
2053
- setComplementarySidebarState
2054
- ]),
2055
- openComplementarySidebar: (0, import_react37.useCallback)(() => setComplementarySidebarState("expanded"), []),
2056
- collapseComplementarySidebar: (0, import_react37.useCallback)(() => setComplementarySidebarState("collapsed"), []),
2057
- closeComplementarySidebar: (0, import_react37.useCallback)(() => setComplementarySidebarState("closed"), [])
2058
- };
2059
- };
2060
- var resizeDebounce = 3e3;
2061
- var MainRoot = ({ navigationSidebarState: propsNavigationSidebarState, defaultNavigationSidebarState, onNavigationSidebarStateChange, complementarySidebarState: propsComplementarySidebarState, defaultComplementarySidebarState, onComplementarySidebarStateChange, children, ...props }) => {
2062
- const [isLg] = (0, import_react_hooks4.useMediaQuery)("lg", {
2063
- ssr: false
2064
- });
2065
- const [navigationSidebarState = isLg ? "expanded" : "collapsed", setNavigationSidebarState] = (0, import_react_use_controllable_state4.useControllableState)({
2066
- prop: propsNavigationSidebarState,
2067
- defaultProp: defaultNavigationSidebarState,
2068
- onChange: onNavigationSidebarStateChange
2069
- });
2070
- const [complementarySidebarState = isLg ? "expanded" : "collapsed", setComplementarySidebarState] = (0, import_react_use_controllable_state4.useControllableState)({
2071
- prop: propsComplementarySidebarState,
2072
- defaultProp: defaultComplementarySidebarState,
2073
- onChange: onComplementarySidebarStateChange
2074
- });
2075
- const [resizing, setResizing] = (0, import_react37.useState)(false);
2076
- const resizeInterval = (0, import_react37.useRef)(null);
2077
- const handleResize = (0, import_react37.useCallback)(() => {
2078
- setResizing(true);
2079
- if (resizeInterval.current) {
2080
- clearTimeout(resizeInterval.current);
2081
- }
2082
- resizeInterval.current = setTimeout(() => {
2083
- setResizing(false);
2084
- resizeInterval.current = null;
2085
- }, resizeDebounce);
2086
- }, []);
2087
- (0, import_react37.useEffect)(() => {
2088
- window.addEventListener("resize", handleResize);
2089
- return () => window.removeEventListener("resize", handleResize);
2090
- }, [
2091
- handleResize
2092
- ]);
2093
- return /* @__PURE__ */ import_react37.default.createElement(MainProvider, {
2094
- ...props,
2095
- navigationSidebarState,
2096
- setNavigationSidebarState,
2097
- complementarySidebarState,
2098
- setComplementarySidebarState,
2099
- resizing
2100
- }, children);
2101
- };
2102
- MainRoot.displayName = MAIN_ROOT_NAME;
2103
- var handleOpenAutoFocus = (event) => {
2104
- !document.body.hasAttribute("data-is-keyboard") && event.preventDefault();
2105
- };
2106
- var MainSidebar = /* @__PURE__ */ (0, import_react37.forwardRef)(({ classNames, children, swipeToDismiss, onOpenAutoFocus, state, resizing, onStateChange, side, label, ...props }, forwardedRef) => {
2107
- const [isLg] = (0, import_react_hooks4.useMediaQuery)("lg", {
2108
- ssr: false
2109
- });
2110
- const { tx } = useThemeContext();
2111
- const { t } = useTranslation();
2112
- const ref = (0, import_react_hooks4.useForwardedRef)(forwardedRef);
2113
- const noopRef = (0, import_react37.useRef)(null);
2114
- useSwipeToDismiss(swipeToDismiss ? ref : noopRef, {
2115
- onDismiss: () => onStateChange?.("closed")
2116
- });
2117
- const handleKeyDown = (0, import_react37.useCallback)((event) => {
2118
- if (event.key === "Escape") {
2119
- event.target.closest("[data-tabster]")?.focus();
2120
- }
2121
- props.onKeyDown?.(event);
2122
- }, [
2123
- props.onKeyDown
2124
- ]);
2125
- const Root5 = isLg ? import_react_primitive9.Primitive.div : import_react_dialog2.DialogContent;
2126
- return /* @__PURE__ */ import_react37.default.createElement(import_react_dialog2.Root, {
2127
- open: state !== "closed",
2128
- "aria-label": toLocalizedString(label, t),
2129
- modal: false
2130
- }, !isLg && /* @__PURE__ */ import_react37.default.createElement(import_react_dialog2.DialogTitle, {
2131
- className: "sr-only"
2132
- }, toLocalizedString(label, t)), /* @__PURE__ */ import_react37.default.createElement(Root5, {
2133
- ...!isLg && {
2134
- forceMount: true,
2135
- tabIndex: -1,
2136
- onOpenAutoFocus: onOpenAutoFocus ?? handleOpenAutoFocus
2137
- },
2138
- ...props,
2139
- "data-side": side === "inline-end" ? "ie" : "is",
2140
- "data-state": state,
2141
- "data-resizing": resizing ? "true" : "false",
2142
- className: tx("main.sidebar", "main__sidebar", {}, classNames),
2143
- onKeyDown: handleKeyDown,
2144
- ...state === "closed" && {
2145
- inert: "true"
2146
- },
2147
- ref
2148
- }, children));
2149
- });
2150
- var MainNavigationSidebar = /* @__PURE__ */ (0, import_react37.forwardRef)((props, forwardedRef) => {
2151
- const { navigationSidebarState, setNavigationSidebarState, resizing } = useMainContext(NAVIGATION_SIDEBAR_NAME);
2152
- const mover = useLandmarkMover(props.onKeyDown, "0");
2153
- return /* @__PURE__ */ import_react37.default.createElement(MainSidebar, {
2154
- ...mover,
2155
- ...props,
2156
- state: navigationSidebarState,
2157
- onStateChange: setNavigationSidebarState,
2158
- resizing,
2159
- side: "inline-start",
2160
- ref: forwardedRef
2161
- });
2162
- });
2163
- MainNavigationSidebar.displayName = NAVIGATION_SIDEBAR_NAME;
2164
- var MainComplementarySidebar = /* @__PURE__ */ (0, import_react37.forwardRef)((props, forwardedRef) => {
2165
- const { complementarySidebarState, setComplementarySidebarState, resizing } = useMainContext(COMPLEMENTARY_SIDEBAR_NAME);
2166
- const mover = useLandmarkMover(props.onKeyDown, "2");
2167
- return /* @__PURE__ */ import_react37.default.createElement(MainSidebar, {
2168
- ...mover,
2169
- ...props,
2170
- state: complementarySidebarState,
2171
- onStateChange: setComplementarySidebarState,
2172
- resizing,
2173
- side: "inline-end",
2174
- ref: forwardedRef
2175
- });
2176
- });
2177
- MainNavigationSidebar.displayName = NAVIGATION_SIDEBAR_NAME;
2178
- var MainContent = /* @__PURE__ */ (0, import_react37.forwardRef)(({ asChild, classNames, bounce, handlesFocus, children, role, ...props }, forwardedRef) => {
2179
- const { navigationSidebarState, complementarySidebarState } = useMainContext(MAIN_NAME);
2180
- const { tx } = useThemeContext();
2181
- const Root5 = asChild ? import_react_slot10.Slot : role ? "div" : "main";
2182
- const mover = useLandmarkMover(props.onKeyDown, "1");
2183
- return /* @__PURE__ */ import_react37.default.createElement(Root5, {
2184
- role,
2185
- ...handlesFocus && {
2186
- ...mover
2187
- },
2188
- ...props,
2189
- "data-sidebar-inline-start-state": navigationSidebarState,
2190
- "data-sidebar-inline-end-state": complementarySidebarState,
2191
- className: tx("main.content", "main", {
2192
- bounce,
2193
- handlesFocus
2194
- }, classNames),
2195
- ref: forwardedRef
2196
- }, children);
2197
- });
2198
- MainContent.displayName = MAIN_NAME;
2199
- var MainOverlay = /* @__PURE__ */ (0, import_react37.forwardRef)(({ classNames, ...props }, forwardedRef) => {
2200
- const [isLg] = (0, import_react_hooks4.useMediaQuery)("lg", {
2201
- ssr: false
2202
- });
2203
- const { navigationSidebarState, setNavigationSidebarState, complementarySidebarState, setComplementarySidebarState } = useMainContext(MAIN_NAME);
2204
- const { tx } = useThemeContext();
2205
- return /* @__PURE__ */ import_react37.default.createElement("div", {
2206
- onClick: () => {
2207
- setNavigationSidebarState("collapsed");
2208
- setComplementarySidebarState("collapsed");
2209
- },
2210
- ...props,
2211
- className: tx("main.overlay", "main__overlay", {
2212
- isLg,
2213
- inlineStartSidebarOpen: navigationSidebarState,
2214
- inlineEndSidebarOpen: complementarySidebarState
2215
- }, classNames),
2216
- "data-state": navigationSidebarState === "expanded" || complementarySidebarState === "expanded" ? "open" : "closed",
2217
- "aria-hidden": "true",
2218
- ref: forwardedRef
2219
- });
2220
- });
2221
- var Main = {
2222
- Root: MainRoot,
2223
- Content: MainContent,
2224
- Overlay: MainOverlay,
2225
- NavigationSidebar: MainNavigationSidebar,
2226
- ComplementarySidebar: MainComplementarySidebar
2227
- };
2228
- var MESSAGE_NAME = "Message";
2229
- var [MessageProvider, useMessageContext] = (0, import_react_context8.createContext)(MESSAGE_NAME);
2230
- var MessageRoot = /* @__PURE__ */ (0, import_react39.forwardRef)(({ asChild, valence, elevation: propsElevation, className, titleId: propsTitleId, descriptionId: propsDescriptionId, children, ...props }, forwardedRef) => {
2231
- const { tx } = useThemeContext();
2232
- const titleId = (0, import_react_hooks5.useId)("message__title", propsTitleId);
2233
- const descriptionId = (0, import_react_hooks5.useId)("message__description", propsDescriptionId);
2234
- const elevation = useElevationContext(propsElevation);
2235
- const Root5 = asChild ? import_react_slot11.Slot : import_react_primitive10.Primitive.div;
2236
- return /* @__PURE__ */ import_react39.default.createElement(MessageProvider, {
2237
- titleId,
2238
- descriptionId
2239
- }, /* @__PURE__ */ import_react39.default.createElement(Root5, {
2240
- ...props,
2241
- className: tx("message.root", "message", {
2242
- valence,
2243
- elevation
2244
- }, className),
2245
- "aria-labelledby": titleId,
2246
- "aria-describedby": descriptionId,
2247
- ref: forwardedRef
2248
- }, children));
2249
- });
2250
- MessageRoot.displayName = MESSAGE_NAME;
2251
- var MESSAGE_TITLE_NAME = "MessageTitle";
2252
- var MessageTitle = /* @__PURE__ */ (0, import_react39.forwardRef)(({ asChild, className, children, ...props }, forwardedRef) => {
2253
- const { tx } = useThemeContext();
2254
- const { titleId } = useMessageContext(MESSAGE_TITLE_NAME);
2255
- const Root5 = asChild ? import_react_slot11.Slot : import_react_primitive10.Primitive.h2;
2256
- return /* @__PURE__ */ import_react39.default.createElement(Root5, {
2257
- ...props,
2258
- className: tx("message.title", "message__title", {}, className),
2259
- id: titleId,
2260
- ref: forwardedRef
2261
- }, children);
2262
- });
2263
- MessageTitle.displayName = MESSAGE_TITLE_NAME;
2264
- var MESSAGE_BODY_NAME = "MessageBody";
2265
- var MessageBody = /* @__PURE__ */ (0, import_react39.forwardRef)(({ asChild, className, children, ...props }, forwardedRef) => {
2266
- const { tx } = useThemeContext();
2267
- const { descriptionId } = useMessageContext(MESSAGE_BODY_NAME);
2268
- const Root5 = asChild ? import_react_slot11.Slot : import_react_primitive10.Primitive.p;
2269
- return /* @__PURE__ */ import_react39.default.createElement(Root5, {
2270
- ...props,
2271
- className: tx("message.body", "message__body", {}, className),
2272
- id: descriptionId,
2273
- ref: forwardedRef
2274
- }, children);
2275
- });
2276
- MessageBody.displayName = MESSAGE_BODY_NAME;
2277
- var Message = {
2278
- Root: MessageRoot,
2279
- Title: MessageTitle,
2280
- Body: MessageBody
2281
- };
2282
- var POPOVER_NAME = "Popover";
2283
- var [createPopoverContext, createPopoverScope] = (0, import_react_context9.createContextScope)(POPOVER_NAME, [
2284
- import_react_popper.createPopperScope
2285
- ]);
2286
- var usePopperScope = (0, import_react_popper.createPopperScope)();
2287
- var [PopoverProvider, usePopoverContext] = createPopoverContext(POPOVER_NAME);
2288
- var PopoverRoot = (props) => {
2289
- const { __scopePopover, children, open: openProp, defaultOpen, onOpenChange, modal = false } = props;
2290
- const popperScope = usePopperScope(__scopePopover);
2291
- const triggerRef = (0, import_react40.useRef)(null);
2292
- const [hasCustomAnchor, setHasCustomAnchor] = (0, import_react40.useState)(false);
2293
- const [open = false, setOpen] = (0, import_react_use_controllable_state5.useControllableState)({
2294
- prop: openProp,
2295
- defaultProp: defaultOpen,
2296
- onChange: onOpenChange
2297
- });
2298
- return /* @__PURE__ */ import_react40.default.createElement(PopperPrimitive.Root, popperScope, /* @__PURE__ */ import_react40.default.createElement(PopoverProvider, {
2299
- scope: __scopePopover,
2300
- contentId: (0, import_react_id2.useId)(),
2301
- triggerRef,
2302
- open,
2303
- onOpenChange: setOpen,
2304
- onOpenToggle: (0, import_react40.useCallback)(() => setOpen((prevOpen) => !prevOpen), [
2305
- setOpen
2306
- ]),
2307
- hasCustomAnchor,
2308
- onCustomAnchorAdd: (0, import_react40.useCallback)(() => setHasCustomAnchor(true), []),
2309
- onCustomAnchorRemove: (0, import_react40.useCallback)(() => setHasCustomAnchor(false), []),
2310
- modal
2311
- }, children));
2312
- };
2313
- PopoverRoot.displayName = POPOVER_NAME;
2314
- var ANCHOR_NAME = "PopoverAnchor";
2315
- var PopoverAnchor = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
2316
- const { __scopePopover, ...anchorProps } = props;
2317
- const context = usePopoverContext(ANCHOR_NAME, __scopePopover);
2318
- const popperScope = usePopperScope(__scopePopover);
2319
- const { onCustomAnchorAdd, onCustomAnchorRemove } = context;
2320
- (0, import_react40.useEffect)(() => {
2321
- onCustomAnchorAdd();
2322
- return () => onCustomAnchorRemove();
2323
- }, [
2324
- onCustomAnchorAdd,
2325
- onCustomAnchorRemove
2326
- ]);
2327
- return /* @__PURE__ */ import_react40.default.createElement(PopperPrimitive.Anchor, {
2328
- ...popperScope,
2329
- ...anchorProps,
2330
- ref: forwardedRef
2331
- });
2332
- });
2333
- PopoverAnchor.displayName = ANCHOR_NAME;
2334
- var TRIGGER_NAME2 = "PopoverTrigger";
2335
- var PopoverTrigger = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
2336
- const { __scopePopover, ...triggerProps } = props;
2337
- const context = usePopoverContext(TRIGGER_NAME2, __scopePopover);
2338
- const popperScope = usePopperScope(__scopePopover);
2339
- const composedTriggerRef = (0, import_react_compose_refs2.useComposedRefs)(forwardedRef, context.triggerRef);
2340
- const trigger = /* @__PURE__ */ import_react40.default.createElement(import_react_primitive11.Primitive.button, {
2341
- type: "button",
2342
- "aria-haspopup": "dialog",
2343
- "aria-expanded": context.open,
2344
- "aria-controls": context.contentId,
2345
- "data-state": getState(context.open),
2346
- ...triggerProps,
2347
- ref: composedTriggerRef,
2348
- onClick: (0, import_primitive2.composeEventHandlers)(props.onClick, context.onOpenToggle)
2349
- });
2350
- return context.hasCustomAnchor ? trigger : /* @__PURE__ */ import_react40.default.createElement(PopperPrimitive.Anchor, {
2351
- asChild: true,
2352
- ...popperScope
2353
- }, trigger);
2354
- });
2355
- PopoverTrigger.displayName = TRIGGER_NAME2;
2356
- var VIRTUAL_TRIGGER_NAME2 = "PopoverVirtualTrigger";
2357
- var PopoverVirtualTrigger = (props) => {
2358
- const { __scopePopover, virtualRef } = props;
2359
- const context = usePopoverContext(VIRTUAL_TRIGGER_NAME2, __scopePopover);
2360
- const popperScope = usePopperScope(__scopePopover);
2361
- (0, import_react40.useEffect)(() => {
2362
- if (virtualRef.current) {
2363
- context.triggerRef.current = virtualRef.current;
2364
- }
2365
- });
2366
- return /* @__PURE__ */ import_react40.default.createElement(PopperPrimitive.Anchor, {
2367
- ...popperScope,
2368
- virtualRef
2369
- });
2370
- };
2371
- PopoverVirtualTrigger.displayName = VIRTUAL_TRIGGER_NAME2;
2372
- var PORTAL_NAME2 = "PopoverPortal";
2373
- var [PortalProvider, usePortalContext] = createPopoverContext(PORTAL_NAME2, {
2374
- forceMount: void 0
2375
- });
2376
- var PopoverPortal = (props) => {
2377
- const { __scopePopover, forceMount, children, container } = props;
2378
- const context = usePopoverContext(PORTAL_NAME2, __scopePopover);
2379
- return /* @__PURE__ */ import_react40.default.createElement(PortalProvider, {
2380
- scope: __scopePopover,
2381
- forceMount
2382
- }, /* @__PURE__ */ import_react40.default.createElement(import_react_presence.Presence, {
2383
- present: forceMount || context.open
2384
- }, /* @__PURE__ */ import_react40.default.createElement(import_react_portal.Portal, {
2385
- asChild: true,
2386
- container
2387
- }, children)));
2388
- };
2389
- PopoverPortal.displayName = PORTAL_NAME2;
2390
- var CONTENT_NAME2 = "PopoverContent";
2391
- var PopoverContent = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
2392
- const portalContext = usePortalContext(CONTENT_NAME2, props.__scopePopover);
2393
- const { forceMount = portalContext.forceMount, ...contentProps } = props;
2394
- const context = usePopoverContext(CONTENT_NAME2, props.__scopePopover);
2395
- return /* @__PURE__ */ import_react40.default.createElement(import_react_presence.Presence, {
2396
- present: forceMount || context.open
2397
- }, context.modal ? /* @__PURE__ */ import_react40.default.createElement(PopoverContentModal, {
2398
- ...contentProps,
2399
- ref: forwardedRef
2400
- }) : /* @__PURE__ */ import_react40.default.createElement(PopoverContentNonModal, {
2401
- ...contentProps,
2402
- ref: forwardedRef
2403
- }));
2404
- });
2405
- PopoverContent.displayName = CONTENT_NAME2;
2406
- var PopoverContentModal = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
2407
- const context = usePopoverContext(CONTENT_NAME2, props.__scopePopover);
2408
- const contentRef = (0, import_react40.useRef)(null);
2409
- const composedRefs = (0, import_react_compose_refs2.useComposedRefs)(forwardedRef, contentRef);
2410
- const isRightClickOutsideRef = (0, import_react40.useRef)(false);
2411
- (0, import_react40.useEffect)(() => {
2412
- const content = contentRef.current;
2413
- if (content) {
2414
- return (0, import_aria_hidden.hideOthers)(content);
2415
- }
2416
- }, []);
2417
- return /* @__PURE__ */ import_react40.default.createElement(import_react_remove_scroll.RemoveScroll, {
2418
- as: import_react_slot12.Slot,
2419
- allowPinchZoom: true
2420
- }, /* @__PURE__ */ import_react40.default.createElement(PopoverContentImpl, {
2421
- ...props,
2422
- ref: composedRefs,
2423
- // we make sure we're not trapping once it's been closed
2424
- // (closed !== unmounted when animating out)
2425
- trapFocus: context.open,
2426
- disableOutsidePointerEvents: true,
2427
- onCloseAutoFocus: (0, import_primitive2.composeEventHandlers)(props.onCloseAutoFocus, (event) => {
2428
- event.preventDefault();
2429
- if (!isRightClickOutsideRef.current) {
2430
- context.triggerRef.current?.focus();
2431
- }
2432
- }),
2433
- onPointerDownOutside: (0, import_primitive2.composeEventHandlers)(props.onPointerDownOutside, (event) => {
2434
- const originalEvent = event.detail.originalEvent;
2435
- const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
2436
- const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
2437
- isRightClickOutsideRef.current = isRightClick;
2438
- }, {
2439
- checkForDefaultPrevented: false
2440
- }),
2441
- // When focus is trapped, a `focusout` event may still happen.
2442
- // We make sure we don't trigger our `onDismiss` in such case.
2443
- onFocusOutside: (0, import_primitive2.composeEventHandlers)(props.onFocusOutside, (event) => event.preventDefault(), {
2444
- checkForDefaultPrevented: false
2445
- })
2446
- }));
2447
- });
2448
- var PopoverContentNonModal = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
2449
- const context = usePopoverContext(CONTENT_NAME2, props.__scopePopover);
2450
- const hasInteractedOutsideRef = (0, import_react40.useRef)(false);
2451
- const hasPointerDownOutsideRef = (0, import_react40.useRef)(false);
2452
- return /* @__PURE__ */ import_react40.default.createElement(PopoverContentImpl, {
2453
- ...props,
2454
- ref: forwardedRef,
2455
- trapFocus: false,
2456
- disableOutsidePointerEvents: false,
2457
- onCloseAutoFocus: (event) => {
2458
- props.onCloseAutoFocus?.(event);
2459
- if (!event.defaultPrevented) {
2460
- if (!hasInteractedOutsideRef.current) {
2461
- context.triggerRef.current?.focus();
2462
- }
2463
- event.preventDefault();
2464
- }
2465
- hasInteractedOutsideRef.current = false;
2466
- hasPointerDownOutsideRef.current = false;
2467
- },
2468
- onInteractOutside: (event) => {
2469
- props.onInteractOutside?.(event);
2470
- if (!event.defaultPrevented) {
2471
- hasInteractedOutsideRef.current = true;
2472
- if (event.detail.originalEvent.type === "pointerdown") {
2473
- hasPointerDownOutsideRef.current = true;
2474
- }
2475
- }
2476
- const target = event.target;
2477
- const targetIsTrigger = context.triggerRef.current?.contains(target);
2478
- if (targetIsTrigger) {
2479
- event.preventDefault();
2480
- }
2481
- if (event.detail.originalEvent.type === "focusin" && hasPointerDownOutsideRef.current) {
2482
- event.preventDefault();
2483
- }
2484
- }
2485
- });
2486
- });
2487
- var PopoverContentImpl = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
2488
- const { __scopePopover, trapFocus, onOpenAutoFocus, onCloseAutoFocus, disableOutsidePointerEvents, onEscapeKeyDown, onPointerDownOutside, onFocusOutside, onInteractOutside, collisionPadding = 8, classNames, ...contentProps } = props;
2489
- const context = usePopoverContext(CONTENT_NAME2, __scopePopover);
2490
- const popperScope = usePopperScope(__scopePopover);
2491
- const { tx } = useThemeContext();
2492
- const elevation = useElevationContext();
2493
- const safeCollisionPadding = useSafeCollisionPadding(collisionPadding);
2494
- (0, import_react_focus_guards.useFocusGuards)();
2495
- return /* @__PURE__ */ import_react40.default.createElement(import_react_focus_scope.FocusScope, {
2496
- asChild: true,
2497
- loop: true,
2498
- trapped: trapFocus,
2499
- onMountAutoFocus: onOpenAutoFocus,
2500
- onUnmountAutoFocus: onCloseAutoFocus
2501
- }, /* @__PURE__ */ import_react40.default.createElement(import_react_dismissable_layer.DismissableLayer, {
2502
- asChild: true,
2503
- disableOutsidePointerEvents,
2504
- onInteractOutside,
2505
- onEscapeKeyDown,
2506
- onPointerDownOutside,
2507
- onFocusOutside,
2508
- onDismiss: () => context.onOpenChange(false)
2509
- }, /* @__PURE__ */ import_react40.default.createElement(PopperPrimitive.Content, {
2510
- "data-state": getState(context.open),
2511
- role: "dialog",
2512
- id: context.contentId,
2513
- ...popperScope,
2514
- ...contentProps,
2515
- collisionPadding: safeCollisionPadding,
2516
- className: tx("popover.content", "popover", {
2517
- elevation
2518
- }, classNames),
2519
- ref: forwardedRef,
2520
- style: {
2521
- ...contentProps.style,
2522
- // re-namespace exposed content custom properties
2523
- ...{
2524
- "--radix-popover-content-transform-origin": "var(--radix-popper-transform-origin)",
2525
- "--radix-popover-content-available-width": "var(--radix-popper-available-width)",
2526
- "--radix-popover-content-available-height": "var(--radix-popper-available-height)",
2527
- "--radix-popover-trigger-width": "var(--radix-popper-anchor-width)",
2528
- "--radix-popover-trigger-height": "var(--radix-popper-anchor-height)"
2529
- }
2530
- }
2531
- })));
2532
- });
2533
- var CLOSE_NAME = "PopoverClose";
2534
- var PopoverClose = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
2535
- const { __scopePopover, ...closeProps } = props;
2536
- const context = usePopoverContext(CLOSE_NAME, __scopePopover);
2537
- return /* @__PURE__ */ import_react40.default.createElement(import_react_primitive11.Primitive.button, {
2538
- type: "button",
2539
- ...closeProps,
2540
- ref: forwardedRef,
2541
- onClick: (0, import_primitive2.composeEventHandlers)(props.onClick, () => context.onOpenChange(false))
2542
- });
2543
- });
2544
- PopoverClose.displayName = CLOSE_NAME;
2545
- var ARROW_NAME2 = "PopoverArrow";
2546
- var PopoverArrow = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
2547
- const { __scopePopover, classNames, ...arrowProps } = props;
2548
- const popperScope = usePopperScope(__scopePopover);
2549
- const { tx } = useThemeContext();
2550
- return /* @__PURE__ */ import_react40.default.createElement(PopperPrimitive.Arrow, {
2551
- ...popperScope,
2552
- ...arrowProps,
2553
- className: tx("popover.arrow", "popover__arrow", {}, classNames),
2554
- ref: forwardedRef
2555
- });
2556
- });
2557
- PopoverArrow.displayName = ARROW_NAME2;
2558
- var PopoverViewport = /* @__PURE__ */ (0, import_react40.forwardRef)(({ classNames, asChild, constrainInline = true, constrainBlock = true, children, ...props }, forwardedRef) => {
2559
- const { tx } = useThemeContext();
2560
- const Root5 = asChild ? import_react_slot12.Slot : import_react_primitive11.Primitive.div;
2561
- return /* @__PURE__ */ import_react40.default.createElement(Root5, {
2562
- ...props,
2563
- className: tx("popover.viewport", "popover__viewport", {
2564
- constrainInline,
2565
- constrainBlock
2566
- }, classNames),
2567
- ref: forwardedRef
2568
- }, children);
2569
- });
2570
- var getState = (open) => open ? "open" : "closed";
2571
- var Popover = {
2572
- Root: PopoverRoot,
2573
- Anchor: PopoverAnchor,
2574
- Trigger: PopoverTrigger,
2575
- VirtualTrigger: PopoverVirtualTrigger,
2576
- Portal: PopoverPortal,
2577
- Content: PopoverContent,
2578
- Close: PopoverClose,
2579
- Arrow: PopoverArrow,
2580
- Viewport: PopoverViewport
2581
- };
2582
- var Status = /* @__PURE__ */ (0, import_react41.forwardRef)(({ classNames, children, progress = 0, indeterminate, variant, ...props }, forwardedRef) => {
2583
- const { tx } = useThemeContext();
2584
- return /* @__PURE__ */ import_react41.default.createElement("span", {
2585
- role: "status",
2586
- ...props,
2587
- className: tx("status.root", "status", {
2588
- indeterminate,
2589
- variant
2590
- }, classNames),
2591
- ref: forwardedRef
2592
- }, /* @__PURE__ */ import_react41.default.createElement("span", {
2593
- role: "none",
2594
- className: tx("status.bar", "status__bar", {
2595
- indeterminate,
2596
- variant
2597
- }, classNames),
2598
- ...!indeterminate && {
2599
- style: {
2600
- width: `${Math.round(progress * 100)}%`
2601
- }
2602
- }
2603
- }), children);
2604
- });
2605
- var ScrollAreaRoot = /* @__PURE__ */ (0, import_react42.forwardRef)(({ classNames, ...props }, forwardedRef) => {
2606
- const { tx } = useThemeContext();
2607
- return /* @__PURE__ */ import_react42.default.createElement(import_react_scroll_area.Root, {
2608
- ...props,
2609
- className: tx("scrollArea.root", "scroll-area", {}, classNames),
2610
- ref: forwardedRef
2611
- });
2612
- });
2613
- var ScrollAreaViewport = /* @__PURE__ */ (0, import_react42.forwardRef)(({ classNames, ...props }, forwardedRef) => {
2614
- const { tx } = useThemeContext();
2615
- return /* @__PURE__ */ import_react42.default.createElement(import_react_scroll_area.Viewport, {
2616
- ...props,
2617
- className: tx("scrollArea.viewport", "scroll-area", {}, classNames),
2618
- ref: forwardedRef
2619
- });
2620
- });
2621
- var ScrollAreaScrollbar = /* @__PURE__ */ (0, import_react42.forwardRef)(({ classNames, variant = "fine", ...props }, forwardedRef) => {
2622
- const { tx } = useThemeContext();
2623
- return /* @__PURE__ */ import_react42.default.createElement(import_react_scroll_area.Scrollbar, {
2624
- "data-variant": variant,
2625
- ...props,
2626
- className: tx("scrollArea.scrollbar", "scroll-area__scrollbar", {}, classNames),
2627
- ref: forwardedRef
2628
- });
2629
- });
2630
- var ScrollAreaThumb = /* @__PURE__ */ (0, import_react42.forwardRef)(({ classNames, ...props }, forwardedRef) => {
2631
- const { tx } = useThemeContext();
2632
- return /* @__PURE__ */ import_react42.default.createElement(import_react_scroll_area.Thumb, {
2633
- ...props,
2634
- className: tx("scrollArea.thumb", "scroll-area__thumb", {}, classNames),
2635
- ref: forwardedRef
2636
- });
2637
- });
2638
- var ScrollAreaCorner = /* @__PURE__ */ (0, import_react42.forwardRef)(({ classNames, ...props }, forwardedRef) => {
2639
- const { tx } = useThemeContext();
2640
- return /* @__PURE__ */ import_react42.default.createElement(import_react_scroll_area.Corner, {
2641
- ...props,
2642
- className: tx("scrollArea.corner", "scroll-area__corner", {}, classNames),
2643
- ref: forwardedRef
2644
- });
2645
- });
2646
- var ScrollArea = {
2647
- Root: ScrollAreaRoot,
2648
- Viewport: ScrollAreaViewport,
2649
- Scrollbar: ScrollAreaScrollbar,
2650
- Thumb: ScrollAreaThumb,
2651
- Corner: ScrollAreaCorner
2652
- };
2653
- var SelectRoot = SelectPrimitive.Root;
2654
- var SelectTrigger = SelectPrimitive.Trigger;
2655
- var SelectValue = SelectPrimitive.Value;
2656
- var SelectIcon = SelectPrimitive.Icon;
2657
- var SelectPortal = SelectPrimitive.Portal;
2658
- var SelectTriggerButton = /* @__PURE__ */ (0, import_react44.forwardRef)(({ children, placeholder, ...props }, forwardedRef) => {
2659
- const { tx } = useThemeContext();
2660
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.Trigger, {
2661
- asChild: true,
2662
- ref: forwardedRef
2663
- }, /* @__PURE__ */ import_react44.default.createElement(Button, props, /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.Value, {
2664
- placeholder
2665
- }, children), /* @__PURE__ */ import_react44.default.createElement("span", {
2666
- className: "w-1 flex-1"
2667
- }), /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.Icon, {
2668
- asChild: true
2669
- }, /* @__PURE__ */ import_react44.default.createElement(import_react43.CaretDown, {
2670
- className: tx("select.triggerIcon", "select__trigger__icon", {}),
2671
- weight: "bold"
2672
- }))));
2673
- });
2674
- var SelectContent = /* @__PURE__ */ (0, import_react44.forwardRef)(({ classNames, children, collisionPadding = 8, ...props }, forwardedRef) => {
2675
- const { tx } = useThemeContext();
2676
- const elevation = useElevationContext();
2677
- const safeCollisionPadding = useSafeCollisionPadding(collisionPadding);
2678
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.Content, {
2679
- ...props,
2680
- collisionPadding: safeCollisionPadding,
2681
- className: tx("select.content", "select__content", {
2682
- elevation
2683
- }, classNames),
2684
- position: "popper",
2685
- ref: forwardedRef
2686
- }, children);
2687
- });
2688
- var SelectScrollUpButton2 = /* @__PURE__ */ (0, import_react44.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
2689
- const { tx } = useThemeContext();
2690
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.SelectScrollUpButton, {
2691
- ...props,
2692
- className: tx("select.scrollButton", "select__scroll-button--up", {}, classNames),
2693
- ref: forwardedRef
2694
- }, children ?? /* @__PURE__ */ import_react44.default.createElement(import_react43.CaretUp, {
2695
- weight: "bold"
2696
- }));
2697
- });
2698
- var SelectScrollDownButton2 = /* @__PURE__ */ (0, import_react44.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
2699
- const { tx } = useThemeContext();
2700
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.SelectScrollDownButton, {
2701
- ...props,
2702
- className: tx("select.scrollButton", "select__scroll-button--down", {}, classNames),
2703
- ref: forwardedRef
2704
- }, children ?? /* @__PURE__ */ import_react44.default.createElement(import_react43.CaretDown, {
2705
- weight: "bold"
2706
- }));
2707
- });
2708
- var SelectViewport2 = /* @__PURE__ */ (0, import_react44.forwardRef)(({ classNames, asChild, children, ...props }, forwardedRef) => {
2709
- const { tx } = useThemeContext();
2710
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.SelectViewport, {
2711
- ...props,
2712
- className: tx("select.viewport", "select__viewport", {}, classNames),
2713
- ref: forwardedRef
2714
- }, children);
2715
- });
2716
- var SelectItem = /* @__PURE__ */ (0, import_react44.forwardRef)(({ classNames, ...props }, forwardedRef) => {
2717
- const { tx } = useThemeContext();
2718
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.Item, {
2719
- ...props,
2720
- className: tx("select.item", "option", {}, classNames),
2721
- ref: forwardedRef
2722
- });
2723
- });
2724
- var SelectItemText = SelectPrimitive.ItemText;
2725
- var SelectItemIndicator = /* @__PURE__ */ (0, import_react44.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
2726
- const { tx } = useThemeContext();
2727
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.ItemIndicator, {
2728
- ...props,
2729
- className: tx("select.itemIndicator", "option__indicator", {}, classNames),
2730
- ref: forwardedRef
2731
- }, children);
2732
- });
2733
- var SelectOption = /* @__PURE__ */ (0, import_react44.forwardRef)(({ children, classNames, ...props }, forwardedRef) => {
2734
- const { tx } = useThemeContext();
2735
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.Item, {
2736
- ...props,
2737
- className: tx("select.item", "option", {}, classNames),
2738
- ref: forwardedRef
2739
- }, /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.ItemText, null, children), /* @__PURE__ */ import_react44.default.createElement("span", {
2740
- className: "grow w-1"
2741
- }), /* @__PURE__ */ import_react44.default.createElement(Icon, {
2742
- icon: "ph--check--regular"
2743
- }));
2744
- });
2745
- var SelectGroup = SelectPrimitive.Group;
2746
- var SelectLabel = SelectPrimitive.Label;
2747
- var SelectSeparator = /* @__PURE__ */ (0, import_react44.forwardRef)(({ classNames, ...props }, forwardedRef) => {
2748
- const { tx } = useThemeContext();
2749
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.Separator, {
2750
- ...props,
2751
- className: tx("select.separator", "select__separator", {}, classNames),
2752
- ref: forwardedRef
2753
- });
2754
- });
2755
- var SelectArrow = /* @__PURE__ */ (0, import_react44.forwardRef)(({ classNames, ...props }, forwardedRef) => {
2756
- const { tx } = useThemeContext();
2757
- return /* @__PURE__ */ import_react44.default.createElement(SelectPrimitive.Arrow, {
2758
- ...props,
2759
- className: tx("select.arrow", "select__arrow", {}, classNames),
2760
- ref: forwardedRef
2761
- });
2762
- });
2763
- var Select = {
2764
- Root: SelectRoot,
2765
- Trigger: SelectTrigger,
2766
- TriggerButton: SelectTriggerButton,
2767
- Value: SelectValue,
2768
- Icon: SelectIcon,
2769
- Portal: SelectPortal,
2770
- Content: SelectContent,
2771
- ScrollUpButton: SelectScrollUpButton2,
2772
- ScrollDownButton: SelectScrollDownButton2,
2773
- Viewport: SelectViewport2,
2774
- Item: SelectItem,
2775
- ItemText: SelectItemText,
2776
- ItemIndicator: SelectItemIndicator,
2777
- Option: SelectOption,
2778
- Group: SelectGroup,
2779
- Label: SelectLabel,
2780
- Separator: SelectSeparator,
2781
- Arrow: SelectArrow
2782
- };
2783
- var Separator4 = /* @__PURE__ */ (0, import_react45.forwardRef)(({ classNames, orientation = "horizontal", ...props }, forwardedRef) => {
2784
- const { tx } = useThemeContext();
2785
- return /* @__PURE__ */ import_react45.default.createElement(import_react_separator.Separator, {
2786
- orientation,
2787
- ...props,
2788
- className: tx("separator.root", "separator", {
2789
- orientation
2790
- }, classNames),
2791
- ref: forwardedRef
2792
- });
2793
- });
2794
- var Tag = /* @__PURE__ */ (0, import_react46.forwardRef)(({ asChild, palette = "neutral", classNames, ...props }, forwardedRef) => {
2795
- const { tx } = useThemeContext();
2796
- const Root5 = asChild ? import_react_slot13.Slot : import_react_primitive12.Primitive.span;
2797
- return /* @__PURE__ */ import_react46.default.createElement(Root5, {
2798
- ...props,
2799
- className: tx("tag.root", "dx-tag", {
2800
- palette
2801
- }, classNames),
2802
- "data-hue": palette,
2803
- ref: forwardedRef
2804
- });
2805
- });
2806
- var ToastProvider = import_react_toast.ToastProvider;
2807
- var ToastViewport = /* @__PURE__ */ (0, import_react47.forwardRef)(({ classNames, ...props }, forwardedRef) => {
2808
- const { tx } = useThemeContext();
2809
- return /* @__PURE__ */ import_react47.default.createElement(import_react_toast.ToastViewport, {
2810
- className: tx("toast.viewport", "toast-viewport", {}, classNames),
2811
- ref: forwardedRef
2812
- });
2813
- });
2814
- var ToastRoot = /* @__PURE__ */ (0, import_react47.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
2815
- const { tx } = useThemeContext();
2816
- return /* @__PURE__ */ import_react47.default.createElement(import_react_toast.Root, {
2817
- ...props,
2818
- className: tx("toast.root", "toast", {}, classNames),
2819
- ref: forwardedRef
2820
- }, /* @__PURE__ */ import_react47.default.createElement(ElevationProvider, {
2821
- elevation: "toast"
2822
- }, children));
2823
- });
2824
- var ToastBody = /* @__PURE__ */ (0, import_react47.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
2825
- const { tx } = useThemeContext();
2826
- const Root5 = asChild ? import_react_slot14.Slot : import_react_primitive13.Primitive.div;
2827
- return /* @__PURE__ */ import_react47.default.createElement(Root5, {
2828
- ...props,
2829
- className: tx("toast.body", "toast__body", {}, classNames),
2830
- ref: forwardedRef
2831
- });
2832
- });
2833
- var ToastTitle = /* @__PURE__ */ (0, import_react47.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
2834
- const { tx } = useThemeContext();
2835
- const Root5 = asChild ? import_react_slot14.Slot : import_react_toast.ToastTitle;
2836
- return /* @__PURE__ */ import_react47.default.createElement(Root5, {
2837
- ...props,
2838
- className: tx("toast.title", "toast__title", {}, classNames),
2839
- ref: forwardedRef
2840
- });
2841
- });
2842
- var ToastDescription = /* @__PURE__ */ (0, import_react47.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
2843
- const { tx } = useThemeContext();
2844
- const Root5 = asChild ? import_react_slot14.Slot : import_react_toast.ToastDescription;
2845
- return /* @__PURE__ */ import_react47.default.createElement(Root5, {
2846
- ...props,
2847
- className: tx("toast.description", "toast__description", {}, classNames),
2848
- ref: forwardedRef
2849
- });
2850
- });
2851
- var ToastActions = /* @__PURE__ */ (0, import_react47.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
2852
- const { tx } = useThemeContext();
2853
- const Root5 = asChild ? import_react_slot14.Slot : import_react_primitive13.Primitive.div;
2854
- return /* @__PURE__ */ import_react47.default.createElement(Root5, {
2855
- ...props,
2856
- className: tx("toast.actions", "toast__actions", {}, classNames),
2857
- ref: forwardedRef
2858
- });
2859
- });
2860
- var ToastAction = import_react_toast.ToastAction;
2861
- var ToastClose = import_react_toast.ToastClose;
2862
- var Toast = {
2863
- Provider: ToastProvider,
2864
- Viewport: ToastViewport,
2865
- Root: ToastRoot,
2866
- Body: ToastBody,
2867
- Title: ToastTitle,
2868
- Description: ToastDescription,
2869
- Actions: ToastActions,
2870
- Action: ToastAction,
2871
- Close: ToastClose
2872
- };
2873
- var ToolbarRoot = /* @__PURE__ */ (0, import_react48.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
2874
- const { tx } = useThemeContext();
2875
- return /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.Root, {
2876
- ...props,
2877
- className: tx("toolbar.root", "toolbar", {}, classNames),
2878
- ref: forwardedRef
2879
- }, children);
2880
- });
2881
- var ToolbarButton = /* @__PURE__ */ (0, import_react48.forwardRef)((props, forwardedRef) => {
2882
- return /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.Button, {
2883
- asChild: true
2884
- }, /* @__PURE__ */ import_react48.default.createElement(Button, {
2885
- ...props,
2886
- ref: forwardedRef
2887
- }));
2888
- });
2889
- var ToolbarIconButton = /* @__PURE__ */ (0, import_react48.forwardRef)((props, forwardedRef) => {
2890
- return /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.Button, {
2891
- asChild: true
2892
- }, /* @__PURE__ */ import_react48.default.createElement(IconButton, {
2893
- ...props,
2894
- ref: forwardedRef
2895
- }));
2896
- });
2897
- var ToolbarToggle = /* @__PURE__ */ (0, import_react48.forwardRef)((props, forwardedRef) => {
2898
- return /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.Button, {
2899
- asChild: true
2900
- }, /* @__PURE__ */ import_react48.default.createElement(Toggle, {
2901
- ...props,
2902
- ref: forwardedRef
2903
- }));
2904
- });
2905
- var ToolbarLink = /* @__PURE__ */ (0, import_react48.forwardRef)((props, forwardedRef) => {
2906
- return /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.Link, {
2907
- asChild: true
2908
- }, /* @__PURE__ */ import_react48.default.createElement(Link, {
2909
- ...props,
2910
- ref: forwardedRef
2911
- }));
2912
- });
2913
- var ToolbarToggleGroup2 = /* @__PURE__ */ (0, import_react48.forwardRef)(({ classNames, children, elevation, ...props }, forwardedRef) => {
2914
- return /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.ToolbarToggleGroup, {
2915
- ...props,
2916
- asChild: true
2917
- }, /* @__PURE__ */ import_react48.default.createElement(ButtonGroup, {
2918
- classNames,
2919
- children,
2920
- elevation,
2921
- ref: forwardedRef
2922
- }));
2923
- });
2924
- var ToolbarToggleGroupItem = /* @__PURE__ */ (0, import_react48.forwardRef)(({ variant, density, elevation, classNames, children, ...props }, forwardedRef) => {
2925
- return /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.ToolbarToggleItem, {
2926
- ...props,
2927
- asChild: true
2928
- }, /* @__PURE__ */ import_react48.default.createElement(Button, {
2929
- variant,
2930
- density,
2931
- elevation,
2932
- classNames,
2933
- children,
2934
- ref: forwardedRef
2935
- }));
2936
- });
2937
- var ToolbarToggleGroupIconItem = /* @__PURE__ */ (0, import_react48.forwardRef)(({ variant, density, elevation, classNames, icon, label, iconOnly, ...props }, forwardedRef) => {
2938
- return /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.ToolbarToggleItem, {
2939
- ...props,
2940
- asChild: true
2941
- }, /* @__PURE__ */ import_react48.default.createElement(IconButton, {
2942
- variant,
2943
- density,
2944
- elevation,
2945
- classNames,
2946
- icon,
2947
- label,
2948
- iconOnly,
2949
- ref: forwardedRef
2950
- }));
2951
- });
2952
- var ToolbarSeparator = /* @__PURE__ */ (0, import_react48.forwardRef)(({ variant = "line", ...props }, forwardedRef) => {
2953
- return variant === "line" ? /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.Separator, {
2954
- asChild: true
2955
- }, /* @__PURE__ */ import_react48.default.createElement(Separator4, {
2956
- ...props,
2957
- ref: forwardedRef
2958
- })) : /* @__PURE__ */ import_react48.default.createElement(ToolbarPrimitive.Separator, {
2959
- className: "grow",
2960
- ref: forwardedRef
2961
- });
2962
- });
2963
- var Toolbar = {
2964
- Root: ToolbarRoot,
2965
- Button: ToolbarButton,
2966
- IconButton: ToolbarIconButton,
2967
- Link: ToolbarLink,
2968
- Toggle: ToolbarToggle,
2969
- ToggleGroup: ToolbarToggleGroup2,
2970
- ToggleGroupItem: ToolbarToggleGroupItem,
2971
- ToggleGroupIconItem: ToolbarToggleGroupIconItem,
2972
- Separator: ToolbarSeparator
2973
- };
2974
97
  // Annotate the CommonJS export names for ESM import in node:
2975
98
  0 && (module.exports = {
2976
99
  AlertDialog,
@@ -3018,6 +141,7 @@ var Toolbar = {
3018
141
  Treegrid,
3019
142
  createDropdownMenuScope,
3020
143
  createPopoverScope,
144
+ createTooltipScope,
3021
145
  hasIosKeyboard,
3022
146
  initialSafeArea,
3023
147
  isLabel,
@@ -3037,6 +161,7 @@ var Toolbar = {
3037
161
  useSafeArea,
3038
162
  useSidebars,
3039
163
  useThemeContext,
164
+ useTooltipContext,
3040
165
  useTranslation,
3041
166
  useTranslationsContext,
3042
167
  useVisualViewport,