@dxos/shell 0.7.5-main.9d26e3a → 0.7.5-main.e9bb01b

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 (52) hide show
  1. package/dist/bundle/shell.mjs +16018 -19791
  2. package/dist/bundle/shell.mjs.map +1 -1
  3. package/dist/bundle/shell.umd.js +149 -147
  4. package/dist/bundle/shell.umd.js.map +1 -1
  5. package/dist/bundle/style.css +1 -1
  6. package/dist/lib/browser/meta.json +1 -1
  7. package/dist/lib/browser/react.mjs +517 -781
  8. package/dist/lib/browser/react.mjs.map +4 -4
  9. package/dist/lib/node/meta.json +1 -1
  10. package/dist/lib/node/react.cjs +614 -878
  11. package/dist/lib/node/react.cjs.map +4 -4
  12. package/dist/lib/node-esm/meta.json +1 -1
  13. package/dist/lib/node-esm/react.mjs +517 -781
  14. package/dist/lib/node-esm/react.mjs.map +4 -4
  15. package/dist/types/src/components/AgentConfig.js +1 -1
  16. package/dist/types/src/components/AgentConfig.js.map +1 -1
  17. package/dist/types/src/components/DeviceList/DeviceList.js +1 -1
  18. package/dist/types/src/components/DeviceList/DeviceList.js.map +1 -1
  19. package/dist/types/src/components/index.d.ts +0 -2
  20. package/dist/types/src/components/index.d.ts.map +1 -1
  21. package/dist/types/src/components/index.js +0 -2
  22. package/dist/types/src/components/index.js.map +1 -1
  23. package/dist/types/src/panels/IdentityPanel/IdentityPanel.d.ts.map +1 -1
  24. package/dist/types/src/panels/IdentityPanel/IdentityPanel.js +3 -2
  25. package/dist/types/src/panels/IdentityPanel/IdentityPanel.js.map +1 -1
  26. package/dist/types/src/panels/IdentityPanel/steps/ProfileForm.d.ts.map +1 -1
  27. package/dist/types/src/panels/IdentityPanel/steps/ProfileForm.js +3 -2
  28. package/dist/types/src/panels/IdentityPanel/steps/ProfileForm.js.map +1 -1
  29. package/dist/types/tsconfig.tsbuildinfo +1 -1
  30. package/package.json +31 -30
  31. package/src/components/AgentConfig.tsx +1 -1
  32. package/src/components/DeviceList/DeviceList.tsx +1 -1
  33. package/src/components/index.ts +0 -2
  34. package/src/panels/IdentityPanel/IdentityPanel.tsx +2 -1
  35. package/src/panels/IdentityPanel/steps/ProfileForm.tsx +2 -1
  36. package/dist/lib/browser/react.css +0 -7
  37. package/dist/lib/browser/react.css.map +0 -7
  38. package/dist/lib/node/react.css +0 -7
  39. package/dist/lib/node/react.css.map +0 -7
  40. package/dist/lib/node-esm/react.css +0 -7
  41. package/dist/lib/node-esm/react.css.map +0 -7
  42. package/dist/types/src/components/EmojiPicker.d.ts +0 -19
  43. package/dist/types/src/components/EmojiPicker.d.ts.map +0 -1
  44. package/dist/types/src/components/EmojiPicker.js +0 -146
  45. package/dist/types/src/components/EmojiPicker.js.map +0 -1
  46. package/dist/types/src/components/HuePicker.d.ts +0 -18
  47. package/dist/types/src/components/HuePicker.d.ts.map +0 -1
  48. package/dist/types/src/components/HuePicker.js +0 -133
  49. package/dist/types/src/components/HuePicker.js.map +0 -1
  50. package/src/components/EmojiPicker.tsx +0 -187
  51. package/src/components/HuePicker.tsx +0 -182
  52. package/src/components/emoji.css +0 -25
