@ultraviolet/ui 2.0.5 → 2.1.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.
@@ -22,6 +22,7 @@ export { Expandable } from './Expandable';
22
22
  export { ExpandableCard } from './ExpandableCard';
23
23
  export { GlobalAlert } from './GlobalAlert';
24
24
  export { InfiniteScroll } from './InfiniteScroll';
25
+ export { Key } from './Key';
25
26
  export { Label } from './Label';
26
27
  export { LineChart } from './LineChart';
27
28
  export { Link } from './Link';
package/dist/index.cjs CHANGED
@@ -31,55 +31,56 @@ const index$l = require("./components/Expandable/index.cjs");
31
31
  const index$m = require("./components/ExpandableCard/index.cjs");
32
32
  const index$n = require("./components/GlobalAlert/index.cjs");
33
33
  const index$o = require("./components/InfiniteScroll/index.cjs");
34
- const index$p = require("./components/Label/index.cjs");
35
- const index$q = require("./components/LineChart/index.cjs");
36
- const index$r = require("./components/Link/index.cjs");
37
- const index$s = require("./components/List/index.cjs");
38
- const index$t = require("./components/Loader/index.cjs");
39
- const index$u = require("./components/Menu/index.cjs");
40
- const index$v = require("./components/Meter/index.cjs");
41
- const index$w = require("./components/Modal/index.cjs");
42
- const index$x = require("./components/Notice/index.cjs");
43
- const index$y = require("./components/Notification/index.cjs");
44
- const index$z = require("./components/NumberInput/index.cjs");
45
- const index$A = require("./components/Pagination/index.cjs");
46
- const index$B = require("./components/PasswordCheck/index.cjs");
47
- const index$C = require("./components/PieChart/index.cjs");
48
- const index$D = require("./components/Popover/index.cjs");
49
- const index$E = require("./components/Popup/index.cjs");
50
- const index$F = require("./components/ProgressBar/index.cjs");
51
- const index$G = require("./components/Radio/index.cjs");
52
- const index$H = require("./components/RadioGroup/index.cjs");
53
- const index$I = require("./components/Row/index.cjs");
54
- const index$J = require("./components/SearchInput/index.cjs");
55
- const index$K = require("./components/SelectableCard/index.cjs");
56
- const index$L = require("./components/SelectableCardGroup/index.cjs");
57
- const index$M = require("./components/SelectableCardOptionGroup/index.cjs");
58
- const index$N = require("./components/SelectInput/index.cjs");
59
- const index$O = require("./components/Separator/index.cjs");
60
- const index$P = require("./components/Skeleton/index.cjs");
61
- const index$Q = require("./components/Slider/index.cjs");
62
- const index$R = require("./components/Snippet/index.cjs");
63
- const index$S = require("./components/Stack/index.cjs");
64
- const index$T = require("./components/Status/index.cjs");
65
- const index$U = require("./components/StepList/index.cjs");
66
- const index$V = require("./components/Stepper/index.cjs");
67
- const index$W = require("./components/SwitchButton/index.cjs");
68
- const index$X = require("./components/Table/index.cjs");
69
- const index$Y = require("./components/Tabs/index.cjs");
70
- const index$Z = require("./components/Tag/index.cjs");
71
- const index$_ = require("./components/TagInput/index.cjs");
72
- const index$$ = require("./components/TagList/index.cjs");
73
- const index$10 = require("./components/Text/index.cjs");
74
- const index$11 = require("./components/TextArea/index.cjs");
75
- const index$12 = require("./components/TextInput/index.cjs");
76
- const index$13 = require("./components/TimeInput/index.cjs");
77
- const index$14 = require("./components/Toaster/index.cjs");
78
- const index$15 = require("./components/Toggle/index.cjs");
79
- const index$16 = require("./components/ToggleGroup/index.cjs");
80
- const index$17 = require("./components/Tooltip/index.cjs");
81
- const index$18 = require("./components/UnitInput/index.cjs");
82
- const index$19 = require("./components/VerificationCode/index.cjs");
34
+ const index$p = require("./components/Key/index.cjs");
35
+ const index$q = require("./components/Label/index.cjs");
36
+ const index$r = require("./components/LineChart/index.cjs");
37
+ const index$s = require("./components/Link/index.cjs");
38
+ const index$t = require("./components/List/index.cjs");
39
+ const index$u = require("./components/Loader/index.cjs");
40
+ const index$v = require("./components/Menu/index.cjs");
41
+ const index$w = require("./components/Meter/index.cjs");
42
+ const index$x = require("./components/Modal/index.cjs");
43
+ const index$y = require("./components/Notice/index.cjs");
44
+ const index$z = require("./components/Notification/index.cjs");
45
+ const index$A = require("./components/NumberInput/index.cjs");
46
+ const index$B = require("./components/Pagination/index.cjs");
47
+ const index$C = require("./components/PasswordCheck/index.cjs");
48
+ const index$D = require("./components/PieChart/index.cjs");
49
+ const index$E = require("./components/Popover/index.cjs");
50
+ const index$F = require("./components/Popup/index.cjs");
51
+ const index$G = require("./components/ProgressBar/index.cjs");
52
+ const index$H = require("./components/Radio/index.cjs");
53
+ const index$I = require("./components/RadioGroup/index.cjs");
54
+ const index$J = require("./components/Row/index.cjs");
55
+ const index$K = require("./components/SearchInput/index.cjs");
56
+ const index$L = require("./components/SelectableCard/index.cjs");
57
+ const index$M = require("./components/SelectableCardGroup/index.cjs");
58
+ const index$N = require("./components/SelectableCardOptionGroup/index.cjs");
59
+ const index$O = require("./components/SelectInput/index.cjs");
60
+ const index$P = require("./components/Separator/index.cjs");
61
+ const index$Q = require("./components/Skeleton/index.cjs");
62
+ const index$R = require("./components/Slider/index.cjs");
63
+ const index$S = require("./components/Snippet/index.cjs");
64
+ const index$T = require("./components/Stack/index.cjs");
65
+ const index$U = require("./components/Status/index.cjs");
66
+ const index$V = require("./components/StepList/index.cjs");
67
+ const index$W = require("./components/Stepper/index.cjs");
68
+ const index$X = require("./components/SwitchButton/index.cjs");
69
+ const index$Y = require("./components/Table/index.cjs");
70
+ const index$Z = require("./components/Tabs/index.cjs");
71
+ const index$_ = require("./components/Tag/index.cjs");
72
+ const index$$ = require("./components/TagInput/index.cjs");
73
+ const index$10 = require("./components/TagList/index.cjs");
74
+ const index$11 = require("./components/Text/index.cjs");
75
+ const index$12 = require("./components/TextArea/index.cjs");
76
+ const index$13 = require("./components/TextInput/index.cjs");
77
+ const index$14 = require("./components/TimeInput/index.cjs");
78
+ const index$15 = require("./components/Toaster/index.cjs");
79
+ const index$16 = require("./components/Toggle/index.cjs");
80
+ const index$17 = require("./components/ToggleGroup/index.cjs");
81
+ const index$18 = require("./components/Tooltip/index.cjs");
82
+ const index$19 = require("./components/UnitInput/index.cjs");
83
+ const index$1a = require("./components/VerificationCode/index.cjs");
83
84
  exports.extendTheme = index.extendTheme;
