@dxos/react-ui 0.8.2-main.85fa0e5 → 0.8.2-main.9f6ec58

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