@@ -1 +0,0 @@
1
- {"version":3,"file":"EmojiPicker.js","sourceRoot":"","sources":["../../../../src/components/EmojiPicker.tsx"],"names":[],"mappings":"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"}
@@ -1,18 +0,0 @@
1
- import React from 'react';
2
- import { type ButtonProps, type ThemedClassName } from '@dxos/react-ui';
3
- export type HuePickerProps = {
4
- disabled?: boolean;
5
- defaultHue?: string;
6
- hue?: string;
7
- onChangeHue?: (nextHue: string) => void;
8
- onClickClear?: ButtonProps['onClick'];
9
- };
10
- /**
11
- * A toolbar button for picking hue. Use only in `role=toolbar` elements. Unable to unset the value.
12
- */
13
- export declare const HuePickerToolbarButton: ({ disabled, hue, onChangeHue, classNames, defaultHue, }: ThemedClassName<Omit<HuePickerProps, "onClickClear">>) => React.JSX.Element;
14
- /**
15
- * A button for picking hue alongside a button for unsetting it.
16
- */
17
- export declare const HuePickerBlock: ({ disabled, hue, onChangeHue, defaultHue, onClickClear }: HuePickerProps) => React.JSX.Element;
18
- //# sourceMappingURL=HuePicker.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"HuePicker.d.ts","sourceRoot":"","sources":["../../../../src/components/HuePicker.tsx"],"names":[],"mappings":"AAMA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAEhD,OAAO,EAEL,KAAK,WAAW,EAEhB,KAAK,eAAe,EAKrB,MAAM,gBAAgB,CAAC;AAexB,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,YAAY,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CACvC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,sBAAsB,4DAMhC,eAAe,CAAC,IAAI,CAAC,cAAc,EAAE,cAAc,CAAC,CAAC,sBAoEvD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,cAAc,6DAA8D,cAAc,sBA2DtG,CAAC"}
@@ -1,133 +0,0 @@
1
- "use strict";
2
- //
3
- // Copyright 2024 DXOS.org
4
- //
5
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
6
- if (k2 === undefined) k2 = k;
7
- var desc = Object.getOwnPropertyDescriptor(m, k);
8
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
9
- desc = { enumerable: true, get: function() { return m[k]; } };
10
- }
11
- Object.defineProperty(o, k2, desc);
12
- }) : (function(o, m, k, k2) {
13
- if (k2 === undefined) k2 = k;
14
- o[k2] = m[k];
15
- }));
16
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
17
- Object.defineProperty(o, "default", { enumerable: true, value: v });
18
- }) : function(o, v) {
19
- o["default"] = v;
20
- });
21
- var __importStar = (this && this.__importStar) || (function () {
22
- var ownKeys = function(o) {
23
- ownKeys = Object.getOwnPropertyNames || function (o) {
24
- var ar = [];
25
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
26
- return ar;
27
- };
28
- return ownKeys(o);
29
- };
30
- return function (mod) {
31
- if (mod && mod.__esModule) return mod;
32
- var result = {};
33
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
34
- __setModuleDefault(result, mod);
35
- return result;
36
- };
37
- })();
38
- Object.defineProperty(exports, "__esModule", { value: true });
39
- exports.HuePickerBlock = exports.HuePickerToolbarButton = void 0;
40
- const react_1 = require("@phosphor-icons/react");
41
- const react_use_controllable_state_1 = require("@radix-ui/react-use-controllable-state");
42
- const react_2 = __importStar(require("react"));
43
- const react_ui_1 = require("@dxos/react-ui");
44
- const react_ui_theme_1 = require("@dxos/react-ui-theme");
45
- const HuePreview = ({ hue }) => {
46
- const { tx } = (0, react_ui_1.useThemeContext)();
47
- const size = 20;
48
- return (react_2.default.createElement("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}` },
49
- react_2.default.createElement("rect", { x: 0, y: 0, width: size, height: size, className: tx('hue.fill', 'select--hue__preview', { hue }) })));
50
- };
51
- const hueTokens = Object.keys(react_ui_theme_1.hueTokenThemes).slice(0, 16);
52
- /**
53
- * A toolbar button for picking hue. Use only in `role=toolbar` elements. Unable to unset the value.
54
- */
55
- const HuePickerToolbarButton = ({ disabled, hue, onChangeHue, classNames, defaultHue, }) => {
56
- const { t } = (0, react_ui_1.useTranslation)('os');
57
- const [hueValue, setHueValue] = (0, react_use_controllable_state_1.useControllableState)({
58
- prop: hue,
59
- onChange: onChangeHue,
60
- defaultProp: defaultHue,
61
- });
62
- const [huePickerOpen, setHuePickerOpen] = (0, react_2.useState)(false);
63
- const suppressNextTooltip = (0, react_2.useRef)(false);
64
- const [triggerTooltipOpen, setTriggerTooltipOpen] = (0, react_2.useState)(false);
65
- return (react_2.default.createElement(react_ui_1.Tooltip.Root, { open: triggerTooltipOpen, onOpenChange: (nextOpen) => {
66
- if (suppressNextTooltip.current) {
67
- setTriggerTooltipOpen(false);
68
- suppressNextTooltip.current = false;
69
- }
70
- else {
71
- setTriggerTooltipOpen(nextOpen);
72
- }
73
- } },
74
- react_2.default.createElement(react_ui_1.DropdownMenu.Root, { modal: false, open: huePickerOpen, onOpenChange: (nextOpen) => {
75
- setHuePickerOpen(nextOpen);
76
- suppressNextTooltip.current = true;
77
- } },
78
- react_2.default.createElement(react_ui_1.Tooltip.Trigger, { asChild: true },
79
- react_2.default.createElement(react_ui_1.DropdownMenu.Trigger, { asChild: true },
80
- react_2.default.createElement(react_ui_1.Toolbar.Button, { classNames: (0, react_ui_theme_1.mx)('gap-2 plb-1', classNames), disabled: disabled },
81
- react_2.default.createElement("span", { className: 'sr-only' }, t('select hue label')),
82
- react_2.default.createElement(react_1.Palette, { className: (0, react_ui_theme_1.getSize)(5) })))),
83
- react_2.default.createElement(react_ui_1.Tooltip.Portal, null,
84
- react_2.default.createElement(react_ui_1.Tooltip.Content, { side: 'bottom' },
85
- t('select hue label'),
86
- react_2.default.createElement(react_ui_1.Tooltip.Arrow, null))),
87
- react_2.default.createElement(react_ui_1.DropdownMenu.Content, { side: 'bottom', classNames: '!w-40' },
88
- react_2.default.createElement(react_ui_1.DropdownMenu.Viewport, { classNames: 'grid grid-cols-4' }, hueTokens.map((hue) => {
89
- return (react_2.default.createElement(react_ui_1.DropdownMenu.CheckboxItem, { key: hue, checked: hue === hueValue, onCheckedChange: () => setHueValue(hue), classNames: 'px-0 py-2 items-center justify-center' },
90
- react_2.default.createElement(HuePreview, { hue: hue })));
91
- }))))));
92
- };
93
- exports.HuePickerToolbarButton = HuePickerToolbarButton;
94
- /**
95
- * A button for picking hue alongside a button for unsetting it.
96
- */
97
- const HuePickerBlock = ({ disabled, hue, onChangeHue, defaultHue, onClickClear }) => {
98
- const { t } = (0, react_ui_1.useTranslation)('os');
99
- const [hueValue, setHueValue] = (0, react_use_controllable_state_1.useControllableState)({
100
- prop: hue,
101
- onChange: onChangeHue,
102
- defaultProp: defaultHue,
103
- });
104
- return (react_2.default.createElement(react_2.default.Fragment, null,
105
- react_2.default.createElement(react_ui_1.DropdownMenu.Root, { modal: false },
106
- react_2.default.createElement(react_ui_1.DropdownMenu.Trigger, { asChild: true },
107
- react_2.default.createElement(react_ui_1.Button, { variant: 'ghost', classNames: 'gap-2 plb-1', disabled: disabled },
108
- react_2.default.createElement("span", { className: 'sr-only' }, t('select hue label')),
109
- react_2.default.createElement("div", { role: 'none', className: 'pis-14 grow flex items-center justify-center gap-2' },
110
- react_2.default.createElement(HuePreview, { hue: hueValue }),
111
- react_2.default.createElement("span", null, t(`${hueValue} label`))),
112
- react_2.default.createElement(react_1.CaretDown, { className: (0, react_ui_theme_1.getSize)(4) }))),
113
- react_2.default.createElement(react_ui_1.DropdownMenu.Content, { side: 'right' },
114
- react_2.default.createElement(react_ui_1.DropdownMenu.Viewport, null, Object.keys(react_ui_theme_1.hueTokenThemes).map((hue) => {
115
- return (react_2.default.createElement(react_ui_1.DropdownMenu.CheckboxItem, { key: hue, checked: hue === hueValue, onCheckedChange: () => setHueValue(hue) },
116
- react_2.default.createElement(HuePreview, { hue: hue }),
117
- react_2.default.createElement("span", { className: 'grow' }, t(`${hue} label`)),
118
- react_2.default.createElement(react_ui_1.DropdownMenu.ItemIndicator, null,
119
- react_2.default.createElement(react_1.Check, null))));
120
- })),
121
- react_2.default.createElement(react_ui_1.DropdownMenu.Arrow, null))),
122
- react_2.default.createElement(react_ui_1.Tooltip.Root, null,
123
- react_2.default.createElement(react_ui_1.Tooltip.Trigger, { asChild: true },
124
- react_2.default.createElement(react_ui_1.Button, { variant: 'ghost', onClick: onClickClear, disabled: disabled },
125
- react_2.default.createElement("span", { className: 'sr-only' }, t('clear label')),
126
- react_2.default.createElement(react_1.ArrowCounterClockwise, null))),
127
- react_2.default.createElement(react_ui_1.Tooltip.Portal, null,
128
- react_2.default.createElement(react_ui_1.Tooltip.Content, { side: 'right' },
129
- t('clear label'),
130
- react_2.default.createElement(react_ui_1.Tooltip.Arrow, null))))));
131
- };
132
- exports.HuePickerBlock = HuePickerBlock;
133
- //# sourceMappingURL=HuePicker.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"HuePicker.js","sourceRoot":"","sources":["../../../../src/components/HuePicker.tsx"],"names":[],"mappings":"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"}
@@ -1,187 +0,0 @@
1
- //
2
- // Copyright 2024 DXOS.org
3
- //
4
-
5
- import emojiData from '@emoji-mart/data';
6
- import EmojiMart from '@emoji-mart/react';
7
- import { ArrowCounterClockwise, CaretDown, UserCircle } from '@phosphor-icons/react';
8
- import { useControllableState } from '@radix-ui/react-use-controllable-state';
9
- import React, { useRef, useState } from 'react';
10
-
11
- import {
12
- Button,
13
- type ButtonProps,
14
- Popover,
15
- type ThemedClassName,
16
- Toolbar,
17
- Tooltip,
18
- useMediaQuery,
19
- useThemeContext,
20
- useTranslation,
21
- } from '@dxos/react-ui';
22
- import { getSize } from '@dxos/react-ui-theme';
23
-
24
- import './emoji.css';
25
-
26
- export type EmojiPickerProps = {
27
- disabled?: boolean;
28
- defaultEmoji?: string;
29
- emoji?: string;
30
- onChangeEmoji?: (nextEmoji: string) => void;
31
- onClickClear?: ButtonProps['onClick'];
32
- };
33
-
34
- /**
35
- * A toolbar button for picking an emoji. Use only in `role=toolbar` elements. Unable to unset the value.
36
- */
37
- export const EmojiPickerToolbarButton = ({
38
- disabled,
39
- defaultEmoji,
40
- emoji,
41
- onChangeEmoji,
42
- classNames,
43
- }: ThemedClassName<Omit<EmojiPickerProps, 'onClickClear'>>) => {
44
- const { t } = useTranslation('os');
45
- const { themeMode } = useThemeContext();
46
-
47
- const [_emojiValue, setEmojiValue] = useControllableState<string>({
48
- prop: emoji,
49
- onChange: onChangeEmoji,
50
- defaultProp: defaultEmoji,
51
- });
52
-
53
- const [emojiPickerOpen, setEmojiPickerOpen] = useState<boolean>(false);
54
- const suppressNextTooltip = useRef<boolean>(false);
55
- const [triggerTooltipOpen, setTriggerTooltipOpen] = useState(false);
56
-
57
- return (
58
- <Tooltip.Root
59
- open={triggerTooltipOpen}
60
- onOpenChange={(nextOpen) => {
61
- if (suppressNextTooltip.current) {
62
- setTriggerTooltipOpen(false);
63
- suppressNextTooltip.current = false;
64
- } else {
65
- setTriggerTooltipOpen(nextOpen);
66
- }
67
- }}
68
- >
69
- <Popover.Root
70
- open={emojiPickerOpen}
71
- onOpenChange={(nextOpen) => {
72
- setEmojiPickerOpen(nextOpen);
73
- suppressNextTooltip.current = true;
74
- }}
75
- >
76
- <Tooltip.Trigger asChild>
77
- <Popover.Trigger asChild>
78
- <Toolbar.Button classNames={['gap-2 text-2xl plb-1', classNames]} disabled={disabled}>
79
- <span className='sr-only'>{t('select emoji label')}</span>
80
- <UserCircle className={getSize(5)} />
81
- </Toolbar.Button>
82
- </Popover.Trigger>
83
- </Tooltip.Trigger>
84
- <Tooltip.Portal>
85
- <Tooltip.Content side='bottom'>
86
- {t('select emoji label')}
87
- <Tooltip.Arrow />
88
- </Tooltip.Content>
89
- </Tooltip.Portal>
90
- <Popover.Content
91
- side='bottom'
92
- onKeyDownCapture={(event) => {
93
- if (event.key === 'Escape') {
94
- event.stopPropagation();
95
- setEmojiPickerOpen(false);
96
- suppressNextTooltip.current = true;
97
- }
98
- }}
99
- >
100
- {/* https://github.com/missive/emoji-mart?tab=readme-ov-file#options--props */}
101
- <EmojiMart
102
- data={emojiData}
103
- onEmojiSelect={({ native }: { native?: string }) => {
104
- if (native) {
105
- setEmojiValue(native);
106
- setEmojiPickerOpen(false);
107
- }
108
- }}
109
- autoFocus={true}
110
- maxFrequentRows={0}
111
- noCountryFlags={true}
112
- theme={themeMode}
113
- />
114
- <Popover.Arrow />
115
- </Popover.Content>
116
- </Popover.Root>
117
- </Tooltip.Root>
118
- );
119
- };
120
-
121
- /**
122
- * A button for picking an emoji alongside a button for unsetting it.
123
- */
124
- export const EmojiPickerBlock = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onClickClear }: EmojiPickerProps) => {
125
- const { t } = useTranslation('os');
126
- const [isMd] = useMediaQuery('md', { ssr: false });
127
-
128
- const [emojiValue, setEmojiValue] = useControllableState<string>({
129
- prop: emoji,
130
- onChange: onChangeEmoji,
131
- defaultProp: defaultEmoji,
132
- });
133
-
134
- const [emojiPickerOpen, setEmojiPickerOpen] = useState<boolean>(false);
135
-
136
- return (
137
- <>
138
- <Popover.Root open={emojiPickerOpen} onOpenChange={setEmojiPickerOpen}>
139
- <Popover.Trigger asChild>
140
- <Button variant='ghost' classNames='gap-2 text-2xl plb-1' disabled={disabled}>
141
- <span className='sr-only'>{t('select emoji label')}</span>
142
- <span className='grow pis-14'>{emojiValue}</span>
143
- <CaretDown className={getSize(4)} />
144
- </Button>
145
- </Popover.Trigger>
146
- <Popover.Content
147
- side='right'
148
- sideOffset={isMd ? 0 : -310}
149
- onKeyDownCapture={(event) => {
150
- if (event.key === 'Escape') {
151
- event.stopPropagation();
152
- setEmojiPickerOpen(false);
153
- }
154
- }}
155
- >
156
- <EmojiMart
157
- data={emojiData}
158
- onEmojiSelect={({ native }: { native?: string }) => {
159
- if (native) {
160
- setEmojiValue(native);
161
- setEmojiPickerOpen(false);
162
- }
163
- }}
164
- autoFocus={true}
165
- maxFrequentRows={0}
166
- noCountryFlags={true}
167
- />
168
- <Popover.Arrow />
169
- </Popover.Content>
170
- </Popover.Root>
171
- <Tooltip.Root>
172
- <Tooltip.Trigger asChild>
173
- <Button variant='ghost' onClick={onClickClear} disabled={disabled}>
174
- <span className='sr-only'>{t('clear label')}</span>
175
- <ArrowCounterClockwise />
176
- </Button>
177
- </Tooltip.Trigger>
178
- <Tooltip.Portal>
179
- <Tooltip.Content side='right'>
180
- {t('clear label')}
181
- <Tooltip.Arrow />
182
- </Tooltip.Content>
183
- </Tooltip.Portal>
184
- </Tooltip.Root>
185
- </>
186
- );
187
- };
@@ -1,182 +0,0 @@
1
- //
2
- // Copyright 2024 DXOS.org
3
- //
4
-
5
- import { ArrowCounterClockwise, CaretDown, Check, Palette } from '@phosphor-icons/react';
6
- import { useControllableState } from '@radix-ui/react-use-controllable-state';
7
- import React, { useRef, useState } from 'react';
8
-
9
- import {
10
- Button,
11
- type ButtonProps,
12
- DropdownMenu,
13
- type ThemedClassName,
14
- Toolbar,
15
- Tooltip,
16
- useThemeContext,
17
- useTranslation,
18
- } from '@dxos/react-ui';
19
- import { getSize, hueTokenThemes, mx } from '@dxos/react-ui-theme';
20
-
21
- const HuePreview = ({ hue }: { hue: string }) => {
22
- const { tx } = useThemeContext();
23
- const size = 20;
24
- return (
25
- <svg width={size} height={size} viewBox={`0 0 ${size} ${size}`}>
26
- <rect x={0} y={0} width={size} height={size} className={tx('hue.fill', 'select--hue__preview', { hue })} />
27
- </svg>
28
- );
29
- };
30
-
31
- const hueTokens = Object.keys(hueTokenThemes).slice(0, 16);
32
-
33
- export type HuePickerProps = {
34
- disabled?: boolean;
35
- defaultHue?: string;
36
- hue?: string;
37
- onChangeHue?: (nextHue: string) => void;
38
- onClickClear?: ButtonProps['onClick'];
39
- };
40
-
41
- /**
42
- * A toolbar button for picking hue. Use only in `role=toolbar` elements. Unable to unset the value.
43
- */
44
- export const HuePickerToolbarButton = ({
45
- disabled,
46
- hue,
47
- onChangeHue,
48
- classNames,
49
- defaultHue,
50
- }: ThemedClassName<Omit<HuePickerProps, 'onClickClear'>>) => {
51
- const { t } = useTranslation('os');
52
-
53
- const [hueValue, setHueValue] = useControllableState<string>({
54
- prop: hue,
55
- onChange: onChangeHue,
56
- defaultProp: defaultHue,
57
- });
58
-
59
- const [huePickerOpen, setHuePickerOpen] = useState<boolean>(false);
60
-
61
- const suppressNextTooltip = useRef<boolean>(false);
62
- const [triggerTooltipOpen, setTriggerTooltipOpen] = useState(false);
63
-
64
- return (
65
- <Tooltip.Root
66
- open={triggerTooltipOpen}
67
- onOpenChange={(nextOpen) => {
68
- if (suppressNextTooltip.current) {
69
- setTriggerTooltipOpen(false);
70
- suppressNextTooltip.current = false;
71
- } else {
72
- setTriggerTooltipOpen(nextOpen);
73
- }
74
- }}
75
- >
76
- <DropdownMenu.Root
77
- modal={false}
78
- open={huePickerOpen}
79
- onOpenChange={(nextOpen) => {
80
- setHuePickerOpen(nextOpen);
81
- suppressNextTooltip.current = true;
82
- }}
83
- >
84
- <Tooltip.Trigger asChild>
85
- <DropdownMenu.Trigger asChild>
86
- <Toolbar.Button classNames={mx('gap-2 plb-1', classNames)} disabled={disabled}>
87
- <span className='sr-only'>{t('select hue label')}</span>
88
- <Palette className={getSize(5)} />
89
- </Toolbar.Button>
90
- </DropdownMenu.Trigger>
91
- </Tooltip.Trigger>
92
- <Tooltip.Portal>
93
- <Tooltip.Content side='bottom'>
94
- {t('select hue label')}
95
- <Tooltip.Arrow />
96
- </Tooltip.Content>
97
- </Tooltip.Portal>
98
- {/* TODO(burdon): Change from DropdownMenu (show checked). */}
99
- <DropdownMenu.Content side='bottom' classNames='!w-40'>
100
- <DropdownMenu.Viewport classNames='grid grid-cols-4'>
101
- {hueTokens.map((hue) => {
102
- return (
103
- <DropdownMenu.CheckboxItem
104
- key={hue}
105
- checked={hue === hueValue}
106
- onCheckedChange={() => setHueValue(hue)}
107
- classNames={'px-0 py-2 items-center justify-center'}
108
- >
109
- <HuePreview hue={hue} />
110
- </DropdownMenu.CheckboxItem>
111
- );
112
- })}
113
- </DropdownMenu.Viewport>
114
- </DropdownMenu.Content>
115
- </DropdownMenu.Root>
116
- </Tooltip.Root>
117
- );
118
- };
119
-
120
- /**
121
- * A button for picking hue alongside a button for unsetting it.
122
- */
123
- export const HuePickerBlock = ({ disabled, hue, onChangeHue, defaultHue, onClickClear }: HuePickerProps) => {
124
- const { t } = useTranslation('os');
125
-
126
- const [hueValue, setHueValue] = useControllableState<string>({
127
- prop: hue,
128
- onChange: onChangeHue,
129
- defaultProp: defaultHue,
130
- });
131
-
132
- return (
133
- <>
134
- <DropdownMenu.Root modal={false}>
135
- <DropdownMenu.Trigger asChild>
136
- <Button variant='ghost' classNames='gap-2 plb-1' disabled={disabled}>
137
- <span className='sr-only'>{t('select hue label')}</span>
138
- <div role='none' className='pis-14 grow flex items-center justify-center gap-2'>
139
- <HuePreview hue={hueValue!} />
140
- <span>{t(`${hueValue} label`)}</span>
141
- </div>
142
- <CaretDown className={getSize(4)} />
143
- </Button>
144
- </DropdownMenu.Trigger>
145
- <DropdownMenu.Content side='right'>
146
- <DropdownMenu.Viewport>
147
- {Object.keys(hueTokenThemes).map((hue) => {
148
- return (
149
- <DropdownMenu.CheckboxItem
150
- key={hue}
151
- checked={hue === hueValue}
152
- onCheckedChange={() => setHueValue(hue)}
153
- >
154
- <HuePreview hue={hue} />
155
- <span className='grow'>{t(`${hue} label`)}</span>
156
- <DropdownMenu.ItemIndicator>
157
- <Check />
158
- </DropdownMenu.ItemIndicator>
159
- </DropdownMenu.CheckboxItem>
160
- );
161
- })}
162
- </DropdownMenu.Viewport>
163
- <DropdownMenu.Arrow />
164
- </DropdownMenu.Content>
165
- </DropdownMenu.Root>
166
- <Tooltip.Root>
167
- <Tooltip.Trigger asChild>
168
- <Button variant='ghost' onClick={onClickClear} disabled={disabled}>
169
- <span className='sr-only'>{t('clear label')}</span>
170
- <ArrowCounterClockwise />
171
- </Button>
172
- </Tooltip.Trigger>
173
- <Tooltip.Portal>
174
- <Tooltip.Content side='right'>
175
- {t('clear label')}
176
- <Tooltip.Arrow />
177
- </Tooltip.Content>
178
- </Tooltip.Portal>
179
- </Tooltip.Root>
180
- </>
181
- );
182
- };
@@ -1,25 +0,0 @@
1
- /**
2
- * https://github.com/missive/emoji-mart/blob/main/packages/emoji-mart-website/example-custom-styles.html
3
- */
4
- [data-theme="dark"] em-emoji-picker {
5
- /* TODO(burdon): Get from TW defs: modal-surface? */
6
- --background-rgb: #3B3B3F;
7
- --rgb-background: #3B3B3F;
8
-
9
- --font-family: "Inter Variable", ui-sans-serif;
10
-
11
- /*--font-size: 16px;*/
12
- /*--color-border-over: rgba(0, 0, 0, 0.1);*/
13
- /*--color-border: rgba(0, 0, 0, 0.05);*/
14
- /*--category-icon-size: 24px;*/
15
- /*--border-radius: 24px;*/
16
- /*--font-family: 'Comic Sans MS', 'Chalkboard SE', cursive;*/
17
- /*--rgb-accent: 255, 105, 180;*/
18
- /*--rgb-color: 102, 51, 153;*/
19
- /*--rgb-input: 255, 235, 235;*/
20
- /*--shadow: 5px 5px 15px -8px rebeccapurple;*/
21
-
22
- /*height: 50vh;*/
23
- /*min-height: 400px;*/
24
- /*max-height: 800px;*/
25
- }