84
85
  exports.Breakpoint = Breakpoint;
85
86
  exports.normalize = normalize;
@@ -146,54 +147,55 @@ exports.Expandable = index$l.Expandable;
146
147
  exports.ExpandableCard = index$m.ExpandableCard;
147
148
  exports.GlobalAlert = index$n.GlobalAlert;
148
149
  exports.InfiniteScroll = index$o.InfiniteScroll;
149
- exports.Label = index$p.Label;
150
- exports.LineChart = index$q.LineChart;
151
- exports.Link = index$r.Link;
152
- exports.List = index$s.List;
153
- exports.Loader = index$t.Loader;
154
- exports.Menu = index$u.Menu;
155
- exports.Meter = index$v.Meter;
156
- exports.Modal = index$w.Modal;
157
- exports.Notice = index$x.Notice;
158
- exports.NotificationContainer = index$y.NotificationContainer;
159
- exports.notification = index$y.notification;
160
- exports.NumberInput = index$z.NumberInput;
161
- exports.Pagination = index$A.Pagination;
162
- exports.PasswordCheck = index$B.PasswordCheck;
163
- exports.PieChart = index$C.PieChart;
164
- exports.Popover = index$D.Popover;
165
- exports.Popup = index$E.Popup;
166
- exports.ProgressBar = index$F.ProgressBar;
167
- exports.Radio = index$G.Radio;
168
- exports.RadioGroup = index$H.RadioGroup;
169
- exports.Row = index$I.Row;
170
- exports.SearchInput = index$J.SearchInput;
171
- exports.SelectableCard = index$K.SelectableCard;
172
- exports.SelectableCardGroup = index$L.SelectableCardGroup;
173
- exports.SelectableCardOptionGroup = index$M.SelectableCardOptionGroup;
174
- exports.SelectInput = index$N.SelectInput;
175
- exports.Separator = index$O.Separator;
176
- exports.Skeleton = index$P.Skeleton;
177
- exports.Slider = index$Q.Slider;
178
- exports.Snippet = index$R.Snippet;
179
- exports.Stack = index$S.Stack;
180
- exports.Status = index$T.Status;
181
- exports.StepList = index$U.StepList;
182
- exports.Stepper = index$V.Stepper;
183
- exports.SwitchButton = index$W.SwitchButton;
184
- exports.Table = index$X.Table;
185
- exports.Tabs = index$Y.Tabs;
186
- exports.Tag = index$Z.Tag;
187
- exports.TagInput = index$_.TagInput;
188
- exports.TagList = index$$.TagList;
189
- exports.Text = index$10.Text;
190
- exports.TextArea = index$11.TextArea;
191
- exports.TextInput = index$12.TextInput;
192
- exports.TimeInput = index$13.TimeInput;
193
- exports.ToastContainer = index$14.ToastContainer;
194
- exports.toast = index$14.toast;
195
- exports.Toggle = index$15.Toggle;
196
- exports.ToggleGroup = index$16.ToggleGroup;
197
- exports.Tooltip = index$17.Tooltip;
198
- exports.UnitInput = index$18.UnitInput;
199
- exports.VerificationCode = index$19.VerificationCode;
150
+ exports.Key = index$p.Key;
151
+ exports.Label = index$q.Label;
152
+ exports.LineChart = index$r.LineChart;
153
+ exports.Link = index$s.Link;
154
+ exports.List = index$t.List;
155
+ exports.Loader = index$u.Loader;
156
+ exports.Menu = index$v.Menu;
157
+ exports.Meter = index$w.Meter;
158
+ exports.Modal = index$x.Modal;
159
+ exports.Notice = index$y.Notice;
160
+ exports.NotificationContainer = index$z.NotificationContainer;
161
+ exports.notification = index$z.notification;
162
+ exports.NumberInput = index$A.NumberInput;
163
+ exports.Pagination = index$B.Pagination;
164
+ exports.PasswordCheck = index$C.PasswordCheck;
165
+ exports.PieChart = index$D.PieChart;
166
+ exports.Popover = index$E.Popover;
167
+ exports.Popup = index$F.Popup;
168
+ exports.ProgressBar = index$G.ProgressBar;
169
+ exports.Radio = index$H.Radio;
170
+ exports.RadioGroup = index$I.RadioGroup;
171
+ exports.Row = index$J.Row;
172
+ exports.SearchInput = index$K.SearchInput;
173
+ exports.SelectableCard = index$L.SelectableCard;
174
+ exports.SelectableCardGroup = index$M.SelectableCardGroup;
175
+ exports.SelectableCardOptionGroup = index$N.SelectableCardOptionGroup;
176
+ exports.SelectInput = index$O.SelectInput;
177
+ exports.Separator = index$P.Separator;
178
+ exports.Skeleton = index$Q.Skeleton;
179
+ exports.Slider = index$R.Slider;
180
+ exports.Snippet = index$S.Snippet;
181
+ exports.Stack = index$T.Stack;
182
+ exports.Status = index$U.Status;
183
+ exports.StepList = index$V.StepList;
184
+ exports.Stepper = index$W.Stepper;
185
+ exports.SwitchButton = index$X.SwitchButton;
186
+ exports.Table = index$Y.Table;
187
+ exports.Tabs = index$Z.Tabs;
188
+ exports.Tag = index$_.Tag;
189
+ exports.TagInput = index$$.TagInput;
190
+ exports.TagList = index$10.TagList;
191
+ exports.Text = index$11.Text;
192
+ exports.TextArea = index$12.TextArea;
193
+ exports.TextInput = index$13.TextInput;
194
+ exports.TimeInput = index$14.TimeInput;
195
+ exports.ToastContainer = index$15.ToastContainer;
196
+ exports.toast = index$15.toast;
197
+ exports.Toggle = index$16.Toggle;
198
+ exports.ToggleGroup = index$17.ToggleGroup;
199
+ exports.Tooltip = index$18.Tooltip;
200
+ exports.UnitInput = index$19.UnitInput;
201
+ exports.VerificationCode = index$1a.VerificationCode;
package/dist/index.js CHANGED
@@ -29,6 +29,7 @@ import { Expandable } from "./components/Expandable/index.js";
29
29
  import { ExpandableCard } from "./components/ExpandableCard/index.js";
