@dxos/react-ui-pickers 0.10.0 → 0.11.0

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 (30) hide show
  1. package/dist/lib/assets/react-ui-pickers-IqrPkWEC.css +10 -0
  2. package/dist/lib/index.mjs +248 -0
  3. package/dist/lib/index.mjs.map +1 -0
  4. package/dist/types/src/components/HuePicker/HuePicker.d.ts.map +1 -1
  5. package/dist/types/src/components/IconPicker/IconPicker.d.ts.map +1 -1
  6. package/dist/types/tsconfig.tsbuildinfo +1 -1
  7. package/package.json +11 -18
  8. package/src/components/HuePicker/HuePicker.tsx +2 -1
  9. package/src/components/IconPicker/IconPicker.tsx +1 -1
  10. package/dist/lib/browser/chunk-D3UYVI3X.mjs +0 -64
  11. package/dist/lib/browser/chunk-D3UYVI3X.mjs.map +0 -7
  12. package/dist/lib/browser/components/IconPicker/icons.mjs +0 -9
  13. package/dist/lib/browser/components/IconPicker/icons.mjs.map +0 -7
  14. package/dist/lib/browser/index.css +0 -7
  15. package/dist/lib/browser/index.css.map +0 -7
  16. package/dist/lib/browser/index.mjs +0 -237
  17. package/dist/lib/browser/index.mjs.map +0 -7
  18. package/dist/lib/browser/meta.json +0 -1
  19. package/dist/lib/node-esm/chunk-N4YXLEKA.mjs +0 -66
  20. package/dist/lib/node-esm/chunk-N4YXLEKA.mjs.map +0 -7
  21. package/dist/lib/node-esm/components/IconPicker/icons.mjs +0 -10
  22. package/dist/lib/node-esm/components/IconPicker/icons.mjs.map +0 -7
  23. package/dist/lib/node-esm/index.css +0 -7
  24. package/dist/lib/node-esm/index.css.map +0 -7
  25. package/dist/lib/node-esm/index.mjs +0 -238
  26. package/dist/lib/node-esm/index.mjs.map +0 -7
  27. package/dist/lib/node-esm/meta.json +0 -1
  28. package/dist/types/src/components/IconPicker/icons.d.ts +0 -7
  29. package/dist/types/src/components/IconPicker/icons.d.ts.map +0 -1
  30. package/src/components/IconPicker/icons.ts +0 -66
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dxos/react-ui-pickers",
3
- "version": "0.10.0",
3
+ "version": "0.11.0",
4
4
  "description": "A collection of picker components.",
5
5
  "homepage": "https://dxos.org",
6
6
  "bugs": "https://github.com/dxos/dxos/issues",
@@ -15,14 +15,7 @@
15
15
  ".": {
16
16
  "source": "./src/index.ts",
17
17
  "types": "./dist/types/src/index.d.ts",
18
- "browser": "./dist/lib/browser/index.mjs",
19
- "node": "./dist/lib/node-esm/index.mjs"
20
- },
21
- "./icons": {
22
- "source": "./src/components/IconPicker/icons.ts",
23
- "types": "./dist/types/src/components/IconPicker/icons.d.ts",
24
- "browser": "./dist/lib/browser/components/IconPicker/icons.mjs",
25
- "node": "./dist/lib/node-esm/components/IconPicker/icons.mjs"
18
+ "import": "./dist/lib/index.mjs"
26
19
  }
27
20
  },
28
21
  "types": "dist/types/src/index.d.ts",
@@ -36,25 +29,25 @@
36
29
  "@radix-ui/react-use-controllable-state": "1.1.0",
37
30
  "emoji-mart": "^5.5.2",
38
31
  "react-resize-detector": "^11.0.1",
39
- "@dxos/log": "0.10.0",
40
- "@dxos/ui-types": "0.10.0",
41
- "@dxos/util": "0.10.0"
32
+ "@dxos/ui-types": "0.11.0",
33
+ "@dxos/log": "0.11.0",
34
+ "@dxos/util": "0.11.0"
42
35
  },
43
36
  "devDependencies": {
44
37
  "@types/react": "~19.2.17",
45
38
  "@types/react-dom": "~19.2.3",
46
39
  "react": "~19.2.7",
47
40
  "react-dom": "~19.2.7",
48
- "vite": "^8.0.16",
49
- "@dxos/react-ui": "0.10.0",
50
- "@dxos/ui-theme": "0.10.0",
51
- "@dxos/storybook-utils": "0.10.0"
41
+ "vite": "^8.1.4",
42
+ "@dxos/react-ui": "0.11.0",
43
+ "@dxos/ui-theme": "0.11.0",
44
+ "@dxos/storybook-utils": "0.11.0"
52
45
  },
53
46
  "peerDependencies": {
54
47
  "react": "~19.2.7",
55
48
  "react-dom": "~19.2.7",
56
- "@dxos/react-ui": "0.10.0",
57
- "@dxos/ui-theme": "0.10.0"
49
+ "@dxos/react-ui": "^0.11.0",
50
+ "@dxos/ui-theme": "^0.11.0"
58
51
  },
