@dxos/react-ui-pickers 0.8.4-main.dedc0f3 → 0.8.4-main.e8ec1fe
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib/browser/index.mjs +44 -52
- package/dist/lib/browser/index.mjs.map +3 -3
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +44 -52
- package/dist/lib/node-esm/index.mjs.map +3 -3
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/types/src/components/EmojiPicker/EmojiPicker.d.ts.map +1 -1
- package/dist/types/src/components/EmojiPicker/EmojiPicker.stories.d.ts +0 -4
- package/dist/types/src/components/EmojiPicker/EmojiPicker.stories.d.ts.map +1 -1
- package/dist/types/src/components/HuePicker/HuePicker.d.ts.map +1 -1
- package/dist/types/src/components/HuePicker/HuePicker.stories.d.ts +0 -4
- package/dist/types/src/components/HuePicker/HuePicker.stories.d.ts.map +1 -1
- package/dist/types/src/components/IconPicker/IconPicker.d.ts +7 -1
- package/dist/types/src/components/IconPicker/IconPicker.d.ts.map +1 -1
- package/dist/types/src/components/IconPicker/IconPicker.stories.d.ts +0 -4
- package/dist/types/src/components/IconPicker/IconPicker.stories.d.ts.map +1 -1
- package/dist/types/src/components/PickerButton/PickerButton.d.ts +2 -2
- package/dist/types/src/components/PickerButton/PickerButton.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +16 -16
- package/src/components/EmojiPicker/EmojiPicker.stories.tsx +3 -8
- package/src/components/EmojiPicker/EmojiPicker.tsx +20 -16
- package/src/components/HuePicker/HuePicker.stories.tsx +2 -7
- package/src/components/HuePicker/HuePicker.tsx +5 -9
- package/src/components/IconPicker/IconPicker.stories.tsx +2 -7
- package/src/components/IconPicker/IconPicker.tsx +11 -5
- package/src/components/PickerButton/PickerButton.tsx +8 -9
|
@@ -4,7 +4,7 @@ import emojiData from "@emoji-mart/data";
|
|
|
4
4
|
import EmojiMart from "@emoji-mart/react";
|
|
5
5
|
import { useControllableState } from "@radix-ui/react-use-controllable-state";
|
|
6
6
|
import React, { useState } from "react";
|
|
7
|
-
import { Button, ButtonGroup, Icon, Popover, Toolbar,
|
|
7
|
+
import { Button, ButtonGroup, Icon, IconButton, Popover, Toolbar, useMediaQuery, useThemeContext, useTranslation } from "@dxos/react-ui";
|
|
8
8
|
var EmojiPickerToolbarButton = ({ classNames, emoji, disabled, defaultEmoji, onChangeEmoji }) => {
|
|
9
9
|
var _effect = _useSignals();
|
|
10
10
|
try {
|
|
@@ -21,24 +21,15 @@ var EmojiPickerToolbarButton = ({ classNames, emoji, disabled, defaultEmoji, onC
|
|
|
21
21
|
onOpenChange: (nextOpen) => {
|
|
22
22
|
setEmojiPickerOpen(nextOpen);
|
|
23
23
|
}
|
|
24
|
-
}, /* @__PURE__ */ React.createElement(Tooltip.Trigger, {
|
|
25
|
-
asChild: true,
|
|
26
|
-
content: t("select emoji label"),
|
|
27
|
-
side: "bottom"
|
|
28
24
|
}, /* @__PURE__ */ React.createElement(Popover.Trigger, {
|
|
29
25
|
asChild: true
|
|
30
|
-
}, /* @__PURE__ */ React.createElement(Toolbar.
|
|
31
|
-
classNames: [
|
|
32
|
-
"gap-2 text-2xl plb-1",
|
|
33
|
-
classNames
|
|
34
|
-
],
|
|
35
|
-
disabled
|
|
36
|
-
}, /* @__PURE__ */ React.createElement("span", {
|
|
37
|
-
className: "sr-only"
|
|
38
|
-
}, t("select emoji label")), /* @__PURE__ */ React.createElement(Icon, {
|
|
26
|
+
}, /* @__PURE__ */ React.createElement(Toolbar.IconButton, {
|
|
39
27
|
icon: "ph--user-circle--regular",
|
|
40
|
-
|
|
41
|
-
|
|
28
|
+
label: t("select emoji label"),
|
|
29
|
+
iconOnly: true,
|
|
30
|
+
tooltipSide: "bottom",
|
|
31
|
+
disabled
|
|
32
|
+
})), /* @__PURE__ */ React.createElement(Popover.Portal, null, /* @__PURE__ */ React.createElement(Popover.Content, {
|
|
42
33
|
side: "bottom",
|
|
43
34
|
onKeyDownCapture: (event) => {
|
|
44
35
|
if (event.key === "Escape") {
|
|
@@ -67,9 +58,7 @@ var EmojiPickerBlock = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onClickC
|
|
|
67
58
|
var _effect = _useSignals();
|
|
68
59
|
try {
|
|
69
60
|
const { t } = useTranslation("os");
|
|
70
|
-
const [isMd] = useMediaQuery("md"
|
|
71
|
-
ssr: false
|
|
72
|
-
});
|
|
61
|
+
const [isMd] = useMediaQuery("md");
|
|
73
62
|
const [emojiValue, setEmojiValue] = useControllableState({
|
|
74
63
|
prop: emoji,
|
|
75
64
|
onChange: onChangeEmoji,
|
|
@@ -112,20 +101,15 @@ var EmojiPickerBlock = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onClickC
|
|
|
112
101
|
autoFocus: true,
|
|
113
102
|
maxFrequentRows: 0,
|
|
114
103
|
noCountryFlags: true
|
|
115
|
-
}), /* @__PURE__ */ React.createElement(Popover.Arrow, null))), /* @__PURE__ */ React.createElement(
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
104
|
+
}), /* @__PURE__ */ React.createElement(Popover.Arrow, null))), /* @__PURE__ */ React.createElement(IconButton, {
|
|
105
|
+
icon: "ph--arrow-counter-clockwise--regular",
|
|
106
|
+
iconOnly: true,
|
|
107
|
+
label: t("clear label"),
|
|
108
|
+
tooltipSide: "right",
|
|
120
109
|
variant: triggerVariant,
|
|
121
110
|
onClick: onClickClear,
|
|
122
111
|
disabled
|
|
123
|
-
}
|
|
124
|
-
className: "sr-only"
|
|
125
|
-
}, t("clear label")), /* @__PURE__ */ React.createElement(Icon, {
|
|
126
|
-
icon: "ph--arrow-counter-clockwise--regular",
|
|
127
|
-
size: 5
|
|
128
|
-
}))));
|
|
112
|
+
}));
|
|
129
113
|
} finally {
|
|
130
114
|
_effect.f();
|
|
131
115
|
}
|
|
@@ -135,23 +119,23 @@ var EmojiPickerBlock = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onClickC
|
|
|
135
119
|
import { useSignals as _useSignals3 } from "@preact-signals/safe-react/tracking";
|
|
136
120
|
import React3 from "react";
|
|
137
121
|
import { useTranslation as useTranslation2 } from "@dxos/react-ui";
|
|
138
|
-
import { hues } from "@dxos/react-ui-theme";
|
|
122
|
+
import { getSize, hues } from "@dxos/react-ui-theme";
|
|
139
123
|
|
|
140
124
|
// src/components/PickerButton/PickerButton.tsx
|
|
141
125
|
import { useSignals as _useSignals2 } from "@preact-signals/safe-react/tracking";
|
|
142
126
|
import { useControllableState as useControllableState2 } from "@radix-ui/react-use-controllable-state";
|
|
143
127
|
import React2, { useEffect, useState as useState2 } from "react";
|
|
144
|
-
import { Button as Button2, DropdownMenu, Icon as Icon2, Toolbar as Toolbar2, Tooltip
|
|
145
|
-
var PickerButton = ({ Component, disabled, classNames, defaultValue:
|
|
128
|
+
import { Button as Button2, DropdownMenu, Icon as Icon2, Toolbar as Toolbar2, Tooltip } from "@dxos/react-ui";
|
|
129
|
+
var PickerButton = ({ Component, disabled, classNames, defaultValue: defaultValueParam, value: valueParam, values, label, icon, onChange, onReset, rootVariant = "button", iconSize = 5 }) => {
|
|
146
130
|
var _effect = _useSignals2();
|
|
147
131
|
try {
|
|
148
132
|
const [value, setValue] = useControllableState2({
|
|
149
|
-
prop:
|
|
150
|
-
defaultProp:
|
|
133
|
+
prop: valueParam,
|
|
134
|
+
defaultProp: defaultValueParam,
|
|
151
135
|
onChange
|
|
152
136
|
});
|
|
153
|
-
useEffect(() => setValue(
|
|
154
|
-
|
|
137
|
+
useEffect(() => setValue(valueParam), [
|
|
138
|
+
valueParam
|
|
155
139
|
]);
|
|
156
140
|
const [open, setOpen] = useState2(false);
|
|
157
141
|
const TriggerRoot = rootVariant === "toolbar-button" ? Toolbar2.Button : Button2;
|
|
@@ -159,7 +143,7 @@ var PickerButton = ({ Component, disabled, classNames, defaultValue: _defaultVal
|
|
|
159
143
|
modal: false,
|
|
160
144
|
open,
|
|
161
145
|
onOpenChange: setOpen
|
|
162
|
-
}, /* @__PURE__ */ React2.createElement(
|
|
146
|
+
}, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
|
|
163
147
|
asChild: true,
|
|
164
148
|
content: label,
|
|
165
149
|
side: "bottom"
|
|
@@ -175,7 +159,7 @@ var PickerButton = ({ Component, disabled, classNames, defaultValue: _defaultVal
|
|
|
175
159
|
className: "sr-only"
|
|
176
160
|
}, label), value && /* @__PURE__ */ React2.createElement(Component, {
|
|
177
161
|
value,
|
|
178
|
-
iconSize
|
|
162
|
+
size: iconSize
|
|
179
163
|
}) || /* @__PURE__ */ React2.createElement(Icon2, {
|
|
180
164
|
icon,
|
|
181
165
|
size: iconSize
|
|
@@ -187,15 +171,15 @@ var PickerButton = ({ Component, disabled, classNames, defaultValue: _defaultVal
|
|
|
187
171
|
classNames: "!is-min"
|
|
188
172
|
}, /* @__PURE__ */ React2.createElement(DropdownMenu.Viewport, {
|
|
189
173
|
classNames: "grid grid-cols-[repeat(6,min-content)]"
|
|
190
|
-
}, values.map((
|
|
174
|
+
}, values.map((_value) => {
|
|
191
175
|
return /* @__PURE__ */ React2.createElement(DropdownMenu.CheckboxItem, {
|
|
192
|
-
key:
|
|
193
|
-
checked:
|
|
194
|
-
onCheckedChange: () => setValue(
|
|
176
|
+
key: _value,
|
|
177
|
+
checked: _value === value,
|
|
178
|
+
onCheckedChange: () => setValue(_value),
|
|
195
179
|
classNames: "p-1 items-center justify-center aspect-square"
|
|
196
180
|
}, /* @__PURE__ */ React2.createElement(Component, {
|
|
197
|
-
value:
|
|
198
|
-
iconSize
|
|
181
|
+
value: _value,
|
|
182
|
+
size: iconSize
|
|
199
183
|
}));
|
|
200
184
|
}), onReset && /* @__PURE__ */ React2.createElement(DropdownMenu.CheckboxItem, {
|
|
201
185
|
onCheckedChange: () => onReset(),
|
|
@@ -225,15 +209,15 @@ var HuePicker = (props) => {
|
|
|
225
209
|
_effect.f();
|
|
226
210
|
}
|
|
227
211
|
};
|
|
228
|
-
var HuePreview = ({ value }) => {
|
|
212
|
+
var HuePreview = ({ value, size = 5 }) => {
|
|
229
213
|
var _effect = _useSignals3();
|
|
230
214
|
try {
|
|
231
|
-
const size = 16;
|
|
232
215
|
return /* @__PURE__ */ React3.createElement("div", {
|
|
233
|
-
|
|
216
|
+
role: "none",
|
|
217
|
+
className: "flex justify-center items-center"
|
|
234
218
|
}, /* @__PURE__ */ React3.createElement("svg", {
|
|
235
219
|
viewBox: `0 0 ${size} ${size}`,
|
|
236
|
-
className:
|
|
220
|
+
className: getSize(size)
|
|
237
221
|
}, /* @__PURE__ */ React3.createElement("rect", {
|
|
238
222
|
x: 0,
|
|
239
223
|
y: 0,
|
|
@@ -266,18 +250,24 @@ var IconPicker = ({ ...props }) => {
|
|
|
266
250
|
_effect.f();
|
|
267
251
|
}
|
|
268
252
|
};
|
|
269
|
-
var IconPreview = ({ value,
|
|
253
|
+
var IconPreview = ({ value, size }) => {
|
|
270
254
|
var _effect = _useSignals4();
|
|
271
255
|
try {
|
|
272
256
|
return /* @__PURE__ */ React4.createElement(Icon3, {
|
|
273
257
|
icon: `ph--${value}--regular`,
|
|
274
|
-
size
|
|
258
|
+
size
|
|
275
259
|
});
|
|
276
260
|
} finally {
|
|
277
261
|
_effect.f();
|
|
278
262
|
}
|
|
279
263
|
};
|
|
280
264
|
var icons = [
|
|
265
|
+
"ph--house-line--regular",
|
|
266
|
+
"ph--planet--regular",
|
|
267
|
+
"ph--castle-turret--regular",
|
|
268
|
+
"ph--snowflake--regular",
|
|
269
|
+
"ph--virus--regular",
|
|
270
|
+
"ph--graph--regular",
|
|
281
271
|
"ph--air-traffic-control--regular",
|
|
282
272
|
"ph--asterisk--regular",
|
|
283
273
|
"ph--atom--regular",
|
|
@@ -333,6 +323,8 @@ export {
|
|
|
333
323
|
EmojiPickerToolbarButton,
|
|
334
324
|
HuePicker,
|
|
335
325
|
IconPicker,
|
|
336
|
-
PickerButton
|
|
326
|
+
PickerButton,
|
|
327
|
+
iconValues,
|
|
328
|
+
icons
|
|
337
329
|
};
|
|
338
330
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/EmojiPicker/EmojiPicker.tsx", "../../../src/components/HuePicker/HuePicker.tsx", "../../../src/components/PickerButton/PickerButton.tsx", "../../../src/components/IconPicker/IconPicker.tsx"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport emojiData from '@emoji-mart/data';\nimport EmojiMart from '@emoji-mart/react';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport React, { useState } from 'react';\n\nimport {\n Button,\n ButtonGroup,\n type ButtonProps,\n Icon,\n Popover,\n type ThemedClassName,\n Toolbar,\n Tooltip,\n useMediaQuery,\n useThemeContext,\n useTranslation,\n} from '@dxos/react-ui';\n\nimport './emoji.css';\n\nexport type EmojiPickerProps = ThemedClassName<{\n disabled?: boolean;\n defaultEmoji?: string;\n emoji?: string;\n onChangeEmoji?: (nextEmoji: string) => void;\n onClickClear?: ButtonProps['onClick'];\n triggerVariant?: ButtonProps['variant'];\n}>;\n\n/**\n * A toolbar button for picking an emoji. Use only in `role=toolbar` elements. Unable to unset the value.\n */\nexport const EmojiPickerToolbarButton = ({\n classNames,\n emoji,\n disabled,\n defaultEmoji,\n onChangeEmoji,\n}: Omit<EmojiPickerProps, 'onClickClear'>) => {\n const { t } = useTranslation('os');\n const { themeMode } = useThemeContext();\n\n const [_emojiValue, setEmojiValue] = useControllableState<string>({\n prop: emoji,\n onChange: onChangeEmoji,\n defaultProp: defaultEmoji,\n });\n\n const [emojiPickerOpen, setEmojiPickerOpen] = useState<boolean>(false);\n\n return (\n <Popover.Root\n open={emojiPickerOpen}\n onOpenChange={(nextOpen) => {\n setEmojiPickerOpen(nextOpen);\n }}\n >\n <Tooltip.Trigger asChild content={t('select emoji label')} side='bottom'>\n <Popover.Trigger asChild>\n <Toolbar.Button classNames={['gap-2 text-2xl plb-1', classNames]} disabled={disabled}>\n <span className='sr-only'>{t('select emoji label')}</span>\n <Icon icon='ph--user-circle--regular' size={5} />\n </Toolbar.Button>\n </Popover.Trigger>\n </Tooltip.Trigger>\n <Popover.Portal>\n <Popover.Content\n side='bottom'\n onKeyDownCapture={(event) => {\n if (event.key === 'Escape') {\n event.stopPropagation();\n setEmojiPickerOpen(false);\n }\n }}\n >\n {/* https://github.com/missive/emoji-mart?tab=readme-ov-file#options--props */}\n <EmojiMart\n data={emojiData}\n onEmojiSelect={({ native }: { native?: string }) => {\n if (native) {\n setEmojiValue(native);\n setEmojiPickerOpen(false);\n }\n }}\n autoFocus={true}\n maxFrequentRows={0}\n noCountryFlags={true}\n theme={themeMode}\n />\n <Popover.Arrow />\n </Popover.Content>\n </Popover.Portal>\n </Popover.Root>\n );\n};\n\n/**\n * A button for picking an emoji alongside a button for unsetting it.\n */\nexport const EmojiPickerBlock = ({\n disabled,\n defaultEmoji,\n emoji,\n onChangeEmoji,\n onClickClear,\n triggerVariant = 'ghost',\n classNames,\n}: EmojiPickerProps) => {\n const { t } = useTranslation('os');\n const [isMd] = useMediaQuery('md', { ssr: false });\n\n const [emojiValue, setEmojiValue] = useControllableState<string>({\n prop: emoji,\n onChange: onChangeEmoji,\n defaultProp: defaultEmoji,\n });\n\n const [emojiPickerOpen, setEmojiPickerOpen] = useState<boolean>(false);\n\n return (\n <ButtonGroup classNames={classNames}>\n <Popover.Root open={emojiPickerOpen} onOpenChange={setEmojiPickerOpen}>\n <Popover.Trigger asChild>\n <Button variant={triggerVariant} classNames='grow gap-2 text-2xl plb-1' disabled={disabled}>\n <span className='sr-only'>{t('select emoji label')}</span>\n <span>{emojiValue}</span>\n <Icon icon='ph--caret-down--bold' size={3} />\n </Button>\n </Popover.Trigger>\n <Popover.Content\n side='right'\n sideOffset={isMd ? 0 : -310}\n onKeyDownCapture={(event) => {\n if (event.key === 'Escape') {\n event.stopPropagation();\n setEmojiPickerOpen(false);\n }\n }}\n >\n <EmojiMart\n data={emojiData}\n onEmojiSelect={({ native }: { native?: string }) => {\n if (native) {\n setEmojiValue(native);\n setEmojiPickerOpen(false);\n }\n }}\n autoFocus={true}\n maxFrequentRows={0}\n noCountryFlags={true}\n />\n <Popover.Arrow />\n </Popover.Content>\n </Popover.Root>\n <Tooltip.Trigger asChild content={t('clear label')} side='right'>\n <Button variant={triggerVariant} onClick={onClickClear} disabled={disabled}>\n <span className='sr-only'>{t('clear label')}</span>\n <Icon icon='ph--arrow-counter-clockwise--regular' size={5} />\n </Button>\n </Tooltip.Trigger>\n </ButtonGroup>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React from 'react';\n\nimport { type ButtonProps, type ThemedClassName, useTranslation } from '@dxos/react-ui';\nimport { hues } from '@dxos/react-ui-theme';\n\nimport { PickerButton, type PickerButtonProps } from '../PickerButton';\n\nexport type HuePickerProps = {\n disabled?: boolean;\n defaultValue?: string;\n value?: string;\n onChange?: (nextHue: string) => void;\n onReset?: ButtonProps['onClick'];\n} & Pick<PickerButtonProps, 'disabled' | 'defaultValue' | 'value' | 'onChange' | 'onReset' | 'rootVariant'>;\n\nexport const HuePicker = (props: ThemedClassName<HuePickerProps>) => {\n const { t } = useTranslation('os');\n\n return (\n <PickerButton\n Component={HuePreview}\n label={t('select hue label')}\n icon='ph--palette--regular'\n values={hues}\n {...props}\n />\n );\n};\n\nconst HuePreview = ({ value }: { value: string }) => {\n const size = 16;\n return (\n <div className='flex p-[2px] justify-center items-center'>\n <svg\n viewBox={`0 0 ${size} ${size}`}\n className='is-[var(--hue-preview-size,1rem)] bs-[var(--hue-preview-size,1rem)]'\n >\n <rect x={0} y={0} width={size} height={size} fill={`var(--dx-${value}Fill)`} strokeWidth={4} />\n </svg>\n </div>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport React, { type FC, useEffect, useState } from 'react';\n\nimport { Button, DropdownMenu, Icon, type IconProps, type ThemedClassName, Toolbar, Tooltip } from '@dxos/react-ui';\n\nexport type PickerButtonProps = ThemedClassName<{\n Component: FC<{ value: string; iconSize?: IconProps['size'] }>;\n label: string;\n icon: string;\n values: string[];\n disabled?: boolean;\n defaultValue?: string;\n value?: string;\n onChange?: (value: string) => void;\n onReset?: () => void;\n rootVariant?: 'button' | 'toolbar-button';\n iconSize?: IconProps['size'];\n}>;\n\nexport const PickerButton = ({\n Component,\n disabled,\n classNames,\n defaultValue: _defaultValue,\n value: _value,\n values,\n label,\n icon,\n onChange,\n onReset,\n rootVariant = 'button',\n iconSize = 5,\n}: PickerButtonProps) => {\n const [value, setValue] = useControllableState<string>({\n prop: _value,\n defaultProp: _defaultValue,\n onChange,\n });\n // TODO(burdon): useControllableState doesn't update the prop when the value is changed. Replace it.\n useEffect(() => setValue(_value), [_value]);\n\n const [open, setOpen] = useState<boolean>(false);\n\n const TriggerRoot = rootVariant === 'toolbar-button' ? Toolbar.Button : Button;\n\n return (\n <DropdownMenu.Root modal={false} open={open} onOpenChange={setOpen}>\n <Tooltip.Trigger asChild content={label} side='bottom'>\n <DropdownMenu.Trigger asChild>\n <TriggerRoot classNames={['gap-2 plb-1', classNames]} disabled={disabled}>\n <span className='sr-only'>{label}</span>\n {(value && <Component value={value} iconSize={iconSize} />) || <Icon icon={icon} size={iconSize} />}\n <Icon icon='ph--caret-down--bold' size={3} />\n </TriggerRoot>\n </DropdownMenu.Trigger>\n </Tooltip.Trigger>\n <DropdownMenu.Portal>\n <DropdownMenu.Content side='bottom' classNames='!is-min'>\n <DropdownMenu.Viewport classNames='grid grid-cols-[repeat(6,min-content)]'>\n {values.map((_value) => {\n return (\n <DropdownMenu.CheckboxItem\n key={_value}\n checked={_value === value}\n onCheckedChange={() => setValue(_value)}\n classNames={'p-1 items-center justify-center aspect-square'}\n >\n <Component value={_value} iconSize={iconSize} />\n </DropdownMenu.CheckboxItem>\n );\n })}\n {onReset && (\n <DropdownMenu.CheckboxItem\n onCheckedChange={() => onReset()}\n classNames={'p-1 items-center justify-center aspect-square'}\n >\n <Icon icon='ph--x--regular' size={iconSize} />\n </DropdownMenu.CheckboxItem>\n )}\n </DropdownMenu.Viewport>\n <DropdownMenu.Arrow />\n </DropdownMenu.Content>\n </DropdownMenu.Portal>\n </DropdownMenu.Root>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React from 'react';\n\nimport { type ButtonProps, Icon, type IconProps, type ThemedClassName, useTranslation } from '@dxos/react-ui';\n\nimport { PickerButton, type PickerButtonProps } from '../PickerButton';\n\nexport type IconPickerProps = {\n disabled?: boolean;\n defaultValue?: string;\n value?: string;\n onChange?: (nextHue: string) => void;\n onReset?: ButtonProps['onClick'];\n} & Pick<\n PickerButtonProps,\n 'disabled' | 'defaultValue' | 'value' | 'onChange' | 'onReset' | 'rootVariant' | 'iconSize'\n>;\n\nexport const IconPicker = ({ ...props }: ThemedClassName<IconPickerProps>) => {\n const { t } = useTranslation('os');\n\n return (\n <PickerButton\n Component={IconPreview}\n label={t('select icon label')}\n icon='ph--selection--regular'\n values={iconValues}\n {...props}\n />\n );\n};\n\nconst IconPreview = ({ value, iconSize = 5 }: { value: string; iconSize?: IconProps['size'] }) => {\n return <Icon icon={`ph--${value}--regular`} size={iconSize} />;\n};\n\n/**\n * https://phosphoricons.com\n * NOTE: Select icons that we are unlikely to use for the UI.\n */\nconst icons = [\n 'ph--air-traffic-control--regular',\n 'ph--asterisk--regular',\n 'ph--atom--regular',\n 'ph--basketball--regular',\n 'ph--butterfly--regular',\n 'ph--cactus--regular',\n 'ph--cake--regular',\n 'ph--calendar-dots--regular',\n 'ph--campfire--regular',\n 'ph--command--regular',\n 'ph--confetti--regular',\n 'ph--detective--regular',\n 'ph--disco-ball--regular',\n 'ph--dna--regular',\n 'ph--factory--regular',\n 'ph--flag-banner-fold--regular',\n 'ph--flask--regular',\n 'ph--flower-lotus--regular',\n 'ph--flying-saucer--regular',\n 'ph--game-controller--regular',\n 'ph--gavel--regular',\n 'ph--gift--regular',\n 'ph--guitar--regular',\n 'ph--hamburger--regular',\n 'ph--handshake--regular',\n 'ph--heart--regular',\n 'ph--lightbulb--regular',\n 'ph--lock--regular',\n 'ph--martini--regular',\n 'ph--medal-military--regular',\n 'ph--moped-front--regular',\n 'ph--office-chair--regular',\n 'ph--paint-brush-household--regular',\n 'ph--peace--regular',\n 'ph--person-simple-hike--regular',\n 'ph--piggy-bank--regular',\n 'ph--potted-plant--regular',\n 'ph--radioactive--regular',\n 'ph--rocket-launch--regular',\n 'ph--shield-star--regular',\n 'ph--shopping-cart--regular',\n 'ph--stethoscope--regular',\n 'ph--student--regular',\n 'ph--sun--regular',\n 'ph--tote--regular',\n 'ph--tree--regular',\n 'ph--users-three--regular',\n 'ph--yin-yang--regular',\n];\n\nconst iconValues = icons.map((icon) => icon.match(/ph--(.+)--regular/)?.[1] ?? icon);\n"],
|
|
5
|
-
"mappings": ";;AAIA,OAAOA,eAAe;AACtB,OAAOC,eAAe;AACtB,SAASC,4BAA4B;AACrC,OAAOC,SAASC,gBAAgB;AAEhC,SACEC,QACAC,aAEAC,MACAC,SAEAC,SACAC,
|
|
6
|
-
"names": ["emojiData", "EmojiMart", "useControllableState", "React", "useState", "Button", "ButtonGroup", "Icon", "
|
|
4
|
+
"sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport emojiData from '@emoji-mart/data';\nimport EmojiMart from '@emoji-mart/react';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport React, { useState } from 'react';\n\nimport {\n Button,\n ButtonGroup,\n type ButtonProps,\n Icon,\n IconButton,\n Popover,\n type ThemedClassName,\n Toolbar,\n useMediaQuery,\n useThemeContext,\n useTranslation,\n} from '@dxos/react-ui';\n\nimport './emoji.css';\n\nexport type EmojiPickerProps = ThemedClassName<{\n disabled?: boolean;\n defaultEmoji?: string;\n emoji?: string;\n onChangeEmoji?: (nextEmoji: string) => void;\n onClickClear?: ButtonProps['onClick'];\n triggerVariant?: ButtonProps['variant'];\n}>;\n\n/**\n * A toolbar button for picking an emoji. Use only in `role=toolbar` elements. Unable to unset the value.\n */\nexport const EmojiPickerToolbarButton = ({\n classNames,\n emoji,\n disabled,\n defaultEmoji,\n onChangeEmoji,\n}: Omit<EmojiPickerProps, 'onClickClear'>) => {\n const { t } = useTranslation('os');\n const { themeMode } = useThemeContext();\n\n const [_emojiValue, setEmojiValue] = useControllableState<string>({\n prop: emoji,\n onChange: onChangeEmoji,\n defaultProp: defaultEmoji,\n });\n\n const [emojiPickerOpen, setEmojiPickerOpen] = useState<boolean>(false);\n\n return (\n <Popover.Root\n open={emojiPickerOpen}\n onOpenChange={(nextOpen) => {\n setEmojiPickerOpen(nextOpen);\n }}\n >\n <Popover.Trigger asChild>\n <Toolbar.IconButton\n icon='ph--user-circle--regular'\n label={t('select emoji label')}\n iconOnly\n tooltipSide='bottom'\n disabled={disabled}\n />\n </Popover.Trigger>\n <Popover.Portal>\n <Popover.Content\n side='bottom'\n onKeyDownCapture={(event) => {\n if (event.key === 'Escape') {\n event.stopPropagation();\n setEmojiPickerOpen(false);\n }\n }}\n >\n {/* https://github.com/missive/emoji-mart?tab=readme-ov-file#options--props */}\n <EmojiMart\n data={emojiData}\n onEmojiSelect={({ native }: { native?: string }) => {\n if (native) {\n setEmojiValue(native);\n setEmojiPickerOpen(false);\n }\n }}\n autoFocus={true}\n maxFrequentRows={0}\n noCountryFlags={true}\n theme={themeMode}\n />\n <Popover.Arrow />\n </Popover.Content>\n </Popover.Portal>\n </Popover.Root>\n );\n};\n\n/**\n * A button for picking an emoji alongside a button for unsetting it.\n */\nexport const EmojiPickerBlock = ({\n disabled,\n defaultEmoji,\n emoji,\n onChangeEmoji,\n onClickClear,\n triggerVariant = 'ghost',\n classNames,\n}: EmojiPickerProps) => {\n const { t } = useTranslation('os');\n const [isMd] = useMediaQuery('md');\n\n const [emojiValue, setEmojiValue] = useControllableState<string>({\n prop: emoji,\n onChange: onChangeEmoji,\n defaultProp: defaultEmoji,\n });\n\n const [emojiPickerOpen, setEmojiPickerOpen] = useState<boolean>(false);\n\n return (\n <ButtonGroup classNames={classNames}>\n <Popover.Root open={emojiPickerOpen} onOpenChange={setEmojiPickerOpen}>\n <Popover.Trigger asChild>\n <Button variant={triggerVariant} classNames='grow gap-2 text-2xl plb-1' disabled={disabled}>\n <span className='sr-only'>{t('select emoji label')}</span>\n <span>{emojiValue}</span>\n <Icon icon='ph--caret-down--bold' size={3} />\n </Button>\n </Popover.Trigger>\n <Popover.Content\n side='right'\n sideOffset={isMd ? 0 : -310}\n onKeyDownCapture={(event) => {\n if (event.key === 'Escape') {\n event.stopPropagation();\n setEmojiPickerOpen(false);\n }\n }}\n >\n <EmojiMart\n data={emojiData}\n onEmojiSelect={({ native }: { native?: string }) => {\n if (native) {\n setEmojiValue(native);\n setEmojiPickerOpen(false);\n }\n }}\n autoFocus={true}\n maxFrequentRows={0}\n noCountryFlags={true}\n />\n <Popover.Arrow />\n </Popover.Content>\n </Popover.Root>\n <IconButton\n icon='ph--arrow-counter-clockwise--regular'\n iconOnly\n label={t('clear label')}\n tooltipSide='right'\n variant={triggerVariant}\n onClick={onClickClear}\n disabled={disabled}\n />\n </ButtonGroup>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React from 'react';\n\nimport { type ButtonProps, type IconProps, type ThemedClassName, useTranslation } from '@dxos/react-ui';\nimport { getSize, hues } from '@dxos/react-ui-theme';\n\nimport { PickerButton, type PickerButtonProps } from '../PickerButton';\n\nexport type HuePickerProps = {\n disabled?: boolean;\n defaultValue?: string;\n value?: string;\n onChange?: (nextHue: string) => void;\n onReset?: ButtonProps['onClick'];\n} & Pick<PickerButtonProps, 'disabled' | 'defaultValue' | 'value' | 'onChange' | 'onReset' | 'rootVariant'>;\n\nexport const HuePicker = (props: ThemedClassName<HuePickerProps>) => {\n const { t } = useTranslation('os');\n\n return (\n <PickerButton\n Component={HuePreview}\n label={t('select hue label')}\n icon='ph--palette--regular'\n values={hues}\n {...props}\n />\n );\n};\n\nconst HuePreview = ({ value, size = 5 }: { value: string; size?: IconProps['size'] }) => {\n return (\n <div role='none' className='flex justify-center items-center'>\n <svg viewBox={`0 0 ${size} ${size}`} className={getSize(size)}>\n <rect x={0} y={0} width={size} height={size} fill={`var(--dx-${value}Fill)`} strokeWidth={4} />\n </svg>\n </div>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport React, { type FC, useEffect, useState } from 'react';\n\nimport { Button, DropdownMenu, Icon, type IconProps, type ThemedClassName, Toolbar, Tooltip } from '@dxos/react-ui';\n\nexport type PickerButtonProps = ThemedClassName<{\n Component: FC<{ value: string; size?: IconProps['size'] }>;\n label: string;\n icon: string;\n values: string[];\n disabled?: boolean;\n defaultValue?: string;\n value?: string;\n onChange?: (value: string) => void;\n onReset?: () => void;\n rootVariant?: 'button' | 'toolbar-button';\n iconSize?: IconProps['size'];\n}>;\n\nexport const PickerButton = ({\n Component,\n disabled,\n classNames,\n defaultValue: defaultValueParam,\n value: valueParam,\n values,\n label,\n icon,\n onChange,\n onReset,\n rootVariant = 'button',\n iconSize = 5,\n}: PickerButtonProps) => {\n const [value, setValue] = useControllableState<string>({\n prop: valueParam,\n defaultProp: defaultValueParam,\n onChange,\n });\n // TODO(burdon): useControllableState doesn't update the prop when the value is changed. Replace it.\n useEffect(() => setValue(valueParam), [valueParam]);\n\n const [open, setOpen] = useState<boolean>(false);\n const TriggerRoot = rootVariant === 'toolbar-button' ? Toolbar.Button : Button;\n\n return (\n <DropdownMenu.Root modal={false} open={open} onOpenChange={setOpen}>\n <Tooltip.Trigger asChild content={label} side='bottom'>\n <DropdownMenu.Trigger asChild>\n <TriggerRoot classNames={['gap-2 plb-1', classNames]} disabled={disabled}>\n <span className='sr-only'>{label}</span>\n {(value && <Component value={value} size={iconSize} />) || <Icon icon={icon} size={iconSize} />}\n <Icon icon='ph--caret-down--bold' size={3} />\n </TriggerRoot>\n </DropdownMenu.Trigger>\n </Tooltip.Trigger>\n <DropdownMenu.Portal>\n <DropdownMenu.Content side='bottom' classNames='!is-min'>\n <DropdownMenu.Viewport classNames='grid grid-cols-[repeat(6,min-content)]'>\n {values.map((_value) => {\n return (\n <DropdownMenu.CheckboxItem\n key={_value}\n checked={_value === value}\n onCheckedChange={() => setValue(_value)}\n classNames={'p-1 items-center justify-center aspect-square'}\n >\n <Component value={_value} size={iconSize} />\n </DropdownMenu.CheckboxItem>\n );\n })}\n {onReset && (\n <DropdownMenu.CheckboxItem\n onCheckedChange={() => onReset()}\n classNames={'p-1 items-center justify-center aspect-square'}\n >\n <Icon icon='ph--x--regular' size={iconSize} />\n </DropdownMenu.CheckboxItem>\n )}\n </DropdownMenu.Viewport>\n <DropdownMenu.Arrow />\n </DropdownMenu.Content>\n </DropdownMenu.Portal>\n </DropdownMenu.Root>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React from 'react';\n\nimport { type ButtonProps, Icon, type IconProps, type ThemedClassName, useTranslation } from '@dxos/react-ui';\n\nimport { PickerButton, type PickerButtonProps } from '../PickerButton';\n\nexport type IconPickerProps = {\n disabled?: boolean;\n defaultValue?: string;\n value?: string;\n onChange?: (nextHue: string) => void;\n onReset?: ButtonProps['onClick'];\n} & Pick<\n PickerButtonProps,\n 'disabled' | 'rootVariant' | 'iconSize' | 'defaultValue' | 'value' | 'onChange' | 'onReset'\n>;\n\nexport const IconPicker = ({ ...props }: ThemedClassName<IconPickerProps>) => {\n const { t } = useTranslation('os');\n\n return (\n <PickerButton\n Component={IconPreview}\n label={t('select icon label')}\n icon='ph--selection--regular'\n values={iconValues}\n {...props}\n />\n );\n};\n\nconst IconPreview = ({ value, size }: { value: string; size?: IconProps['size'] }) => {\n return <Icon icon={`ph--${value}--regular`} size={size} />;\n};\n\n/**\n * https://phosphoricons.com\n * NOTE: Select icons that we are unlikely to use for the UI.\n */\nexport const icons = [\n 'ph--house-line--regular',\n 'ph--planet--regular',\n 'ph--castle-turret--regular',\n 'ph--snowflake--regular',\n 'ph--virus--regular',\n 'ph--graph--regular',\n 'ph--air-traffic-control--regular',\n 'ph--asterisk--regular',\n 'ph--atom--regular',\n 'ph--basketball--regular',\n 'ph--butterfly--regular',\n 'ph--cactus--regular',\n 'ph--cake--regular',\n 'ph--calendar-dots--regular',\n 'ph--campfire--regular',\n 'ph--command--regular',\n 'ph--confetti--regular',\n 'ph--detective--regular',\n 'ph--disco-ball--regular',\n 'ph--dna--regular',\n 'ph--factory--regular',\n 'ph--flag-banner-fold--regular',\n 'ph--flask--regular',\n 'ph--flower-lotus--regular',\n 'ph--flying-saucer--regular',\n 'ph--game-controller--regular',\n 'ph--gavel--regular',\n 'ph--gift--regular',\n 'ph--guitar--regular',\n 'ph--hamburger--regular',\n 'ph--handshake--regular',\n 'ph--heart--regular',\n 'ph--lightbulb--regular',\n 'ph--lock--regular',\n 'ph--martini--regular',\n 'ph--medal-military--regular',\n 'ph--moped-front--regular',\n 'ph--office-chair--regular',\n 'ph--paint-brush-household--regular',\n 'ph--peace--regular',\n 'ph--person-simple-hike--regular',\n 'ph--piggy-bank--regular',\n 'ph--potted-plant--regular',\n 'ph--radioactive--regular',\n 'ph--rocket-launch--regular',\n 'ph--shield-star--regular',\n 'ph--shopping-cart--regular',\n 'ph--stethoscope--regular',\n 'ph--student--regular',\n 'ph--sun--regular',\n 'ph--tote--regular',\n 'ph--tree--regular',\n 'ph--users-three--regular',\n 'ph--yin-yang--regular',\n];\n\nexport const iconValues = icons.map((icon) => icon.match(/ph--(.+)--regular/)?.[1] ?? icon);\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["emojiData", "EmojiMart", "useControllableState", "React", "useState", "Button", "ButtonGroup", "Icon", "IconButton", "Popover", "Toolbar", "useMediaQuery", "useThemeContext", "useTranslation", "EmojiPickerToolbarButton", "classNames", "emoji", "disabled", "defaultEmoji", "onChangeEmoji", "t", "useTranslation", "themeMode", "useThemeContext", "_emojiValue", "setEmojiValue", "useControllableState", "prop", "onChange", "defaultProp", "emojiPickerOpen", "setEmojiPickerOpen", "useState", "Popover", "Root", "open", "onOpenChange", "nextOpen", "Trigger", "asChild", "Toolbar", "IconButton", "icon", "label", "iconOnly", "tooltipSide", "Portal", "Content", "side", "onKeyDownCapture", "event", "key", "stopPropagation", "EmojiMart", "data", "emojiData", "onEmojiSelect", "native", "autoFocus", "maxFrequentRows", "noCountryFlags", "theme", "Arrow", "EmojiPickerBlock", "onClickClear", "triggerVariant", "isMd", "useMediaQuery", "emojiValue", "ButtonGroup", "Button", "variant", "span", "className", "Icon", "size", "sideOffset", "onClick", "React", "useTranslation", "getSize", "hues", "useControllableState", "React", "useEffect", "useState", "Button", "DropdownMenu", "Icon", "Toolbar", "Tooltip", "PickerButton", "Component", "disabled", "classNames", "defaultValue", "defaultValueParam", "value", "valueParam", "values", "label", "icon", "onChange", "onReset", "rootVariant", "iconSize", "setValue", "useControllableState", "prop", "defaultProp", "useEffect", "open", "setOpen", "useState", "TriggerRoot", "Toolbar", "Button", "React", "DropdownMenu", "Root", "modal", "onOpenChange", "Tooltip", "Trigger", "asChild", "content", "side", "span", "className", "size", "Icon", "Portal", "Content", "Viewport", "map", "_value", "CheckboxItem", "key", "checked", "onCheckedChange", "Arrow", "HuePicker", "props", "t", "useTranslation", "React", "PickerButton", "Component", "HuePreview", "label", "icon", "values", "hues", "value", "size", "div", "role", "className", "svg", "viewBox", "getSize", "rect", "x", "y", "width", "height", "fill", "strokeWidth", "React", "Icon", "useTranslation", "IconPicker", "props", "t", "useTranslation", "React", "PickerButton", "Component", "IconPreview", "label", "icon", "values", "iconValues", "value", "size", "Icon", "icons", "map", "match"]
|
|
7
7
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"src/components/EmojiPicker/emoji.css":{"bytes":783,"imports":[]},"src/components/EmojiPicker/EmojiPicker.tsx":{"bytes":
|
|
1
|
+
{"inputs":{"src/components/EmojiPicker/emoji.css":{"bytes":783,"imports":[]},"src/components/EmojiPicker/EmojiPicker.tsx":{"bytes":15787,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@emoji-mart/data","kind":"import-statement","external":true},{"path":"@emoji-mart/react","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"src/components/EmojiPicker/emoji.css","kind":"import-statement","original":"./emoji.css"}],"format":"esm"},"src/components/EmojiPicker/index.ts":{"bytes":489,"imports":[{"path":"src/components/EmojiPicker/EmojiPicker.tsx","kind":"import-statement","original":"./EmojiPicker"}],"format":"esm"},"src/components/PickerButton/PickerButton.tsx":{"bytes":10439,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true}],"format":"esm"},"src/components/PickerButton/index.ts":{"bytes":491,"imports":[{"path":"src/components/PickerButton/PickerButton.tsx","kind":"import-statement","original":"./PickerButton"}],"format":"esm"},"src/components/HuePicker/HuePicker.tsx":{"bytes":4475,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"src/components/PickerButton/index.ts","kind":"import-statement","original":"../PickerButton"}],"format":"esm"},"src/components/HuePicker/index.ts":{"bytes":481,"imports":[{"path":"src/components/HuePicker/HuePicker.tsx","kind":"import-statement","original":"./HuePicker"}],"format":"esm"},"src/components/IconPicker/IconPicker.tsx":{"bytes":8223,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"src/components/PickerButton/index.ts","kind":"import-statement","original":"../PickerButton"}],"format":"esm"},"src/components/IconPicker/index.ts":{"bytes":483,"imports":[{"path":"src/components/IconPicker/IconPicker.tsx","kind":"import-statement","original":"./IconPicker"}],"format":"esm"},"src/components/index.ts":{"bytes":760,"imports":[{"path":"src/components/EmojiPicker/index.ts","kind":"import-statement","original":"./EmojiPicker"},{"path":"src/components/HuePicker/index.ts","kind":"import-statement","original":"./HuePicker"},{"path":"src/components/IconPicker/index.ts","kind":"import-statement","original":"./IconPicker"},{"path":"src/components/PickerButton/index.ts","kind":"import-statement","original":"./PickerButton"}],"format":"esm"},"src/index.ts":{"bytes":461,"imports":[{"path":"src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":19735},"dist/lib/browser/index.mjs":{"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@emoji-mart/data","kind":"import-statement","external":true},{"path":"@emoji-mart/react","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true}],"exports":["EmojiPickerBlock","EmojiPickerToolbarButton","HuePicker","IconPicker","PickerButton","iconValues","icons"],"entryPoint":"src/index.ts","cssBundle":"dist/lib/browser/index.css","inputs":{"src/components/EmojiPicker/EmojiPicker.tsx":{"bytesInOutput":4216},"src/components/EmojiPicker/emoji.css":{"bytesInOutput":0},"src/components/EmojiPicker/index.ts":{"bytesInOutput":0},"src/components/index.ts":{"bytesInOutput":0},"src/components/HuePicker/HuePicker.tsx":{"bytesInOutput":1147},"src/components/PickerButton/PickerButton.tsx":{"bytesInOutput":2930},"src/components/PickerButton/index.ts":{"bytesInOutput":0},"src/components/HuePicker/index.ts":{"bytesInOutput":0},"src/components/IconPicker/IconPicker.tsx":{"bytesInOutput":2416},"src/components/IconPicker/index.ts":{"bytesInOutput":0},"src/index.ts":{"bytesInOutput":0}},"bytes":11095},"dist/lib/browser/index.css.map":{"imports":[],"exports":[],"inputs":{},"bytes":1029},"dist/lib/browser/index.css":{"imports":[],"inputs":{"src/components/EmojiPicker/emoji.css":{"bytesInOutput":146}},"bytes":227}}}
|
|
@@ -6,7 +6,7 @@ import emojiData from "@emoji-mart/data";
|
|
|
6
6
|
import EmojiMart from "@emoji-mart/react";
|
|
7
7
|
import { useControllableState } from "@radix-ui/react-use-controllable-state";
|
|
8
8
|
import React, { useState } from "react";
|
|
9
|
-
import { Button, ButtonGroup, Icon, Popover, Toolbar,
|
|
9
|
+
import { Button, ButtonGroup, Icon, IconButton, Popover, Toolbar, useMediaQuery, useThemeContext, useTranslation } from "@dxos/react-ui";
|
|
10
10
|
var EmojiPickerToolbarButton = ({ classNames, emoji, disabled, defaultEmoji, onChangeEmoji }) => {
|
|
11
11
|
var _effect = _useSignals();
|
|
12
12
|
try {
|
|
@@ -23,24 +23,15 @@ var EmojiPickerToolbarButton = ({ classNames, emoji, disabled, defaultEmoji, onC
|
|
|
23
23
|
onOpenChange: (nextOpen) => {
|
|
24
24
|
setEmojiPickerOpen(nextOpen);
|
|
25
25
|
}
|
|
26
|
-
}, /* @__PURE__ */ React.createElement(Tooltip.Trigger, {
|
|
27
|
-
asChild: true,
|
|
28
|
-
content: t("select emoji label"),
|
|
29
|
-
side: "bottom"
|
|
30
26
|
}, /* @__PURE__ */ React.createElement(Popover.Trigger, {
|
|
31
27
|
asChild: true
|
|
32
|
-
}, /* @__PURE__ */ React.createElement(Toolbar.
|
|
33
|
-
classNames: [
|
|
34
|
-
"gap-2 text-2xl plb-1",
|
|
35
|
-
classNames
|
|
36
|
-
],
|
|
37
|
-
disabled
|
|
38
|
-
}, /* @__PURE__ */ React.createElement("span", {
|
|
39
|
-
className: "sr-only"
|
|
40
|
-
}, t("select emoji label")), /* @__PURE__ */ React.createElement(Icon, {
|
|
28
|
+
}, /* @__PURE__ */ React.createElement(Toolbar.IconButton, {
|
|
41
29
|
icon: "ph--user-circle--regular",
|
|
42
|
-
|
|
43
|
-
|
|
30
|
+
label: t("select emoji label"),
|
|
31
|
+
iconOnly: true,
|
|
32
|
+
tooltipSide: "bottom",
|
|
33
|
+
disabled
|
|
34
|
+
})), /* @__PURE__ */ React.createElement(Popover.Portal, null, /* @__PURE__ */ React.createElement(Popover.Content, {
|
|
44
35
|
side: "bottom",
|
|
45
36
|
onKeyDownCapture: (event) => {
|
|
46
37
|
if (event.key === "Escape") {
|
|
@@ -69,9 +60,7 @@ var EmojiPickerBlock = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onClickC
|
|
|
69
60
|
var _effect = _useSignals();
|
|
70
61
|
try {
|
|
71
62
|
const { t } = useTranslation("os");
|
|
72
|
-
const [isMd] = useMediaQuery("md"
|
|
73
|
-
ssr: false
|
|
74
|
-
});
|
|
63
|
+
const [isMd] = useMediaQuery("md");
|
|
75
64
|
const [emojiValue, setEmojiValue] = useControllableState({
|
|
76
65
|
prop: emoji,
|
|
77
66
|
onChange: onChangeEmoji,
|
|
@@ -114,20 +103,15 @@ var EmojiPickerBlock = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onClickC
|
|
|
114
103
|
autoFocus: true,
|
|
115
104
|
maxFrequentRows: 0,
|
|
116
105
|
noCountryFlags: true
|
|
117
|
-
}), /* @__PURE__ */ React.createElement(Popover.Arrow, null))), /* @__PURE__ */ React.createElement(
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
106
|
+
}), /* @__PURE__ */ React.createElement(Popover.Arrow, null))), /* @__PURE__ */ React.createElement(IconButton, {
|
|
107
|
+
icon: "ph--arrow-counter-clockwise--regular",
|
|
108
|
+
iconOnly: true,
|
|
109
|
+
label: t("clear label"),
|
|
110
|
+
tooltipSide: "right",
|
|
122
111
|
variant: triggerVariant,
|
|
123
112
|
onClick: onClickClear,
|
|
124
113
|
disabled
|
|
125
|
-
}
|
|
126
|
-
className: "sr-only"
|
|
127
|
-
}, t("clear label")), /* @__PURE__ */ React.createElement(Icon, {
|
|
128
|
-
icon: "ph--arrow-counter-clockwise--regular",
|
|
129
|
-
size: 5
|
|
130
|
-
}))));
|
|
114
|
+
}));
|
|
131
115
|
} finally {
|
|
132
116
|
_effect.f();
|
|
133
117
|
}
|
|
@@ -137,23 +121,23 @@ var EmojiPickerBlock = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onClickC
|
|
|
137
121
|
import { useSignals as _useSignals3 } from "@preact-signals/safe-react/tracking";
|
|
138
122
|
import React3 from "react";
|
|
139
123
|
import { useTranslation as useTranslation2 } from "@dxos/react-ui";
|
|
140
|
-
import { hues } from "@dxos/react-ui-theme";
|
|
124
|
+
import { getSize, hues } from "@dxos/react-ui-theme";
|
|
141
125
|
|
|
142
126
|
// src/components/PickerButton/PickerButton.tsx
|
|
143
127
|
import { useSignals as _useSignals2 } from "@preact-signals/safe-react/tracking";
|
|
144
128
|
import { useControllableState as useControllableState2 } from "@radix-ui/react-use-controllable-state";
|
|
145
129
|
import React2, { useEffect, useState as useState2 } from "react";
|
|
146
|
-
import { Button as Button2, DropdownMenu, Icon as Icon2, Toolbar as Toolbar2, Tooltip
|
|
147
|
-
var PickerButton = ({ Component, disabled, classNames, defaultValue:
|
|
130
|
+
import { Button as Button2, DropdownMenu, Icon as Icon2, Toolbar as Toolbar2, Tooltip } from "@dxos/react-ui";
|
|
131
|
+
var PickerButton = ({ Component, disabled, classNames, defaultValue: defaultValueParam, value: valueParam, values, label, icon, onChange, onReset, rootVariant = "button", iconSize = 5 }) => {
|
|
148
132
|
var _effect = _useSignals2();
|
|
149
133
|
try {
|
|
150
134
|
const [value, setValue] = useControllableState2({
|
|
151
|
-
prop:
|
|
152
|
-
defaultProp:
|
|
135
|
+
prop: valueParam,
|
|
136
|
+
defaultProp: defaultValueParam,
|
|
153
137
|
onChange
|
|
154
138
|
});
|
|
155
|
-
useEffect(() => setValue(
|
|
156
|
-
|
|
139
|
+
useEffect(() => setValue(valueParam), [
|
|
140
|
+
valueParam
|
|
157
141
|
]);
|
|
158
142
|
const [open, setOpen] = useState2(false);
|
|
159
143
|
const TriggerRoot = rootVariant === "toolbar-button" ? Toolbar2.Button : Button2;
|
|
@@ -161,7 +145,7 @@ var PickerButton = ({ Component, disabled, classNames, defaultValue: _defaultVal
|
|
|
161
145
|
modal: false,
|
|
162
146
|
open,
|
|
163
147
|
onOpenChange: setOpen
|
|
164
|
-
}, /* @__PURE__ */ React2.createElement(
|
|
148
|
+
}, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
|
|
165
149
|
asChild: true,
|
|
166
150
|
content: label,
|
|
167
151
|
side: "bottom"
|
|
@@ -177,7 +161,7 @@ var PickerButton = ({ Component, disabled, classNames, defaultValue: _defaultVal
|
|
|
177
161
|
className: "sr-only"
|
|
178
162
|
}, label), value && /* @__PURE__ */ React2.createElement(Component, {
|
|
179
163
|
value,
|
|
180
|
-
iconSize
|
|
164
|
+
size: iconSize
|
|
181
165
|
}) || /* @__PURE__ */ React2.createElement(Icon2, {
|
|
182
166
|
icon,
|
|
183
167
|
size: iconSize
|
|
@@ -189,15 +173,15 @@ var PickerButton = ({ Component, disabled, classNames, defaultValue: _defaultVal
|
|
|
189
173
|
classNames: "!is-min"
|
|
190
174
|
}, /* @__PURE__ */ React2.createElement(DropdownMenu.Viewport, {
|
|
191
175
|
classNames: "grid grid-cols-[repeat(6,min-content)]"
|
|
192
|
-
}, values.map((
|
|
176
|
+
}, values.map((_value) => {
|
|
193
177
|
return /* @__PURE__ */ React2.createElement(DropdownMenu.CheckboxItem, {
|
|
194
|
-
key:
|
|
195
|
-
checked:
|
|
196
|
-
onCheckedChange: () => setValue(
|
|
178
|
+
key: _value,
|
|
179
|
+
checked: _value === value,
|
|
180
|
+
onCheckedChange: () => setValue(_value),
|
|
197
181
|
classNames: "p-1 items-center justify-center aspect-square"
|
|
198
182
|
}, /* @__PURE__ */ React2.createElement(Component, {
|
|
199
|
-
value:
|
|
200
|
-
iconSize
|
|
183
|
+
value: _value,
|
|
184
|
+
size: iconSize
|
|
201
185
|
}));
|
|
202
186
|
}), onReset && /* @__PURE__ */ React2.createElement(DropdownMenu.CheckboxItem, {
|
|
203
187
|
onCheckedChange: () => onReset(),
|
|
@@ -227,15 +211,15 @@ var HuePicker = (props) => {
|
|
|
227
211
|
_effect.f();
|
|
228
212
|
}
|
|
229
213
|
};
|
|
230
|
-
var HuePreview = ({ value }) => {
|
|
214
|
+
var HuePreview = ({ value, size = 5 }) => {
|
|
231
215
|
var _effect = _useSignals3();
|
|
232
216
|
try {
|
|
233
|
-
const size = 16;
|
|
234
217
|
return /* @__PURE__ */ React3.createElement("div", {
|
|
235
|
-
|
|
218
|
+
role: "none",
|
|
219
|
+
className: "flex justify-center items-center"
|
|
236
220
|
}, /* @__PURE__ */ React3.createElement("svg", {
|
|
237
221
|
viewBox: `0 0 ${size} ${size}`,
|
|
238
|
-
className:
|
|
222
|
+
className: getSize(size)
|
|
239
223
|
}, /* @__PURE__ */ React3.createElement("rect", {
|
|
240
224
|
x: 0,
|
|
241
225
|
y: 0,
|
|
@@ -268,18 +252,24 @@ var IconPicker = ({ ...props }) => {
|
|
|
268
252
|
_effect.f();
|
|
269
253
|
}
|
|
270
254
|
};
|
|
271
|
-
var IconPreview = ({ value,
|
|
255
|
+
var IconPreview = ({ value, size }) => {
|
|
272
256
|
var _effect = _useSignals4();
|
|
273
257
|
try {
|
|
274
258
|
return /* @__PURE__ */ React4.createElement(Icon3, {
|
|
275
259
|
icon: `ph--${value}--regular`,
|
|
276
|
-
size
|
|
260
|
+
size
|
|
277
261
|
});
|
|
278
262
|
} finally {
|
|
279
263
|
_effect.f();
|
|
280
264
|
}
|
|
281
265
|
};
|
|
282
266
|
var icons = [
|
|
267
|
+
"ph--house-line--regular",
|
|
268
|
+
"ph--planet--regular",
|
|
269
|
+
"ph--castle-turret--regular",
|
|
270
|
+
"ph--snowflake--regular",
|
|
271
|
+
"ph--virus--regular",
|
|
272
|
+
"ph--graph--regular",
|
|
283
273
|
"ph--air-traffic-control--regular",
|
|
284
274
|
"ph--asterisk--regular",
|
|
285
275
|
"ph--atom--regular",
|
|
@@ -335,6 +325,8 @@ export {
|
|
|
335
325
|
EmojiPickerToolbarButton,
|
|
336
326
|
HuePicker,
|
|
337
327
|
IconPicker,
|
|
338
|
-
PickerButton
|
|
328
|
+
PickerButton,
|
|
329
|
+
iconValues,
|
|
330
|
+
icons
|
|
339
331
|
};
|
|
340
332
|
//# sourceMappingURL=index.mjs.map
|