30
30
  import { GlobalAlert } from "./components/GlobalAlert/index.js";
31
31
  import { InfiniteScroll } from "./components/InfiniteScroll/index.js";
32
+ import { Key } from "./components/Key/index.js";
32
33
  import { Label } from "./components/Label/index.js";
33
34
  import { LineChart } from "./components/LineChart/index.js";
34
35
  import { Link } from "./components/Link/index.js";
@@ -105,6 +106,7 @@ export {
105
106
  ExpandableCard,
106
107
  GlobalAlert,
107
108
  InfiniteScroll,
109
+ Key,
108
110
  Label,
109
111
  LineChart,
110
112
  Link,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ultraviolet/ui",
3
- "version": "2.0.5",
3
+ "version": "2.1.0",
4
4
  "description": "Ultraviolet UI",
5
5
  "homepage": "https://github.com/scaleway/ultraviolet#readme",
6
6
  "repository": {
@@ -1,55 +0,0 @@
1
- "use client";
2
- "use strict";
3
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
4
- const jsxRuntime = require("@emotion/react/jsx-runtime");
5
- const _styled = require("@emotion/styled/base");
6
- const react = require("react");
7
- const index = require("../Text/index.cjs");
8
- const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
9
- const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
10
- const Container = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
11
- target: "ekyw9u10"
12
- } : {
13
- target: "ekyw9u10",
14
- label: "Container"
15
- })("cursor:text;background:", ({
16
- theme
17
- }) => theme.colors.neutral.backgroundWeak, ";border-radius:", ({
18
- theme
19
- }) => theme.radii.default, ";border:0.5px solid ", ({
20
- theme
21
- }) => theme.colors.neutral.border, ";min-width:", ({
22
- theme
23
- }) => theme.sizing["300"], ";min-height:", ({
24
- theme
25
- }) => theme.sizing["300"], ";display:flex;justify-content:center;align-items:center;&[data-disabled='true']{background:", ({
26
- theme
27
- }) => theme.colors.neutral.backgroundDisabled, ";border-color:", ({
28
- theme
29
- }) => theme.colors.neutral.borderDisabled, ";}&[data-children-length='true']{width:auto;padding:0 ", ({
30
- theme
31
- }) => theme.space[1], ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlYXJjaElucHV0L0tleS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBTTRCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlYXJjaElucHV0L0tleS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyB1c2VNZW1vIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBUZXh0IH0gZnJvbSAnLi4vVGV4dCdcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgY3Vyc29yOiB0ZXh0O1xuICBiYWNrZ3JvdW5kOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJhY2tncm91bmRXZWFrfTtcbiAgYm9yZGVyLXJhZGl1czogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5yYWRpaS5kZWZhdWx0fTtcbiAgYm9yZGVyOiAwLjVweCBzb2xpZCAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlcn07XG4gIG1pbi13aWR0aDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zaXppbmdbJzMwMCddfTtcbiAgbWluLWhlaWdodDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zaXppbmdbJzMwMCddfTtcbiAgZGlzcGxheTogZmxleDtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cbiAgJltkYXRhLWRpc2FibGVkPSd0cnVlJ10ge1xuICAgIGJhY2tncm91bmQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLm5ldXRyYWwuYmFja2dyb3VuZERpc2FibGVkfTtcbiAgICBib3JkZXItY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLm5ldXRyYWwuYm9yZGVyRGlzYWJsZWR9O1xuICB9XG5cbiAgJltkYXRhLWNoaWxkcmVuLWxlbmd0aD0ndHJ1ZSddIHtcbiAgICB3aWR0aDogYXV0bztcbiAgICBwYWRkaW5nOiAwICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbMV19OyAvLyBUaGlzIHBhcnQgaXMgdG8gbGVhdmUgc29tZSBzcGFjZSBiZXR3ZWVuIHRoZSB0ZXh0IGFuZCB0aGUgYm9yZGVyIHdoZW4gdGV4dCBpcyBsb25nXG4gIH1cbmBcblxuZXhwb3J0IGNvbnN0IEtFWVNfTUFUQ0ggPSB7XG4gICcgJzogJ+KQoycsXG4gIEFsdDogJ0FsdCcsXG4gIEFycm93RG93bjogJ+KGkycsXG4gIEFycm93TGVmdDogJ+KGkCcsXG4gIEFycm93UmlnaHQ6ICfihpInLFxuICBBcnJvd1VwOiAn4oaRJyxcbiAgQmFja3NwYWNlOiAn4oyrJyxcbiAgQ2Fwc0xvY2s6ICdDYXBzJyxcbiAgQ29udHJvbDogJ0N0cmwnLFxuICBEZWxldGU6ICfijKYnLFxuICBFbnRlcjogJ+KGtScsXG4gIEVzY2FwZTogJ0VzYycsXG4gIE1ldGE6ICfijJgnLFxufSBhcyBjb25zdFxuXG50eXBlIEtleVByb3BzID0ge1xuICBjaGlsZHJlbjogS2V5Ym9hcmRFdmVudFsna2V5J11cbiAgZGlzYWJsZWQ/OiBib29sZWFuXG59XG5cbmV4cG9ydCBjb25zdCBLZXkgPSAoeyBjaGlsZHJlbiwgZGlzYWJsZWQgfTogS2V5UHJvcHMpID0+IHtcbiAgY29uc3QgaXNTcGVjaWFsS2V5ID0gdXNlTWVtbyhcbiAgICAoKSA9PiBPYmplY3Qua2V5cyhLRVlTX01BVENIKS5maW5kKGtleSA9PiBrZXkgPT09IGNoaWxkcmVuKSxcbiAgICBbY2hpbGRyZW5dLFxuICApXG5cbiAgcmV0dXJuIChcbiAgICA8Q29udGFpbmVyXG4gICAgICBkYXRhLWNoaWxkcmVuLWxlbmd0aD17Y2hpbGRyZW4ubGVuZ3RoID4gMX1cbiAgICAgIGRhdGEtZGlzYWJsZWQ9e2Rpc2FibGVkfVxuICAgICAgZGF0YS10ZXN0aWQ9e2BrZXktJHtjaGlsZHJlbn1gfVxuICAgID5cbiAgICAgIDxUZXh0IGFzPVwic3BhblwiIGRpc2FibGVkPXtkaXNhYmxlZH0gc2VudGltZW50PVwibmV1dHJhbFwiIHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgIHtpc1NwZWNpYWxLZXlcbiAgICAgICAgICA/IEtFWVNfTUFUQ0hbY2hpbGRyZW4gYXMga2V5b2YgdHlwZW9mIEtFWVNfTUFUQ0hdXG4gICAgICAgICAgOiBjaGlsZHJlbn1cbiAgICAgIDwvVGV4dD5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKVxufVxuIl19 */"));
32
- const KEYS_MATCH = {
33
- " ": "␣",
34
- Alt: "Alt",
35
- ArrowDown: "↓",
36
- ArrowLeft: "←",
37
- ArrowRight: "→",
38
- ArrowUp: "↑",
39
- Backspace: "⌫",
40
- CapsLock: "Caps",
41
- Control: "Ctrl",
42
- Delete: "⌦",
43
- Enter: "↵",
44
- Escape: "Esc",
45
- Meta: "⌘"
46
- };
47
- const Key = ({
48
- children,
49
- disabled
50
- }) => {
51
- const isSpecialKey = react.useMemo(() => Object.keys(KEYS_MATCH).find((key) => key === children), [children]);
52
- return /* @__PURE__ */ jsxRuntime.jsx(Container, { "data-children-length": children.length > 1, "data-disabled": disabled, "data-testid": `key-${children}`, children: /* @__PURE__ */ jsxRuntime.jsx(index.Text, { as: "span", disabled, sentiment: "neutral", variant: "caption", children: isSpecialKey ? KEYS_MATCH[children] : children }) });
53
- };
54
- exports.KEYS_MATCH = KEYS_MATCH;
55
- exports.Key = Key;
@@ -1,21 +0,0 @@
1
- export declare const KEYS_MATCH: {
2
- readonly ' ': "␣";
3
- readonly Alt: "Alt";
4
- readonly ArrowDown: "↓";
5
- readonly ArrowLeft: "←";
6
- readonly ArrowRight: "→";
7
- readonly ArrowUp: "↑";
8
- readonly Backspace: "⌫";
9
- readonly CapsLock: "Caps";
10
- readonly Control: "Ctrl";
11
- readonly Delete: "⌦";
12
- readonly Enter: "↵";
13
- readonly Escape: "Esc";
14
- readonly Meta: "⌘";
15
- };
16
- type KeyProps = {
17
- children: KeyboardEvent['key'];
18
- disabled?: boolean;
19
- };
20
- export declare const Key: ({ children, disabled }: KeyProps) => import("@emotion/react/jsx-runtime").JSX.Element;
21
- export {};
@@ -1,53 +0,0 @@
1
- "use client";
2
- import { jsx } from "@emotion/react/jsx-runtime";
3
- import _styled from "@emotion/styled/base";
4
- import { useMemo } from "react";
5
- import { Text } from "../Text/index.js";
6
- const Container = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
7
- target: "ekyw9u10"
8
- } : {
9
- target: "ekyw9u10",
10
- label: "Container"
11
- })("cursor:text;background:", ({
12
- theme
13
- }) => theme.colors.neutral.backgroundWeak, ";border-radius:", ({
14
- theme
15
- }) => theme.radii.default, ";border:0.5px solid ", ({
16
- theme
17
- }) => theme.colors.neutral.border, ";min-width:", ({
18
- theme
19
- }) => theme.sizing["300"], ";min-height:", ({
20
- theme
21
- }) => theme.sizing["300"], ";display:flex;justify-content:center;align-items:center;&[data-disabled='true']{background:", ({
22
- theme
23
- }) => theme.colors.neutral.backgroundDisabled, ";border-color:", ({
24
- theme
25
- }) => theme.colors.neutral.borderDisabled, ";}&[data-children-length='true']{width:auto;padding:0 ", ({
26
- theme
27
- }) => theme.space[1], ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlYXJjaElucHV0L0tleS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBTTRCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlYXJjaElucHV0L0tleS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyB1c2VNZW1vIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBUZXh0IH0gZnJvbSAnLi4vVGV4dCdcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgY3Vyc29yOiB0ZXh0O1xuICBiYWNrZ3JvdW5kOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJhY2tncm91bmRXZWFrfTtcbiAgYm9yZGVyLXJhZGl1czogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5yYWRpaS5kZWZhdWx0fTtcbiAgYm9yZGVyOiAwLjVweCBzb2xpZCAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlcn07XG4gIG1pbi13aWR0aDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zaXppbmdbJzMwMCddfTtcbiAgbWluLWhlaWdodDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zaXppbmdbJzMwMCddfTtcbiAgZGlzcGxheTogZmxleDtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cbiAgJltkYXRhLWRpc2FibGVkPSd0cnVlJ10ge1xuICAgIGJhY2tncm91bmQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLm5ldXRyYWwuYmFja2dyb3VuZERpc2FibGVkfTtcbiAgICBib3JkZXItY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLm5ldXRyYWwuYm9yZGVyRGlzYWJsZWR9O1xuICB9XG5cbiAgJltkYXRhLWNoaWxkcmVuLWxlbmd0aD0ndHJ1ZSddIHtcbiAgICB3aWR0aDogYXV0bztcbiAgICBwYWRkaW5nOiAwICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbMV19OyAvLyBUaGlzIHBhcnQgaXMgdG8gbGVhdmUgc29tZSBzcGFjZSBiZXR3ZWVuIHRoZSB0ZXh0IGFuZCB0aGUgYm9yZGVyIHdoZW4gdGV4dCBpcyBsb25nXG4gIH1cbmBcblxuZXhwb3J0IGNvbnN0IEtFWVNfTUFUQ0ggPSB7XG4gICcgJzogJ+KQoycsXG4gIEFsdDogJ0FsdCcsXG4gIEFycm93RG93bjogJ+KGkycsXG4gIEFycm93TGVmdDogJ+KGkCcsXG4gIEFycm93UmlnaHQ6ICfihpInLFxuICBBcnJvd1VwOiAn4oaRJyxcbiAgQmFja3NwYWNlOiAn4oyrJyxcbiAgQ2Fwc0xvY2s6ICdDYXBzJyxcbiAgQ29udHJvbDogJ0N0cmwnLFxuICBEZWxldGU6ICfijKYnLFxuICBFbnRlcjogJ+KGtScsXG4gIEVzY2FwZTogJ0VzYycsXG4gIE1ldGE6ICfijJgnLFxufSBhcyBjb25zdFxuXG50eXBlIEtleVByb3BzID0ge1xuICBjaGlsZHJlbjogS2V5Ym9hcmRFdmVudFsna2V5J11cbiAgZGlzYWJsZWQ/OiBib29sZWFuXG59XG5cbmV4cG9ydCBjb25zdCBLZXkgPSAoeyBjaGlsZHJlbiwgZGlzYWJsZWQgfTogS2V5UHJvcHMpID0+IHtcbiAgY29uc3QgaXNTcGVjaWFsS2V5ID0gdXNlTWVtbyhcbiAgICAoKSA9PiBPYmplY3Qua2V5cyhLRVlTX01BVENIKS5maW5kKGtleSA9PiBrZXkgPT09IGNoaWxkcmVuKSxcbiAgICBbY2hpbGRyZW5dLFxuICApXG5cbiAgcmV0dXJuIChcbiAgICA8Q29udGFpbmVyXG4gICAgICBkYXRhLWNoaWxkcmVuLWxlbmd0aD17Y2hpbGRyZW4ubGVuZ3RoID4gMX1cbiAgICAgIGRhdGEtZGlzYWJsZWQ9e2Rpc2FibGVkfVxuICAgICAgZGF0YS10ZXN0aWQ9e2BrZXktJHtjaGlsZHJlbn1gfVxuICAgID5cbiAgICAgIDxUZXh0IGFzPVwic3BhblwiIGRpc2FibGVkPXtkaXNhYmxlZH0gc2VudGltZW50PVwibmV1dHJhbFwiIHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgIHtpc1NwZWNpYWxLZXlcbiAgICAgICAgICA/IEtFWVNfTUFUQ0hbY2hpbGRyZW4gYXMga2V5b2YgdHlwZW9mIEtFWVNfTUFUQ0hdXG4gICAgICAgICAgOiBjaGlsZHJlbn1cbiAgICAgIDwvVGV4dD5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKVxufVxuIl19 */"));
28
- const KEYS_MATCH = {
29
- " ": "␣",
30
- Alt: "Alt",
31
- ArrowDown: "↓",
32
- ArrowLeft: "←",
33
- ArrowRight: "→",
34
- ArrowUp: "↑",
35
- Backspace: "⌫",
36
- CapsLock: "Caps",
37
- Control: "Ctrl",
38
- Delete: "⌦",
39
- Enter: "↵",
40
- Escape: "Esc",
41
- Meta: "⌘"
42
- };
43
- const Key = ({
44
- children,
45
- disabled
46
- }) => {
47
- const isSpecialKey = useMemo(() => Object.keys(KEYS_MATCH).find((key) => key === children), [children]);
48
- return /* @__PURE__ */ jsx(Container, { "data-children-length": children.length > 1, "data-disabled": disabled, "data-testid": `key-${children}`, children: /* @__PURE__ */ jsx(Text, { as: "span", disabled, sentiment: "neutral", variant: "caption", children: isSpecialKey ? KEYS_MATCH[children] : children }) });
49
- };
50
- export {
51
- KEYS_MATCH,
52
- Key
53
- };