59
52
  "publishConfig": {
60
53
  "access": "public"
@@ -5,7 +5,8 @@
5
5
  import React from 'react';
6
6
 
7
7
  import { type ButtonProps, type IconProps, type ThemedClassName, useTranslation } from '@dxos/react-ui';
8
- import { getSize, hues, osTranslations } from '@dxos/ui-theme';
8
+ import { getSize, osTranslations } from '@dxos/ui-theme';
9
+ import { hues } from '@dxos/ui-types';
9
10
 
10
11
  import { PickerButton, type PickerButtonProps } from '../PickerButton';
11
12
 
@@ -6,9 +6,9 @@ import React from 'react';
6
6
 
7
7
  import { type ButtonProps, Icon, type IconProps, type ThemedClassName, useTranslation } from '@dxos/react-ui';
8
8
  import { osTranslations } from '@dxos/ui-theme';
9
+ import { iconValues } from '@dxos/ui-types';
9
10
 
10
11
  import { PickerButton, type PickerButtonProps } from '../PickerButton';
11
- import { iconValues } from './icons';
12
12
 
13
13
  export type IconPickerProps = {
14
14
  disabled?: boolean;
@@ -1,64 +0,0 @@
1
- // src/components/IconPicker/icons.ts
2
- var icons = [
3
- "ph--house-line--regular",
4
- "ph--planet--regular",
5
- "ph--castle-turret--regular",
6
- "ph--snowflake--regular",
7
- "ph--virus--regular",
8
- "ph--graph--regular",
9
- "ph--air-traffic-control--regular",
10
- "ph--asterisk--regular",
11
- "ph--atom--regular",
12
- "ph--basketball--regular",
13
- "ph--butterfly--regular",
14
- "ph--cactus--regular",
15
- "ph--cake--regular",
16
- "ph--calendar-dots--regular",
17
- "ph--campfire--regular",
18
- "ph--command--regular",
19
- "ph--confetti--regular",
20
- "ph--detective--regular",
21
- "ph--disco-ball--regular",
22
- "ph--dna--regular",
23
- "ph--factory--regular",
24
- "ph--flag-banner-fold--regular",
25
- "ph--flask--regular",
26
- "ph--flower-lotus--regular",
27
- "ph--flying-saucer--regular",
28
- "ph--game-controller--regular",
29
- "ph--gavel--regular",
30
- "ph--gift--regular",
31
- "ph--guitar--regular",
32
- "ph--hamburger--regular",
33
- "ph--handshake--regular",
34
- "ph--heart--regular",
35
- "ph--lightbulb--regular",
36
- "ph--lock--regular",
37
- "ph--martini--regular",
38
- "ph--medal-military--regular",
39
- "ph--moped-front--regular",
40
- "ph--office-chair--regular",
41
- "ph--paint-brush-household--regular",
42
- "ph--peace--regular",
43
- "ph--person-simple-hike--regular",
44
- "ph--piggy-bank--regular",
45
- "ph--potted-plant--regular",
46
- "ph--radioactive--regular",
47
- "ph--rocket-launch--regular",
48
- "ph--shield-star--regular",
49
- "ph--shopping-cart--regular",
50
- "ph--stethoscope--regular",
51
- "ph--student--regular",
52
- "ph--sun--regular",
53
- "ph--tote--regular",
54
- "ph--tree--regular",
55
- "ph--users-three--regular",
56
- "ph--yin-yang--regular"
57
- ];
58
- var iconValues = icons.map((icon) => icon.match(/ph--(.+)--regular/)?.[1] ?? icon);
59
-
60
- export {
61
- icons,
62
- iconValues
63
- };
64
- //# sourceMappingURL=chunk-D3UYVI3X.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/components/IconPicker/icons.ts"],
4
- "sourcesContent": ["//\n// Copyright 2025 DXOS.org\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": ";AAQO,IAAMA,QAAQ;EACnB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGK,IAAMC,aAAaD,MAAME,IAAI,CAACC,SAASA,KAAKC,MAAM,mBAAA,IAAuB,CAAA,KAAMD,IAAAA;",
6
- "names": ["icons", "iconValues", "map", "icon", "match"]
7
- }
@@ -1,9 +0,0 @@
1
- import {
2
- iconValues,
3
- icons
4
- } from "../../chunk-D3UYVI3X.mjs";
5
- export {
6
- iconValues,
7
- icons
8
- };
9
- //# sourceMappingURL=icons.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": [],
4
- "sourcesContent": [],
5
- "mappings": "",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- /* src/components/EmojiPicker/emoji.css */
2
- [data-theme=dark] em-emoji-picker {
3
- --background-rgb: #3b3b3f;
4
- --rgb-background: #3b3b3f;
5
- --font-family: "Inter Variable", ui-sans-serif;
6
- }
7
- /*# sourceMappingURL=index.css.map */
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/components/EmojiPicker/emoji.css"],
4
- "sourcesContent": ["/**\n * https://github.com/missive/emoji-mart/blob/main/packages/emoji-mart-website/example-custom-styles.html\n */\n[data-theme='dark'] em-emoji-picker {\n /* TODO(burdon): Use tailwind tokens. */\n --background-rgb: #3b3b3f;\n --rgb-background: #3b3b3f;\n --font-family: 'Inter Variable', ui-sans-serif;\n}\n"],
5
- "mappings": ";AAGA,CAAC,iBAAmB;AAElB,oBAAkB;AAClB,oBAAkB;AAClB,iBAAe,gBAAgB,EAAE;AACnC;",
6
- "names": []
7
- }
@@ -1,237 +0,0 @@
1
- import {
2
- iconValues
3
- } from "./chunk-D3UYVI3X.mjs";
4
-
5
- // src/components/EmojiPicker/EmojiPicker.tsx
6
- import emojiData from "@emoji-mart/data";
7
- import EmojiMart from "@emoji-mart/react";
8
- import { useControllableState } from "@radix-ui/react-use-controllable-state";
9
- import React, { useState } from "react";
10
- import { Button, ButtonGroup, Icon, IconButton, Popover, Toolbar, useMediaQuery, useThemeContext, useTranslation } from "@dxos/react-ui";
11
- import { osTranslations } from "@dxos/ui-theme";
12
- var EmojiPickerToolbarButton = ({ classNames, emoji, disabled, defaultEmoji, onChangeEmoji }) => {
13
- const { t } = useTranslation(osTranslations);
14
- const { themeMode } = useThemeContext();
15
- const [_emojiValue, setEmojiValue] = useControllableState({
16
- prop: emoji,
17
- onChange: onChangeEmoji,
18
- defaultProp: defaultEmoji
19
- });
20
- const [emojiPickerOpen, setEmojiPickerOpen] = useState(false);
21
- return /* @__PURE__ */ React.createElement(Popover.Root, {
22
- open: emojiPickerOpen,
23
- onOpenChange: (nextOpen) => {
24
- setEmojiPickerOpen(nextOpen);
25
- }
26
- }, /* @__PURE__ */ React.createElement(Popover.Trigger, {
27
- asChild: true
28
- }, /* @__PURE__ */ React.createElement(Toolbar.IconButton, {
29
- icon: "ph--user-circle--regular",
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, {
35
- side: "bottom",
36
- onKeyDownCapture: (event) => {
37
- if (event.key === "Escape") {
38
- event.stopPropagation();
39
- setEmojiPickerOpen(false);
40
- }
41
- }
42
- }, /* @__PURE__ */ React.createElement(EmojiMart, {
43
- data: emojiData,
44
- onEmojiSelect: ({ native }) => {
45
- if (native) {
46
- setEmojiValue(native);
47
- setEmojiPickerOpen(false);
48
- }
49
- },
50
- autoFocus: true,
51
- maxFrequentRows: 0,
52
- noCountryFlags: true,
53
- theme: themeMode
54
- }), /* @__PURE__ */ React.createElement(Popover.Arrow, null))));
55
- };
56
- var EmojiPickerBlock = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onClickClear, triggerVariant = "ghost", classNames }) => {
57
- const { t } = useTranslation(osTranslations);
58
- const [isMd] = useMediaQuery("md");
59
- const [emojiValue, setEmojiValue] = useControllableState({
60
- prop: emoji,
61
- onChange: onChangeEmoji,
62
- defaultProp: defaultEmoji
63
- });
64
- const [emojiPickerOpen, setEmojiPickerOpen] = useState(false);
65
- return /* @__PURE__ */ React.createElement(ButtonGroup, {
66
- classNames
67
- }, /* @__PURE__ */ React.createElement(Popover.Root, {
68
- open: emojiPickerOpen,
69
- onOpenChange: setEmojiPickerOpen
70
- }, /* @__PURE__ */ React.createElement(Popover.Trigger, {
71
- asChild: true
72
- }, /* @__PURE__ */ React.createElement(Button, {
73
- variant: triggerVariant,
74
- classNames: "grow gap-2 text-2xl py-1",
75
- disabled
76
- }, /* @__PURE__ */ React.createElement("span", {
77
- className: "sr-only"
78
- }, t("select-emoji.label")), /* @__PURE__ */ React.createElement("span", null, emojiValue), /* @__PURE__ */ React.createElement(Icon, {
79
- icon: "ph--caret-down--bold",
80
- size: 3
81
- }))), /* @__PURE__ */ React.createElement(Popover.Content, {
82
- side: "right",
83
- sideOffset: isMd ? 0 : -310,
84
- onKeyDownCapture: (event) => {
85
- if (event.key === "Escape") {
86
- event.stopPropagation();
87
- setEmojiPickerOpen(false);
88
- }
89
- }
90
- }, /* @__PURE__ */ React.createElement(EmojiMart, {
91
- data: emojiData,
92
- onEmojiSelect: ({ native }) => {
93
- if (native) {
94
- setEmojiValue(native);
95
- setEmojiPickerOpen(false);
96
- }
97
- },
98
- autoFocus: true,
99
- maxFrequentRows: 0,
100
- noCountryFlags: true
101
- }), /* @__PURE__ */ React.createElement(Popover.Arrow, null))), /* @__PURE__ */ React.createElement(IconButton, {
102
- icon: "ph--arrow-counter-clockwise--regular",
103
- iconOnly: true,
104
- label: t("clear.label"),
105
- tooltipSide: "right",
106
- variant: triggerVariant,
107
- onClick: onClickClear,
108
- disabled
109
- }));
110
- };
111
-
112
- // src/components/HuePicker/HuePicker.tsx
113
- import React3 from "react";
114
- import { useTranslation as useTranslation2 } from "@dxos/react-ui";
115
- import { getSize, hues, osTranslations as osTranslations2 } from "@dxos/ui-theme";
116
-
117
- // src/components/PickerButton/PickerButton.tsx
118
- import { useControllableState as useControllableState2 } from "@radix-ui/react-use-controllable-state";
119
- import React2, { useEffect, useState as useState2 } from "react";
120
- import { Button as Button2, DropdownMenu, Icon as Icon2, Toolbar as Toolbar2, Tooltip } from "@dxos/react-ui";
121
- var PickerButton = ({ Component, disabled, classNames, defaultValue: defaultValueProp, value: valueProp, values, label, icon, onChange, onReset, rootVariant = "button", iconSize = 5 }) => {
122
- const [value, setValue] = useControllableState2({
123
- prop: valueProp,
124
- defaultProp: defaultValueProp,
125
- onChange
126
- });
127
- useEffect(() => setValue(valueProp), [
128
- valueProp
129
- ]);
130
- const [open, setOpen] = useState2(false);
131
- const TriggerRoot = rootVariant === "toolbar-button" ? Toolbar2.Button : Button2;
132
- return /* @__PURE__ */ React2.createElement(DropdownMenu.Root, {
133
- modal: false,
134
- open,
135
- onOpenChange: setOpen
136
- }, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
137
- asChild: true,
138
- content: label,
139
- side: "bottom"
140
- }, /* @__PURE__ */ React2.createElement(DropdownMenu.Trigger, {
141
- asChild: true
142
- }, /* @__PURE__ */ React2.createElement(TriggerRoot, {
143
- classNames: [
144
- "gap-2 py-1",
145
- classNames
146
- ],
147
- disabled
148
- }, /* @__PURE__ */ React2.createElement("span", {
149
- className: "sr-only"
150
- }, label), value && /* @__PURE__ */ React2.createElement(Component, {
151
- value,
152
- size: iconSize
153
- }) || /* @__PURE__ */ React2.createElement(Icon2, {
154
- icon,
155
- size: iconSize
156
- }), /* @__PURE__ */ React2.createElement(Icon2, {
157
- icon: "ph--caret-down--bold",
158
- size: 3
159
- })))), /* @__PURE__ */ React2.createElement(DropdownMenu.Portal, null, /* @__PURE__ */ React2.createElement(DropdownMenu.Content, {
160
- side: "bottom",
161
- classNames: "!w-min"
162
- }, /* @__PURE__ */ React2.createElement(DropdownMenu.Viewport, {
163
- classNames: "grid grid-cols-[repeat(6,min-content)]"
164
- }, values.map((_value) => {
165
- return /* @__PURE__ */ React2.createElement(DropdownMenu.CheckboxItem, {
166
- key: _value,
167
- checked: _value === value,
168
- onCheckedChange: () => setValue(_value),
169
- classNames: "p-1 items-center justify-center aspect-square"
170
- }, /* @__PURE__ */ React2.createElement(Component, {
171
- value: _value,
172
- size: iconSize
173
- }));
174
- }), onReset && /* @__PURE__ */ React2.createElement(DropdownMenu.CheckboxItem, {
175
- onCheckedChange: () => onReset(),
176
- classNames: "p-1 items-center justify-center aspect-square"
177
- }, /* @__PURE__ */ React2.createElement(Icon2, {
178
- icon: "ph--x--regular",
179
- size: iconSize
180
- }))), /* @__PURE__ */ React2.createElement(DropdownMenu.Arrow, null))));
181
- };
182
-
183
- // src/components/HuePicker/HuePicker.tsx
184
- var HuePicker = (props) => {
185
- const { t } = useTranslation2(osTranslations2);
186
- return /* @__PURE__ */ React3.createElement(PickerButton, {
187
- Component: HuePreview,
188
- label: t("select-hue.label"),
189
- icon: "ph--palette--regular",
190
- values: hues,
191
- ...props
192
- });
193
- };
194
- var HuePreview = ({ value, size = 5 }) => {
195
- return /* @__PURE__ */ React3.createElement("div", {
196
- className: "flex justify-center items-center"
197
- }, /* @__PURE__ */ React3.createElement("svg", {
198
- viewBox: `0 0 ${size} ${size}`,
199
- className: getSize(size)
200
- }, /* @__PURE__ */ React3.createElement("rect", {
201
- x: 0,
202
- y: 0,
203
- width: size,
204
- height: size,
205
- fill: `var(--color-${value}-surface)`,
206
- strokeWidth: 4
207
- })));
208
- };
209
-
210
- // src/components/IconPicker/IconPicker.tsx
211
- import React4 from "react";
212
- import { Icon as Icon3, useTranslation as useTranslation3 } from "@dxos/react-ui";
213
- import { osTranslations as osTranslations3 } from "@dxos/ui-theme";
214
- var IconPicker = ({ ...props }) => {
215
- const { t } = useTranslation3(osTranslations3);
216
- return /* @__PURE__ */ React4.createElement(PickerButton, {
217
- Component: IconPreview,
218
- label: t("select-icon.label"),
219
- icon: "ph--selection--regular",
220
- values: iconValues,
221
- ...props
222
- });
223
- };
224
- var IconPreview = ({ value, size }) => {
225
- return /* @__PURE__ */ React4.createElement(Icon3, {
226
- icon: `ph--${value}--regular`,
227
- size
228
- });
229
- };
230
- export {
231
- EmojiPickerBlock,
232
- EmojiPickerToolbarButton,
233
- HuePicker,
234
- IconPicker,
235
- PickerButton
236
- };
237
- //# sourceMappingURL=index.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 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 './emoji.css';\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';\nimport { osTranslations } from '@dxos/ui-theme';\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(osTranslations);\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(osTranslations);\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 py-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, osTranslations } from '@dxos/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(osTranslations);\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 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(--color-${value}-surface)`} 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: readonly 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: defaultValueProp,\n value: valueProp,\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: valueProp,\n defaultProp: defaultValueProp,\n onChange,\n });\n // TODO(burdon): useControllableState doesn't update the prop when the value is changed. Replace it.\n useEffect(() => setValue(valueProp), [valueProp]);\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 py-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='!w-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';\nimport { osTranslations } from '@dxos/ui-theme';\n\nimport { PickerButton, type PickerButtonProps } from '../PickerButton';\nimport { iconValues } from './icons';\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(osTranslations);\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"],
5
- "mappings": ";;;;;AAMA,OAAOA,eAAe;AACtB,OAAOC,eAAe;AACtB,SAASC,4BAA4B;AACrC,OAAOC,SAASC,gBAAgB;AAEhC,SACEC,QACAC,aAEAC,MACAC,YACAC,SAEAC,SACAC,eACAC,iBACAC,sBACK;AACP,SAASC,sBAAsB;AAcxB,IAAMC,2BAA2B,CAAC,EACvCC,YACAC,OACAC,UACAC,cACAC,cAAa,MAC0B;AACvC,QAAM,EAAEC,EAAC,IAAKR,eAAeC,cAAAA;AAC7B,QAAM,EAAEQ,UAAS,IAAKV,gBAAAA;AAEtB,QAAM,CAACW,aAAaC,aAAAA,IAAiBtB,qBAA6B;IAChEuB,MAAMR;IACNS,UAAUN;IACVO,aAAaR;EACf,CAAA;AAEA,QAAM,CAACS,iBAAiBC,kBAAAA,IAAsBzB,SAAkB,KAAA;AAEhE,SACE,sBAAA,cAACK,QAAQqB,MAAI;IACXC,MAAMH;IACNI,cAAc,CAACC,aAAAA;AACbJ,yBAAmBI,QAAAA;IACrB;KAEA,sBAAA,cAACxB,QAAQyB,SAAO;IAACC,SAAAA;KACf,sBAAA,cAACzB,QAAQF,YAAU;IACjB4B,MAAK;IACLC,OAAOhB,EAAE,oBAAA;IACTiB,UAAAA;IACAC,aAAY;IACZrB;OAGJ,sBAAA,cAACT,QAAQ+B,QAAM,MACb,sBAAA,cAAC/B,QAAQgC,SAAO;IACdC,MAAK;IACLC,kBAAkB,CAACC,UAAAA;AACjB,UAAIA,MAAMC,QAAQ,UAAU;AAC1BD,cAAME,gBAAe;AACrBjB,2BAAmB,KAAA;MACrB;IACF;KAGA,sBAAA,cAAC5B,WAAAA;IACC8C,MAAM/C;IACNgD,eAAe,CAAC,EAAEC,OAAM,MAAuB;AAC7C,UAAIA,QAAQ;AACVzB,sBAAcyB,MAAAA;AACdpB,2BAAmB,KAAA;MACrB;IACF;IACAqB,WAAW;IACXC,iBAAiB;IACjBC,gBAAgB;IAChBC,OAAO/B;MAET,sBAAA,cAACb,QAAQ6C,OAAK,IAAA,CAAA,CAAA,CAAA;AAKxB;AAKO,IAAMC,mBAAmB,CAAC,EAC/BrC,UACAC,cACAF,OACAG,eACAoC,cACAC,iBAAiB,SACjBzC,WAAU,MACO;AACjB,QAAM,EAAEK,EAAC,IAAKR,eAAeC,cAAAA;AAC7B,QAAM,CAAC4C,IAAAA,IAAQ/C,cAAc,IAAA;AAE7B,QAAM,CAACgD,YAAYnC,aAAAA,IAAiBtB,qBAA6B;IAC/DuB,MAAMR;IACNS,UAAUN;IACVO,aAAaR;EACf,CAAA;AAEA,QAAM,CAACS,iBAAiBC,kBAAAA,IAAsBzB,SAAkB,KAAA;AAEhE,SACE,sBAAA,cAACE,aAAAA;IAAYU;KACX,sBAAA,cAACP,QAAQqB,MAAI;IAACC,MAAMH;IAAiBI,cAAcH;KACjD,sBAAA,cAACpB,QAAQyB,SAAO;IAACC,SAAAA;KACf,sBAAA,cAAC9B,QAAAA;IAAOuD,SAASH;IAAgBzC,YAAW;IAA2BE;KACrE,sBAAA,cAAC2C,QAAAA;IAAKC,WAAU;KAAWzC,EAAE,oBAAA,CAAA,GAC7B,sBAAA,cAACwC,QAAAA,MAAMF,UAAAA,GACP,sBAAA,cAACpD,MAAAA;IAAK6B,MAAK;IAAuB2B,MAAM;QAG5C,sBAAA,cAACtD,QAAQgC,SAAO;IACdC,MAAK;IACLsB,YAAYN,OAAO,IAAI;IACvBf,kBAAkB,CAACC,UAAAA;AACjB,UAAIA,MAAMC,QAAQ,UAAU;AAC1BD,cAAME,gBAAe;AACrBjB,2BAAmB,KAAA;MACrB;IACF;KAEA,sBAAA,cAAC5B,WAAAA;IACC8C,MAAM/C;IACNgD,eAAe,CAAC,EAAEC,OAAM,MAAuB;AAC7C,UAAIA,QAAQ;AACVzB,sBAAcyB,MAAAA;AACdpB,2BAAmB,KAAA;MACrB;IACF;IACAqB,WAAW;IACXC,iBAAiB;IACjBC,gBAAgB;MAElB,sBAAA,cAAC3C,QAAQ6C,OAAK,IAAA,CAAA,CAAA,GAGlB,sBAAA,cAAC9C,YAAAA;IACC4B,MAAK;IACLE,UAAAA;IACAD,OAAOhB,EAAE,aAAA;IACTkB,aAAY;IACZqB,SAASH;IACTQ,SAAST;IACTtC;;AAIR;;;ACxKA,OAAOgD,YAAW;AAElB,SAAiEC,kBAAAA,uBAAsB;AACvF,SAASC,SAASC,MAAMC,kBAAAA,uBAAsB;;;ACH9C,SAASC,wBAAAA,6BAA4B;AACrC,OAAOC,UAAkBC,WAAWC,YAAAA,iBAAgB;AAEpD,SAASC,UAAAA,SAAQC,cAAcC,QAAAA,OAA4CC,WAAAA,UAASC,eAAe;AAgB5F,IAAMC,eAAe,CAAC,EAC3BC,WACAC,UACAC,YACAC,cAAcC,kBACdC,OAAOC,WACPC,QACAC,OACAC,MACAC,UACAC,SACAC,cAAc,UACdC,WAAW,EAAC,MACM;AAClB,QAAM,CAACR,OAAOS,QAAAA,IAAYxB,sBAA6B;IACrDyB,MAAMT;IACNU,aAAaZ;IACbM;EACF,CAAA;AAEAlB,YAAU,MAAMsB,SAASR,SAAAA,GAAY;IAACA;GAAU;AAEhD,QAAM,CAACW,MAAMC,OAAAA,IAAWzB,UAAkB,KAAA;AAC1C,QAAM0B,cAAcP,gBAAgB,mBAAmBf,SAAQH,SAASA;AAExE,SACE,gBAAAH,OAAA,cAACI,aAAayB,MAAI;IAACC,OAAO;IAAOJ;IAAYK,cAAcJ;KACzD,gBAAA3B,OAAA,cAACO,QAAQyB,SAAO;IAACC,SAAAA;IAAQC,SAASjB;IAAOkB,MAAK;KAC5C,gBAAAnC,OAAA,cAACI,aAAa4B,SAAO;IAACC,SAAAA;KACpB,gBAAAjC,OAAA,cAAC4B,aAAAA;IAAYjB,YAAY;MAAC;MAAcA;;IAAaD;KACnD,gBAAAV,OAAA,cAACoC,QAAAA;IAAKC,WAAU;KAAWpB,KAAAA,GACzBH,SAAS,gBAAAd,OAAA,cAACS,WAAAA;IAAUK;IAAcwB,MAAMhB;QAAiB,gBAAAtB,OAAA,cAACK,OAAAA;IAAKa;IAAYoB,MAAMhB;MACnF,gBAAAtB,OAAA,cAACK,OAAAA;IAAKa,MAAK;IAAuBoB,MAAM;SAI9C,gBAAAtC,OAAA,cAACI,aAAamC,QAAM,MAClB,gBAAAvC,OAAA,cAACI,aAAaoC,SAAO;IAACL,MAAK;IAASxB,YAAW;KAC7C,gBAAAX,OAAA,cAACI,aAAaqC,UAAQ;IAAC9B,YAAW;KAC/BK,OAAO0B,IAAI,CAACC,WAAAA;AACX,WACE,gBAAA3C,OAAA,cAACI,aAAawC,cAAY;MACxBC,KAAKF;MACLG,SAASH,WAAW7B;MACpBiC,iBAAiB,MAAMxB,SAASoB,MAAAA;MAChChC,YAAY;OAEZ,gBAAAX,OAAA,cAACS,WAAAA;MAAUK,OAAO6B;MAAQL,MAAMhB;;EAGtC,CAAA,GACCF,WACC,gBAAApB,OAAA,cAACI,aAAawC,cAAY;IACxBG,iBAAiB,MAAM3B,QAAAA;IACvBT,YAAY;KAEZ,gBAAAX,OAAA,cAACK,OAAAA;IAAKa,MAAK;IAAiBoB,MAAMhB;QAIxC,gBAAAtB,OAAA,cAACI,aAAa4C,OAAK,IAAA,CAAA,CAAA,CAAA;AAK7B;;;ADrEO,IAAMC,YAAY,CAACC,UAAAA;AACxB,QAAM,EAAEC,EAAC,IAAKC,gBAAeC,eAAAA;AAE7B,SACE,gBAAAC,OAAA,cAACC,cAAAA;IACCC,WAAWC;IACXC,OAAOP,EAAE,kBAAA;IACTQ,MAAK;IACLC,QAAQC;IACP,GAAGX;;AAGV;AAEA,IAAMO,aAAa,CAAC,EAAEK,OAAOC,OAAO,EAAC,MAA+C;AAClF,SACE,gBAAAT,OAAA,cAACU,OAAAA;IAAIC,WAAU;KACb,gBAAAX,OAAA,cAACY,OAAAA;IAAIC,SAAS,OAAOJ,IAAAA,IAAQA,IAAAA;IAAQE,WAAWG,QAAQL,IAAAA;KACtD,gBAAAT,OAAA,cAACe,QAAAA;IAAKC,GAAG;IAAGC,GAAG;IAAGC,OAAOT;IAAMU,QAAQV;IAAMW,MAAM,eAAeZ,KAAAA;IAAkBa,aAAa;;AAIzG;;;AErCA,OAAOC,YAAW;AAElB,SAA2BC,QAAAA,OAA4CC,kBAAAA,uBAAsB;AAC7F,SAASC,kBAAAA,uBAAsB;AAgBxB,IAAMC,aAAa,CAAC,EAAE,GAAGC,MAAAA,MAAyC;AACvE,QAAM,EAAEC,EAAC,IAAKC,gBAAeC,eAAAA;AAE7B,SACE,gBAAAC,OAAA,cAACC,cAAAA;IACCC,WAAWC;IACXC,OAAOP,EAAE,mBAAA;IACTQ,MAAK;IACLC,QAAQC;IACP,GAAGX;;AAGV;AAEA,IAAMO,cAAc,CAAC,EAAEK,OAAOC,KAAI,MAA+C;AAC/E,SAAO,gBAAAT,OAAA,cAACU,OAAAA;IAAKL,MAAM,OAAOG,KAAAA;IAAkBC;;AAC9C;",
6
- "names": ["emojiData", "EmojiMart", "useControllableState", "React", "useState", "Button", "ButtonGroup", "Icon", "IconButton", "Popover", "Toolbar", "useMediaQuery", "useThemeContext", "useTranslation", "osTranslations", "EmojiPickerToolbarButton", "classNames", "emoji", "disabled", "defaultEmoji", "onChangeEmoji", "t", "themeMode", "_emojiValue", "setEmojiValue", "prop", "onChange", "defaultProp", "emojiPickerOpen", "setEmojiPickerOpen", "Root", "open", "onOpenChange", "nextOpen", "Trigger", "asChild", "icon", "label", "iconOnly", "tooltipSide", "Portal", "Content", "side", "onKeyDownCapture", "event", "key", "stopPropagation", "data", "onEmojiSelect", "native", "autoFocus", "maxFrequentRows", "noCountryFlags", "theme", "Arrow", "EmojiPickerBlock", "onClickClear", "triggerVariant", "isMd", "emojiValue", "variant", "span", "className", "size", "sideOffset", "onClick", "React", "useTranslation", "getSize", "hues", "osTranslations", "useControllableState", "React", "useEffect", "useState", "Button", "DropdownMenu", "Icon", "Toolbar", "Tooltip", "PickerButton", "Component", "disabled", "classNames", "defaultValue", "defaultValueProp", "value", "valueProp", "values", "label", "icon", "onChange", "onReset", "rootVariant", "iconSize", "setValue", "prop", "defaultProp", "open", "setOpen", "TriggerRoot", "Root", "modal", "onOpenChange", "Trigger", "asChild", "content", "side", "span", "className", "size", "Portal", "Content", "Viewport", "map", "_value", "CheckboxItem", "key", "checked", "onCheckedChange", "Arrow", "HuePicker", "props", "t", "useTranslation", "osTranslations", "React", "PickerButton", "Component", "HuePreview", "label", "icon", "values", "hues", "value", "size", "div", "className", "svg", "viewBox", "getSize", "rect", "x", "y", "width", "height", "fill", "strokeWidth", "React", "Icon", "useTranslation", "osTranslations", "IconPicker", "props", "t", "useTranslation", "osTranslations", "React", "PickerButton", "Component", "IconPreview", "label", "icon", "values", "iconValues", "value", "size", "Icon"]
7
- }
@@ -1 +0,0 @@
1
- {"inputs":{"src/components/EmojiPicker/emoji.css":{"bytes":305,"imports":[]},"src/components/EmojiPicker/EmojiPicker.tsx":{"bytes":15243,"imports":[{"path":"src/components/EmojiPicker/emoji.css","kind":"import-statement","original":"./emoji.css"},{"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":"@dxos/ui-theme","kind":"import-statement","external":true}],"format":"esm"},"src/components/EmojiPicker/index.ts":{"bytes":387,"imports":[{"path":"src/components/EmojiPicker/EmojiPicker.tsx","kind":"import-statement","original":"./EmojiPicker"}],"format":"esm"},"src/components/PickerButton/PickerButton.tsx":{"bytes":9894,"imports":[{"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":388,"imports":[{"path":"src/components/PickerButton/PickerButton.tsx","kind":"import-statement","original":"./PickerButton"}],"format":"esm"},"src/components/HuePicker/HuePicker.tsx":{"bytes":4056,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/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":377,"imports":[{"path":"src/components/HuePicker/HuePicker.tsx","kind":"import-statement","original":"./HuePicker"}],"format":"esm"},"src/components/IconPicker/icons.ts":{"bytes":5124,"imports":[],"format":"esm"},"src/components/IconPicker/IconPicker.tsx":{"bytes":3314,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"src/components/PickerButton/index.ts","kind":"import-statement","original":"../PickerButton"},{"path":"src/components/IconPicker/icons.ts","kind":"import-statement","original":"./icons"}],"format":"esm"},"src/components/IconPicker/index.ts":{"bytes":382,"imports":[{"path":"src/components/IconPicker/IconPicker.tsx","kind":"import-statement","original":"./IconPicker"}],"format":"esm"},"src/components/index.ts":{"bytes":670,"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":382,"imports":[{"path":"src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":17563},"dist/lib/browser/index.mjs":{"imports":[{"path":"dist/lib/browser/chunk-D3UYVI3X.mjs","kind":"import-statement"},{"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":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","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":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true}],"exports":["EmojiPickerBlock","EmojiPickerToolbarButton","HuePicker","IconPicker","PickerButton"],"entryPoint":"src/index.ts","cssBundle":"dist/lib/browser/index.css","inputs":{"src/components/EmojiPicker/emoji.css":{"bytesInOutput":0},"src/components/EmojiPicker/EmojiPicker.tsx":{"bytesInOutput":3865},"src/components/EmojiPicker/index.ts":{"bytesInOutput":0},"src/components/index.ts":{"bytesInOutput":0},"src/components/HuePicker/HuePicker.tsx":{"bytesInOutput":900},"src/components/PickerButton/PickerButton.tsx":{"bytesInOutput":2647},"src/components/PickerButton/index.ts":{"bytesInOutput":0},"src/components/HuePicker/index.ts":{"bytesInOutput":0},"src/components/IconPicker/IconPicker.tsx":{"bytesInOutput":622},"src/components/IconPicker/index.ts":{"bytesInOutput":0},"src/index.ts":{"bytesInOutput":0}},"bytes":8451},"dist/lib/browser/components/IconPicker/icons.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":93},"dist/lib/browser/components/IconPicker/icons.mjs":{"imports":[{"path":"dist/lib/browser/chunk-D3UYVI3X.mjs","kind":"import-statement"}],"exports":["iconValues","icons"],"entryPoint":"src/components/IconPicker/icons.ts","inputs":{},"bytes":135},"dist/lib/browser/chunk-D3UYVI3X.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":2390},"dist/lib/browser/chunk-D3UYVI3X.mjs":{"imports":[],"exports":["iconValues","icons"],"inputs":{"src/components/IconPicker/icons.ts":{"bytesInOutput":1617}},"bytes":1734},"dist/lib/browser/index.css.map":{"imports":[],"exports":[],"inputs":{},"bytes":530},"dist/lib/browser/index.css":{"imports":[],"inputs":{"src/components/EmojiPicker/emoji.css":{"bytesInOutput":146}},"bytes":227}}}
@@ -1,66 +0,0 @@
1
- import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
2
-
3
- // src/components/IconPicker/icons.ts
4
- var icons = [
5
- "ph--house-line--regular",
6
- "ph--planet--regular",
7
- "ph--castle-turret--regular",
8
- "ph--snowflake--regular",
9
- "ph--virus--regular",
10
- "ph--graph--regular",
11
- "ph--air-traffic-control--regular",
12
- "ph--asterisk--regular",
13
- "ph--atom--regular",
14
- "ph--basketball--regular",
15
- "ph--butterfly--regular",
16
- "ph--cactus--regular",
17
- "ph--cake--regular",
18
- "ph--calendar-dots--regular",
19
- "ph--campfire--regular",
20
- "ph--command--regular",
21
- "ph--confetti--regular",
22
- "ph--detective--regular",
23
- "ph--disco-ball--regular",
24
- "ph--dna--regular",
25
- "ph--factory--regular",
26
- "ph--flag-banner-fold--regular",
27
- "ph--flask--regular",
28
- "ph--flower-lotus--regular",
29
- "ph--flying-saucer--regular",
30
- "ph--game-controller--regular",
31
- "ph--gavel--regular",
32
- "ph--gift--regular",
33
- "ph--guitar--regular",
34
- "ph--hamburger--regular",
35
- "ph--handshake--regular",
36
- "ph--heart--regular",
37
- "ph--lightbulb--regular",
38
- "ph--lock--regular",
39
- "ph--martini--regular",
40
- "ph--medal-military--regular",
41
- "ph--moped-front--regular",
42
- "ph--office-chair--regular",
43
- "ph--paint-brush-household--regular",
44
- "ph--peace--regular",
45
- "ph--person-simple-hike--regular",
46
- "ph--piggy-bank--regular",
47
- "ph--potted-plant--regular",
48
- "ph--radioactive--regular",
49
- "ph--rocket-launch--regular",
50
- "ph--shield-star--regular",
51
- "ph--shopping-cart--regular",
52
- "ph--stethoscope--regular",
53
- "ph--student--regular",
54
- "ph--sun--regular",
55
- "ph--tote--regular",
56
- "ph--tree--regular",
57
- "ph--users-three--regular",
58
- "ph--yin-yang--regular"
59
- ];
60
- var iconValues = icons.map((icon) => icon.match(/ph--(.+)--regular/)?.[1] ?? icon);
61
-
62
- export {
63
- icons,
64
- iconValues
65
- };
66
- //# sourceMappingURL=chunk-N4YXLEKA.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/components/IconPicker/icons.ts"],
4
- "sourcesContent": ["//\n// Copyright 2025 DXOS.org\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": ";;;AAQO,IAAMA,QAAQ;EACnB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGK,IAAMC,aAAaD,MAAME,IAAI,CAACC,SAASA,KAAKC,MAAM,mBAAA,IAAuB,CAAA,KAAMD,IAAAA;",
6
- "names": ["icons", "iconValues", "map", "icon", "match"]
7
- }
@@ -1,10 +0,0 @@
1
- import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
2
- import {
3
- iconValues,
4
- icons
5
- } from "../../chunk-N4YXLEKA.mjs";
6
- export {
7
- iconValues,
8
- icons
9
- };
10
- //# sourceMappingURL=icons.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": [],
4
- "sourcesContent": [],
5
- "mappings": "",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- /* src/components/EmojiPicker/emoji.css */
2
- [data-theme=dark] em-emoji-picker {
3
- --background-rgb: #3b3b3f;
4
- --rgb-background: #3b3b3f;
5
- --font-family: "Inter Variable", ui-sans-serif;
6
- }
7
- /*# sourceMappingURL=index.css.map */
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/components/EmojiPicker/emoji.css"],
4
- "sourcesContent": ["/**\n * https://github.com/missive/emoji-mart/blob/main/packages/emoji-mart-website/example-custom-styles.html\n */\n[data-theme='dark'] em-emoji-picker {\n /* TODO(burdon): Use tailwind tokens. */\n --background-rgb: #3b3b3f;\n --rgb-background: #3b3b3f;\n --font-family: 'Inter Variable', ui-sans-serif;\n}\n"],
5
- "mappings": ";AAGA,CAAC,iBAAmB;AAElB,oBAAkB;AAClB,oBAAkB;AAClB,iBAAe,gBAAgB,EAAE;AACnC;",
6
- "names": []
7
- }