@ultraviolet/ui 2.0.6 → 2.1.1

package/dist/components/Key/index.cjs

@@ -0,0 +1,85 @@
+"use client";
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const _styled = require("@emotion/styled/base");
+const react = require("react");
+const index = require("../Text/index.cjs");
+const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
+const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
+const KEYS_MATCH = {
+  backspace: "⌫",
+  command: "⌘",
+  control: "⌃",
+  enter: "↵",
+  option: "⌥",
+  shift: "⇧"
+};
+const KeyContainer = /* @__PURE__ */ _styled__default.default("kbd", process.env.NODE_ENV === "production" ? {
+  target: "eufi4n90"
+} : {
+  target: "eufi4n90",
+  label: "KeyContainer"
+})("cursor:default;background:", ({
+  theme
+}) => theme.colors.neutral.backgroundWeak, ";border-radius:", ({
+  theme
+}) => theme.radii.default, ";border:0.5px solid ", ({
+  theme
+}) => theme.colors.neutral.borderWeak, ";min-width:", ({
+  theme
+}) => theme.sizing["300"], ";height:", ({
+  theme
+}) => theme.sizing["300"], ";display:flex;justify-content:center;align-items:center;&[data-prominence='strong']{background-color:", ({
+  theme
+}) => theme.colors.neutral.backgroundStronger, ";border-color:", ({
+  theme
+}) => theme.colors.neutral.border, ';&[data-disabled="true"]{background-color:', ({
+  theme
+}) => theme.colors.neutral.backgroundStrongerDisabled, ";border-color:", ({
+  theme
+}) => theme.colors.neutral.borderDisabled, ";}}&[data-disabled='true']{background-color:", ({
+  theme
+}) => theme.colors.neutral.backgroundWeakDisabled, ";border-color:", ({
+  theme
+}) => theme.colors.neutral.borderWeakDisabled, ';cursor:not-allowed;}&[data-sentiment="primary"]{background-color:', ({
+  theme
+}) => theme.colors.primary.background, ";border-color:", ({
+  theme
+}) => theme.colors.primary.border, ";&[data-prominence='strong']{background-color:", ({
+  theme
+}) => theme.colors.primary.backgroundStrong, ';&[data-disabled="true"]{background-color:', ({
+  theme
+}) => theme.colors.primary.backgroundStrongDisabled, ";}}&[data-disabled='true']{background:", ({
+  theme
+}) => theme.colors.primary.backgroundDisabled, ";border-color:", ({
+  theme
+}) => theme.colors.neutral.borderDisabled, ';cursor:not-allowed;}}&[data-size="small"]{min-width:', ({
+  theme
+}) => theme.sizing["250"], ";height:", ({
+  theme
+}) => theme.sizing["250"], ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0tleS9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZStCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0tleS9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyB1c2VNZW1vIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBUZXh0IH0gZnJvbSAnLi4vVGV4dCdcblxuZXhwb3J0IGNvbnN0IEtFWVNfTUFUQ0ggPSB7XG4gIGJhY2tzcGFjZTogJ+KMqycsXG4gIGNvbW1hbmQ6ICfijJgnLFxuICBjb250cm9sOiAn4oyDJyxcbiAgZW50ZXI6ICfihrUnLFxuICBvcHRpb246ICfijKUnLFxuICBzaGlmdDogJ+KHpycsXG59IGFzIGNvbnN0XG5cbmNvbnN0IEtleUNvbnRhaW5lciA9IHN0eWxlZC5rYmRgXG4gIGN1cnNvcjogZGVmYXVsdDtcbiAgYmFja2dyb3VuZDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5iYWNrZ3JvdW5kV2Vha307XG4gIGJvcmRlci1yYWRpdXM6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUucmFkaWkuZGVmYXVsdH07XG4gIGJvcmRlcjogMC41cHggc29saWQgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5ib3JkZXJXZWFrfTtcbiAgbWluLXdpZHRoOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNpemluZ1snMzAwJ119O1xuICBoZWlnaHQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc2l6aW5nWyczMDAnXX07XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuXG4gIC8qKiBOZXV0cmFsIHN0eWxlICovXG4gICZbZGF0YS1wcm9taW5lbmNlPSdzdHJvbmcnXSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5iYWNrZ3JvdW5kU3Ryb25nZXJ9O1xuICAgIGJvcmRlci1jb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5ib3JkZXJ9O1xuXG4gICAgJltkYXRhLWRpc2FibGVkPVwidHJ1ZVwiXSB7XG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJhY2tncm91bmRTdHJvbmdlckRpc2FibGVkfTtcbiAgICAgIGJvcmRlci1jb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5ib3JkZXJEaXNhYmxlZH07XG4gICAgfVxuICB9XG5cbiAgJltkYXRhLWRpc2FibGVkPSd0cnVlJ10ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLm5ldXRyYWwuYmFja2dyb3VuZFdlYWtEaXNhYmxlZH07XG4gICAgYm9yZGVyLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlcldlYWtEaXNhYmxlZH07XG4gICAgY3Vyc29yOiBub3QtYWxsb3dlZDtcbiAgfVxuXG4gIC8qKiBQcmltYXJ5IHN0eWxlICovXG4gICZbZGF0YS1zZW50aW1lbnQ9XCJwcmltYXJ5XCJdIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5wcmltYXJ5LmJhY2tncm91bmR9O1xuICAgIGJvcmRlci1jb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeS5ib3JkZXJ9O1xuXG4gICAgJltkYXRhLXByb21pbmVuY2U9J3N0cm9uZyddIHtcbiAgICAgIGJhY2tncm91bmQtY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLnByaW1hcnkuYmFja2dyb3VuZFN0cm9uZ307XG5cbiAgICAgICZbZGF0YS1kaXNhYmxlZD1cInRydWVcIl0ge1xuICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5wcmltYXJ5LmJhY2tncm91bmRTdHJvbmdEaXNhYmxlZH07XG4gICAgICB9XG4gICAgfVxuXG4gICAgJltkYXRhLWRpc2FibGVkPSd0cnVlJ10ge1xuICAgICAgYmFja2dyb3VuZDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeS5iYWNrZ3JvdW5kRGlzYWJsZWR9O1xuICAgICAgYm9yZGVyLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlckRpc2FibGVkfTtcbiAgICAgIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gICAgfVxuICB9XG5cbiAgLyoqIFNpemUgKi9cbiAgJltkYXRhLXNpemU9XCJzbWFsbFwiXSB7XG4gICAgbWluLXdpZHRoOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNpemluZ1snMjUwJ119O1xuICAgIGhlaWdodDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zaXppbmdbJzI1MCddfTtcbiAgfVxuYFxuXG50eXBlIEtleVByb3BzID0ge1xuICBjaGlsZHJlbjogc3RyaW5nXG4gIHByb21pbmVuY2U/OiAnc3Ryb25nJyB8ICdkZWZhdWx0J1xuICBkaXNhYmxlZD86IGJvb2xlYW5cbiAgc2l6ZT86ICdzbWFsbCcgfCAnbWVkaXVtJ1xuICBzZW50aW1lbnQ/OiAnbmV1dHJhbCcgfCAncHJpbWFyeSdcbiAgaWQ/OiBzdHJpbmdcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG4gICdkYXRhLXRlc3RpZCc/OiBzdHJpbmdcbn1cblxuLyoqXG4gKiBLZXkgaXMgYSB2aXN1YWwgY29tcG9uZW50IHVzZWQgdG8gZGlzcGxheSBrZXlib2FyZCBzaG9ydGN1dHMuXG4gKi9cbmV4cG9ydCBjb25zdCBLZXkgPSAoe1xuICBjaGlsZHJlbixcbiAgcHJvbWluZW5jZSA9ICdkZWZhdWx0JyxcbiAgZGlzYWJsZWQsXG4gIHNpemUgPSAnbWVkaXVtJyxcbiAgc2VudGltZW50ID0gJ25ldXRyYWwnLFxuICBpZCxcbiAgY2xhc3NOYW1lLFxuICAnZGF0YS10ZXN0aWQnOiBkYXRhVGVzdElkLFxufTogS2V5UHJvcHMpID0+IHtcbiAgY29uc3Qgc3BlY2lhbEtleSA9IHVzZU1lbW8oXG4gICAgKCkgPT4gT2JqZWN0LmtleXMoS0VZU19NQVRDSCkuZmluZChrZXkgPT4ga2V5ID09PSBjaGlsZHJlbi50b0xvd2VyQ2FzZSgpKSxcbiAgICBbY2hpbGRyZW5dLFxuICApXG4gIGNvbnN0IHRleHRQcm9taW5lbmNlID0gdXNlTWVtbygoKSA9PiB7XG4gICAgaWYgKHByb21pbmVuY2UgPT09ICdkZWZhdWx0Jykge1xuICAgICAgcmV0dXJuICdkZWZhdWx0J1xuICAgIH1cblxuICAgIGlmIChzZW50aW1lbnQgPT09ICdwcmltYXJ5Jykge1xuICAgICAgcmV0dXJuICdzdHJvbmcnXG4gICAgfVxuXG4gICAgcmV0dXJuICdzdHJvbmdlcidcbiAgfSwgW3NlbnRpbWVudCwgcHJvbWluZW5jZV0pXG5cbiAgcmV0dXJuIChcbiAgICA8S2V5Q29udGFpbmVyXG4gICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZX1cbiAgICAgIGRhdGEtZGlzYWJsZWQ9e2Rpc2FibGVkfVxuICAgICAgZGF0YS1wcm9taW5lbmNlPXtwcm9taW5lbmNlfVxuICAgICAgZGF0YS1zZW50aW1lbnQ9e3NlbnRpbWVudH1cbiAgICAgIGRhdGEtc2l6ZT17c2l6ZX1cbiAgICAgIGRhdGEtdGVzdGlkPXtkYXRhVGVzdElkfVxuICAgICAgaWQ9e2lkfVxuICAgID5cbiAgICAgIDxUZXh0XG4gICAgICAgIGFzPVwic3BhblwiXG4gICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgcHJvbWluZW5jZT17dGV4dFByb21pbmVuY2V9XG4gICAgICAgIHNlbnRpbWVudD17c2VudGltZW50fVxuICAgICAgICB2YXJpYW50PXtzaXplID09PSAnbWVkaXVtJyA/ICdjYXB0aW9uJyA6ICdjYXB0aW9uU21hbGwnfVxuICAgICAgPlxuICAgICAgICB7c3BlY2lhbEtleVxuICAgICAgICAgID8gS0VZU19NQVRDSFtzcGVjaWFsS2V5IGFzIGtleW9mIHR5cGVvZiBLRVlTX01BVENIXVxuICAgICAgICAgIDogY2hpbGRyZW59XG4gICAgICA8L1RleHQ+XG4gICAgPC9LZXlDb250YWluZXI+XG4gIClcbn1cbiJdfQ== */"));
+const Key = ({
+  children,
+  prominence = "default",
+  disabled,
+  size = "medium",
+  sentiment = "neutral",
+  id,
+  className,
+  "data-testid": dataTestId
+}) => {
+  const specialKey = react.useMemo(() => Object.keys(KEYS_MATCH).find((key) => key === children.toLowerCase()), [children]);
+  const textProminence = react.useMemo(() => {
+    if (prominence === "default") {
+      return "default";
+    }
+    if (sentiment === "primary") {
+      return "strong";
+    }
+    return "stronger";
+  }, [sentiment, prominence]);
+  return /* @__PURE__ */ jsxRuntime.jsx(KeyContainer, { className, "data-disabled": disabled, "data-prominence": prominence, "data-sentiment": sentiment, "data-size": size, "data-testid": dataTestId, id, children: /* @__PURE__ */ jsxRuntime.jsx(index.Text, { as: "span", disabled, prominence: textProminence, sentiment, variant: size === "medium" ? "caption" : "captionSmall", children: specialKey ? KEYS_MATCH[specialKey] : children }) });
+};
+exports.KEYS_MATCH = KEYS_MATCH;
+exports.Key = Key;

package/dist/components/Key/index.d.ts

@@ -0,0 +1,23 @@
+export declare const KEYS_MATCH: {
+    readonly backspace: "⌫";
+    readonly command: "⌘";
+    readonly control: "⌃";
+    readonly enter: "↵";
+    readonly option: "⌥";
+    readonly shift: "⇧";
+};
+type KeyProps = {
+    children: string;
+    prominence?: 'strong' | 'default';
+    disabled?: boolean;
+    size?: 'small' | 'medium';
+    sentiment?: 'neutral' | 'primary';
+    id?: string;
+    className?: string;
+    'data-testid'?: string;
+};
+/**
+ * Key is a visual component used to display keyboard shortcuts.
+ */
+export declare const Key: ({ children, prominence, disabled, size, sentiment, id, className, "data-testid": dataTestId, }: KeyProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Key/index.js

@@ -0,0 +1,83 @@
+"use client";
+import { jsx } from "@emotion/react/jsx-runtime";
+import _styled from "@emotion/styled/base";
+import { useMemo } from "react";
+import { Text } from "../Text/index.js";
+const KEYS_MATCH = {
+  backspace: "⌫",
+  command: "⌘",
+  control: "⌃",
+  enter: "↵",
+  option: "⌥",
+  shift: "⇧"
+};
+const KeyContainer = /* @__PURE__ */ _styled("kbd", process.env.NODE_ENV === "production" ? {
+  target: "eufi4n90"
+} : {
+  target: "eufi4n90",
+  label: "KeyContainer"
+})("cursor:default;background:", ({
+  theme
+}) => theme.colors.neutral.backgroundWeak, ";border-radius:", ({
+  theme
+}) => theme.radii.default, ";border:0.5px solid ", ({
+  theme
+}) => theme.colors.neutral.borderWeak, ";min-width:", ({
+  theme
+}) => theme.sizing["300"], ";height:", ({
+  theme
+}) => theme.sizing["300"], ";display:flex;justify-content:center;align-items:center;&[data-prominence='strong']{background-color:", ({
+  theme
+}) => theme.colors.neutral.backgroundStronger, ";border-color:", ({
+  theme
+}) => theme.colors.neutral.border, ';&[data-disabled="true"]{background-color:', ({
+  theme
+}) => theme.colors.neutral.backgroundStrongerDisabled, ";border-color:", ({
+  theme
+}) => theme.colors.neutral.borderDisabled, ";}}&[data-disabled='true']{background-color:", ({
+  theme
+}) => theme.colors.neutral.backgroundWeakDisabled, ";border-color:", ({
+  theme
+}) => theme.colors.neutral.borderWeakDisabled, ';cursor:not-allowed;}&[data-sentiment="primary"]{background-color:', ({
+  theme
+}) => theme.colors.primary.background, ";border-color:", ({
+  theme
+}) => theme.colors.primary.border, ";&[data-prominence='strong']{background-color:", ({
+  theme
+}) => theme.colors.primary.backgroundStrong, ';&[data-disabled="true"]{background-color:', ({
+  theme
+}) => theme.colors.primary.backgroundStrongDisabled, ";}}&[data-disabled='true']{background:", ({
+  theme
+}) => theme.colors.primary.backgroundDisabled, ";border-color:", ({
+  theme
+}) => theme.colors.neutral.borderDisabled, ';cursor:not-allowed;}}&[data-size="small"]{min-width:', ({
+  theme
+}) => theme.sizing["250"], ";height:", ({
+  theme
+}) => theme.sizing["250"], ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0tleS9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZStCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0tleS9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyB1c2VNZW1vIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBUZXh0IH0gZnJvbSAnLi4vVGV4dCdcblxuZXhwb3J0IGNvbnN0IEtFWVNfTUFUQ0ggPSB7XG4gIGJhY2tzcGFjZTogJ+KMqycsXG4gIGNvbW1hbmQ6ICfijJgnLFxuICBjb250cm9sOiAn4oyDJyxcbiAgZW50ZXI6ICfihrUnLFxuICBvcHRpb246ICfijKUnLFxuICBzaGlmdDogJ+KHpycsXG59IGFzIGNvbnN0XG5cbmNvbnN0IEtleUNvbnRhaW5lciA9IHN0eWxlZC5rYmRgXG4gIGN1cnNvcjogZGVmYXVsdDtcbiAgYmFja2dyb3VuZDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5iYWNrZ3JvdW5kV2Vha307XG4gIGJvcmRlci1yYWRpdXM6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUucmFkaWkuZGVmYXVsdH07XG4gIGJvcmRlcjogMC41cHggc29saWQgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5ib3JkZXJXZWFrfTtcbiAgbWluLXdpZHRoOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNpemluZ1snMzAwJ119O1xuICBoZWlnaHQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc2l6aW5nWyczMDAnXX07XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuXG4gIC8qKiBOZXV0cmFsIHN0eWxlICovXG4gICZbZGF0YS1wcm9taW5lbmNlPSdzdHJvbmcnXSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5iYWNrZ3JvdW5kU3Ryb25nZXJ9O1xuICAgIGJvcmRlci1jb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5ib3JkZXJ9O1xuXG4gICAgJltkYXRhLWRpc2FibGVkPVwidHJ1ZVwiXSB7XG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJhY2tncm91bmRTdHJvbmdlckRpc2FibGVkfTtcbiAgICAgIGJvcmRlci1jb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC5ib3JkZXJEaXNhYmxlZH07XG4gICAgfVxuICB9XG5cbiAgJltkYXRhLWRpc2FibGVkPSd0cnVlJ10ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLm5ldXRyYWwuYmFja2dyb3VuZFdlYWtEaXNhYmxlZH07XG4gICAgYm9yZGVyLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlcldlYWtEaXNhYmxlZH07XG4gICAgY3Vyc29yOiBub3QtYWxsb3dlZDtcbiAgfVxuXG4gIC8qKiBQcmltYXJ5IHN0eWxlICovXG4gICZbZGF0YS1zZW50aW1lbnQ9XCJwcmltYXJ5XCJdIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5wcmltYXJ5LmJhY2tncm91bmR9O1xuICAgIGJvcmRlci1jb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeS5ib3JkZXJ9O1xuXG4gICAgJltkYXRhLXByb21pbmVuY2U9J3N0cm9uZyddIHtcbiAgICAgIGJhY2tncm91bmQtY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLnByaW1hcnkuYmFja2dyb3VuZFN0cm9uZ307XG5cbiAgICAgICZbZGF0YS1kaXNhYmxlZD1cInRydWVcIl0ge1xuICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5wcmltYXJ5LmJhY2tncm91bmRTdHJvbmdEaXNhYmxlZH07XG4gICAgICB9XG4gICAgfVxuXG4gICAgJltkYXRhLWRpc2FibGVkPSd0cnVlJ10ge1xuICAgICAgYmFja2dyb3VuZDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeS5iYWNrZ3JvdW5kRGlzYWJsZWR9O1xuICAgICAgYm9yZGVyLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlckRpc2FibGVkfTtcbiAgICAgIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gICAgfVxuICB9XG5cbiAgLyoqIFNpemUgKi9cbiAgJltkYXRhLXNpemU9XCJzbWFsbFwiXSB7XG4gICAgbWluLXdpZHRoOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNpemluZ1snMjUwJ119O1xuICAgIGhlaWdodDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zaXppbmdbJzI1MCddfTtcbiAgfVxuYFxuXG50eXBlIEtleVByb3BzID0ge1xuICBjaGlsZHJlbjogc3RyaW5nXG4gIHByb21pbmVuY2U/OiAnc3Ryb25nJyB8ICdkZWZhdWx0J1xuICBkaXNhYmxlZD86IGJvb2xlYW5cbiAgc2l6ZT86ICdzbWFsbCcgfCAnbWVkaXVtJ1xuICBzZW50aW1lbnQ/OiAnbmV1dHJhbCcgfCAncHJpbWFyeSdcbiAgaWQ/OiBzdHJpbmdcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG4gICdkYXRhLXRlc3RpZCc/OiBzdHJpbmdcbn1cblxuLyoqXG4gKiBLZXkgaXMgYSB2aXN1YWwgY29tcG9uZW50IHVzZWQgdG8gZGlzcGxheSBrZXlib2FyZCBzaG9ydGN1dHMuXG4gKi9cbmV4cG9ydCBjb25zdCBLZXkgPSAoe1xuICBjaGlsZHJlbixcbiAgcHJvbWluZW5jZSA9ICdkZWZhdWx0JyxcbiAgZGlzYWJsZWQsXG4gIHNpemUgPSAnbWVkaXVtJyxcbiAgc2VudGltZW50ID0gJ25ldXRyYWwnLFxuICBpZCxcbiAgY2xhc3NOYW1lLFxuICAnZGF0YS10ZXN0aWQnOiBkYXRhVGVzdElkLFxufTogS2V5UHJvcHMpID0+IHtcbiAgY29uc3Qgc3BlY2lhbEtleSA9IHVzZU1lbW8oXG4gICAgKCkgPT4gT2JqZWN0LmtleXMoS0VZU19NQVRDSCkuZmluZChrZXkgPT4ga2V5ID09PSBjaGlsZHJlbi50b0xvd2VyQ2FzZSgpKSxcbiAgICBbY2hpbGRyZW5dLFxuICApXG4gIGNvbnN0IHRleHRQcm9taW5lbmNlID0gdXNlTWVtbygoKSA9PiB7XG4gICAgaWYgKHByb21pbmVuY2UgPT09ICdkZWZhdWx0Jykge1xuICAgICAgcmV0dXJuICdkZWZhdWx0J1xuICAgIH1cblxuICAgIGlmIChzZW50aW1lbnQgPT09ICdwcmltYXJ5Jykge1xuICAgICAgcmV0dXJuICdzdHJvbmcnXG4gICAgfVxuXG4gICAgcmV0dXJuICdzdHJvbmdlcidcbiAgfSwgW3NlbnRpbWVudCwgcHJvbWluZW5jZV0pXG5cbiAgcmV0dXJuIChcbiAgICA8S2V5Q29udGFpbmVyXG4gICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZX1cbiAgICAgIGRhdGEtZGlzYWJsZWQ9e2Rpc2FibGVkfVxuICAgICAgZGF0YS1wcm9taW5lbmNlPXtwcm9taW5lbmNlfVxuICAgICAgZGF0YS1zZW50aW1lbnQ9e3NlbnRpbWVudH1cbiAgICAgIGRhdGEtc2l6ZT17c2l6ZX1cbiAgICAgIGRhdGEtdGVzdGlkPXtkYXRhVGVzdElkfVxuICAgICAgaWQ9e2lkfVxuICAgID5cbiAgICAgIDxUZXh0XG4gICAgICAgIGFzPVwic3BhblwiXG4gICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgcHJvbWluZW5jZT17dGV4dFByb21pbmVuY2V9XG4gICAgICAgIHNlbnRpbWVudD17c2VudGltZW50fVxuICAgICAgICB2YXJpYW50PXtzaXplID09PSAnbWVkaXVtJyA/ICdjYXB0aW9uJyA6ICdjYXB0aW9uU21hbGwnfVxuICAgICAgPlxuICAgICAgICB7c3BlY2lhbEtleVxuICAgICAgICAgID8gS0VZU19NQVRDSFtzcGVjaWFsS2V5IGFzIGtleW9mIHR5cGVvZiBLRVlTX01BVENIXVxuICAgICAgICAgIDogY2hpbGRyZW59XG4gICAgICA8L1RleHQ+XG4gICAgPC9LZXlDb250YWluZXI+XG4gIClcbn1cbiJdfQ== */"));
+const Key = ({
+  children,
+  prominence = "default",
+  disabled,
+  size = "medium",
+  sentiment = "neutral",
+  id,
+  className,
+  "data-testid": dataTestId
+}) => {
+  const specialKey = useMemo(() => Object.keys(KEYS_MATCH).find((key) => key === children.toLowerCase()), [children]);
+  const textProminence = useMemo(() => {
+    if (prominence === "default") {
+      return "default";
+    }
+    if (sentiment === "primary") {
+      return "strong";
+    }
+    return "stronger";
+  }, [sentiment, prominence]);
+  return /* @__PURE__ */ jsx(KeyContainer, { className, "data-disabled": disabled, "data-prominence": prominence, "data-sentiment": sentiment, "data-size": size, "data-testid": dataTestId, id, children: /* @__PURE__ */ jsx(Text, { as: "span", disabled, prominence: textProminence, sentiment, variant: size === "medium" ? "caption" : "captionSmall", children: specialKey ? KEYS_MATCH[specialKey] : children }) });
+};
+export {
+  KEYS_MATCH,
+  Key
+};

package/dist/components/SearchInput/KeyGroup.cjs

@@ -3,14 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const _styled = require("@emotion/styled/base");
-const index = require("../Stack/index.cjs");
-const Key = require("./Key.cjs");
+const index = require("../Key/index.cjs");
+const index$1 = require("../Stack/index.cjs");
 const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
 const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
 function _EMOTION_STRINGIFIED_CSS_ERROR__() {
   return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
 }
-const ClickableStack = /* @__PURE__ */ _styled__default.default(index.Stack, process.env.NODE_ENV === "production" ? {
+const ClickableStack = /* @__PURE__ */ _styled__default.default(index$1.Stack, process.env.NODE_ENV === "production" ? {
   target: "e1anqdc20"
 } : {
   target: "e1anqdc20",
@@ -20,12 +20,12 @@ const ClickableStack = /* @__PURE__ */ _styled__default.default(index.Stack, pro
   styles: "cursor:text"
 } : {
   name: "1jbm2s3",
-  styles: "cursor:text/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlYXJjaElucHV0L0tleUdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPb0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvdWkvc3JjL2NvbXBvbmVudHMvU2VhcmNoSW5wdXQvS2V5R3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHR5cGUgeyBDb21wb25lbnRQcm9wcyB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgU3RhY2sgfSBmcm9tICcuLi9TdGFjaydcbmltcG9ydCB7IEtleSB9IGZyb20gJy4vS2V5J1xuXG5jb25zdCBDbGlja2FibGVTdGFjayA9IHN0eWxlZChTdGFjaylgXG4gIGN1cnNvcjogdGV4dDtcbmBcblxudHlwZSBLZXlHcm91cFByb3BzID0ge1xuICBrZXlzOiBDb21wb25lbnRQcm9wczx0eXBlb2YgS2V5PlsnY2hpbGRyZW4nXVtdXG4gIGRpc2FibGVkOiBDb21wb25lbnRQcm9wczx0eXBlb2YgS2V5PlsnZGlzYWJsZWQnXVxuICBvbkNsaWNrPzogKCkgPT4gdm9pZFxufVxuXG5leHBvcnQgY29uc3QgS2V5R3JvdXAgPSAoeyBrZXlzLCBkaXNhYmxlZCwgb25DbGljayB9OiBLZXlHcm91cFByb3BzKSA9PiAoXG4gIDxDbGlja2FibGVTdGFjayBkaXJlY3Rpb249XCJyb3dcIiBnYXA9ezAuNX0gb25DbGljaz17b25DbGlja30+XG4gICAge2tleXMubWFwKGtleSA9PiAoXG4gICAgICA8S2V5IGRpc2FibGVkPXtkaXNhYmxlZH0ga2V5PXtrZXl9PlxuICAgICAgICB7a2V5fVxuICAgICAgPC9LZXk+XG4gICAgKSl9XG4gIDwvQ2xpY2thYmxlU3RhY2s+XG4pXG4iXX0= */",
+  styles: "cursor:text/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlYXJjaElucHV0L0tleUdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPb0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvdWkvc3JjL2NvbXBvbmVudHMvU2VhcmNoSW5wdXQvS2V5R3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHR5cGUgeyBDb21wb25lbnRQcm9wcyB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgS2V5IH0gZnJvbSAnLi4vS2V5J1xuaW1wb3J0IHsgU3RhY2sgfSBmcm9tICcuLi9TdGFjaydcblxuY29uc3QgQ2xpY2thYmxlU3RhY2sgPSBzdHlsZWQoU3RhY2spYFxuICBjdXJzb3I6IHRleHQ7XG5gXG5cbnR5cGUgS2V5R3JvdXBQcm9wcyA9IHtcbiAga2V5czogQ29tcG9uZW50UHJvcHM8dHlwZW9mIEtleT5bJ2NoaWxkcmVuJ11bXVxuICBkaXNhYmxlZDogQ29tcG9uZW50UHJvcHM8dHlwZW9mIEtleT5bJ2Rpc2FibGVkJ11cbiAgb25DbGljaz86ICgpID0+IHZvaWRcbn1cblxuZXhwb3J0IGNvbnN0IEtleUdyb3VwID0gKHsga2V5cywgZGlzYWJsZWQsIG9uQ2xpY2sgfTogS2V5R3JvdXBQcm9wcykgPT4gKFxuICA8Q2xpY2thYmxlU3RhY2sgZGlyZWN0aW9uPVwicm93XCIgZ2FwPXswLjV9IG9uQ2xpY2s9e29uQ2xpY2t9PlxuICAgIHtrZXlzLm1hcChrZXkgPT4gKFxuICAgICAgPEtleSBkYXRhLXRlc3RpZD17YGtleS0ke2tleX1gfSBkaXNhYmxlZD17ZGlzYWJsZWR9IGtleT17a2V5fT5cbiAgICAgICAge2tleX1cbiAgICAgIDwvS2V5PlxuICAgICkpfVxuICA8L0NsaWNrYWJsZVN0YWNrPlxuKVxuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 const KeyGroup = ({
   keys,
   disabled,
   onClick
-}) => /* @__PURE__ */ jsxRuntime.jsx(ClickableStack, { direction: "row", gap: 0.5, onClick, children: keys.map((key) => /* @__PURE__ */ jsxRuntime.jsx(Key.Key, { disabled, children: key }, key)) });
+}) => /* @__PURE__ */ jsxRuntime.jsx(ClickableStack, { direction: "row", gap: 0.5, onClick, children: keys.map((key) => /* @__PURE__ */ jsxRuntime.jsx(index.Key, { "data-testid": `key-${key}`, disabled, children: key }, key)) });
 exports.KeyGroup = KeyGroup;

package/dist/components/SearchInput/KeyGroup.d.ts

@@ -1,5 +1,5 @@
 import type { ComponentProps } from 'react';
-import { Key } from './Key';
+import { Key } from '../Key';
 type KeyGroupProps = {
     keys: ComponentProps<typeof Key>['children'][];
     disabled: ComponentProps<typeof Key>['disabled'];

package/dist/components/SearchInput/KeyGroup.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsx } from "@emotion/react/jsx-runtime";
 import _styled from "@emotion/styled/base";
+import { Key } from "../Key/index.js";
 import { Stack } from "../Stack/index.js";
-import { Key } from "./Key.js";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() {
   return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
 }
@@ -16,14 +16,14 @@ const ClickableStack = /* @__PURE__ */ _styled(Stack, process.env.NODE_ENV === "
   styles: "cursor:text"
 } : {
   name: "1jbm2s3",
-  styles: "cursor:text/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlYXJjaElucHV0L0tleUdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPb0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvdWkvc3JjL2NvbXBvbmVudHMvU2VhcmNoSW5wdXQvS2V5R3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHR5cGUgeyBDb21wb25lbnRQcm9wcyB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgU3RhY2sgfSBmcm9tICcuLi9TdGFjaydcbmltcG9ydCB7IEtleSB9IGZyb20gJy4vS2V5J1xuXG5jb25zdCBDbGlja2FibGVTdGFjayA9IHN0eWxlZChTdGFjaylgXG4gIGN1cnNvcjogdGV4dDtcbmBcblxudHlwZSBLZXlHcm91cFByb3BzID0ge1xuICBrZXlzOiBDb21wb25lbnRQcm9wczx0eXBlb2YgS2V5PlsnY2hpbGRyZW4nXVtdXG4gIGRpc2FibGVkOiBDb21wb25lbnRQcm9wczx0eXBlb2YgS2V5PlsnZGlzYWJsZWQnXVxuICBvbkNsaWNrPzogKCkgPT4gdm9pZFxufVxuXG5leHBvcnQgY29uc3QgS2V5R3JvdXAgPSAoeyBrZXlzLCBkaXNhYmxlZCwgb25DbGljayB9OiBLZXlHcm91cFByb3BzKSA9PiAoXG4gIDxDbGlja2FibGVTdGFjayBkaXJlY3Rpb249XCJyb3dcIiBnYXA9ezAuNX0gb25DbGljaz17b25DbGlja30+XG4gICAge2tleXMubWFwKGtleSA9PiAoXG4gICAgICA8S2V5IGRpc2FibGVkPXtkaXNhYmxlZH0ga2V5PXtrZXl9PlxuICAgICAgICB7a2V5fVxuICAgICAgPC9LZXk+XG4gICAgKSl9XG4gIDwvQ2xpY2thYmxlU3RhY2s+XG4pXG4iXX0= */",
+  styles: "cursor:text/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlYXJjaElucHV0L0tleUdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPb0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvdWkvc3JjL2NvbXBvbmVudHMvU2VhcmNoSW5wdXQvS2V5R3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHR5cGUgeyBDb21wb25lbnRQcm9wcyB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgS2V5IH0gZnJvbSAnLi4vS2V5J1xuaW1wb3J0IHsgU3RhY2sgfSBmcm9tICcuLi9TdGFjaydcblxuY29uc3QgQ2xpY2thYmxlU3RhY2sgPSBzdHlsZWQoU3RhY2spYFxuICBjdXJzb3I6IHRleHQ7XG5gXG5cbnR5cGUgS2V5R3JvdXBQcm9wcyA9IHtcbiAga2V5czogQ29tcG9uZW50UHJvcHM8dHlwZW9mIEtleT5bJ2NoaWxkcmVuJ11bXVxuICBkaXNhYmxlZDogQ29tcG9uZW50UHJvcHM8dHlwZW9mIEtleT5bJ2Rpc2FibGVkJ11cbiAgb25DbGljaz86ICgpID0+IHZvaWRcbn1cblxuZXhwb3J0IGNvbnN0IEtleUdyb3VwID0gKHsga2V5cywgZGlzYWJsZWQsIG9uQ2xpY2sgfTogS2V5R3JvdXBQcm9wcykgPT4gKFxuICA8Q2xpY2thYmxlU3RhY2sgZGlyZWN0aW9uPVwicm93XCIgZ2FwPXswLjV9IG9uQ2xpY2s9e29uQ2xpY2t9PlxuICAgIHtrZXlzLm1hcChrZXkgPT4gKFxuICAgICAgPEtleSBkYXRhLXRlc3RpZD17YGtleS0ke2tleX1gfSBkaXNhYmxlZD17ZGlzYWJsZWR9IGtleT17a2V5fT5cbiAgICAgICAge2tleX1cbiAgICAgIDwvS2V5PlxuICAgICkpfVxuICA8L0NsaWNrYWJsZVN0YWNrPlxuKVxuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 const KeyGroup = ({
   keys,
   disabled,
   onClick
-}) => /* @__PURE__ */ jsx(ClickableStack, { direction: "row", gap: 0.5, onClick, children: keys.map((key) => /* @__PURE__ */ jsx(Key, { disabled, children: key }, key)) });
+}) => /* @__PURE__ */ jsx(ClickableStack, { direction: "row", gap: 0.5, onClick, children: keys.map((key) => /* @__PURE__ */ jsx(Key, { "data-testid": `key-${key}`, disabled, children: key }, key)) });
 export {
   KeyGroup
 };

package/dist/components/index.d.ts

@@ -22,6 +22,7 @@ export { Expandable } from './Expandable';
 export { ExpandableCard } from './ExpandableCard';
 export { GlobalAlert } from './GlobalAlert';
 export { InfiniteScroll } from './InfiniteScroll';
+export { Key } from './Key';
 export { Label } from './Label';
 export { LineChart } from './LineChart';
 export { Link } from './Link';

package/dist/index.cjs

@@ -31,55 +31,56 @@ const index$l = require("./components/Expandable/index.cjs");
 const index$m = require("./components/ExpandableCard/index.cjs");
 const index$n = require("./components/GlobalAlert/index.cjs");
 const index$o = require("./components/InfiniteScroll/index.cjs");
-const index$p = require("./components/Label/index.cjs");
-const index$q = require("./components/LineChart/index.cjs");
-const index$r = require("./components/Link/index.cjs");
-const index$s = require("./components/List/index.cjs");
-const index$t = require("./components/Loader/index.cjs");
-const index$u = require("./components/Menu/index.cjs");
-const index$v = require("./components/Meter/index.cjs");
-const index$w = require("./components/Modal/index.cjs");
-const index$x = require("./components/Notice/index.cjs");
-const index$y = require("./components/Notification/index.cjs");
-const index$z = require("./components/NumberInput/index.cjs");
-const index$A = require("./components/Pagination/index.cjs");
-const index$B = require("./components/PasswordCheck/index.cjs");
-const index$C = require("./components/PieChart/index.cjs");
-const index$D = require("./components/Popover/index.cjs");
-const index$E = require("./components/Popup/index.cjs");
-const index$F = require("./components/ProgressBar/index.cjs");
-const index$G = require("./components/Radio/index.cjs");
-const index$H = require("./components/RadioGroup/index.cjs");
-const index$I = require("./components/Row/index.cjs");
-const index$J = require("./components/SearchInput/index.cjs");
-const index$K = require("./components/SelectableCard/index.cjs");
-const index$L = require("./components/SelectableCardGroup/index.cjs");
-const index$M = require("./components/SelectableCardOptionGroup/index.cjs");
-const index$N = require("./components/SelectInput/index.cjs");
-const index$O = require("./components/Separator/index.cjs");
-const index$P = require("./components/Skeleton/index.cjs");
-const index$Q = require("./components/Slider/index.cjs");
-const index$R = require("./components/Snippet/index.cjs");
-const index$S = require("./components/Stack/index.cjs");
-const index$T = require("./components/Status/index.cjs");
-const index$U = require("./components/StepList/index.cjs");
-const index$V = require("./components/Stepper/index.cjs");
-const index$W = require("./components/SwitchButton/index.cjs");
-const index$X = require("./components/Table/index.cjs");
-const index$Y = require("./components/Tabs/index.cjs");
-const index$Z = require("./components/Tag/index.cjs");
-const index$_ = require("./components/TagInput/index.cjs");
-const index$$ = require("./components/TagList/index.cjs");
-const index$10 = require("./components/Text/index.cjs");
-const index$11 = require("./components/TextArea/index.cjs");
-const index$12 = require("./components/TextInput/index.cjs");
-const index$13 = require("./components/TimeInput/index.cjs");
-const index$14 = require("./components/Toaster/index.cjs");
-const index$15 = require("./components/Toggle/index.cjs");
-const index$16 = require("./components/ToggleGroup/index.cjs");
-const index$17 = require("./components/Tooltip/index.cjs");
-const index$18 = require("./components/UnitInput/index.cjs");
-const index$19 = require("./components/VerificationCode/index.cjs");
+const index$p = require("./components/Key/index.cjs");
+const index$q = require("./components/Label/index.cjs");
+const index$r = require("./components/LineChart/index.cjs");
+const index$s = require("./components/Link/index.cjs");
+const index$t = require("./components/List/index.cjs");
+const index$u = require("./components/Loader/index.cjs");
+const index$v = require("./components/Menu/index.cjs");
+const index$w = require("./components/Meter/index.cjs");
+const index$x = require("./components/Modal/index.cjs");
+const index$y = require("./components/Notice/index.cjs");
+const index$z = require("./components/Notification/index.cjs");
+const index$A = require("./components/NumberInput/index.cjs");
+const index$B = require("./components/Pagination/index.cjs");
+const index$C = require("./components/PasswordCheck/index.cjs");
+const index$D = require("./components/PieChart/index.cjs");
+const index$E = require("./components/Popover/index.cjs");
+const index$F = require("./components/Popup/index.cjs");
+const index$G = require("./components/ProgressBar/index.cjs");
+const index$H = require("./components/Radio/index.cjs");
+const index$I = require("./components/RadioGroup/index.cjs");
+const index$J = require("./components/Row/index.cjs");
+const index$K = require("./components/SearchInput/index.cjs");
+const index$L = require("./components/SelectableCard/index.cjs");
+const index$M = require("./components/SelectableCardGroup/index.cjs");
+const index$N = require("./components/SelectableCardOptionGroup/index.cjs");
+const index$O = require("./components/SelectInput/index.cjs");
+const index$P = require("./components/Separator/index.cjs");
+const index$Q = require("./components/Skeleton/index.cjs");
+const index$R = require("./components/Slider/index.cjs");
+const index$S = require("./components/Snippet/index.cjs");
+const index$T = require("./components/Stack/index.cjs");
+const index$U = require("./components/Status/index.cjs");
+const index$V = require("./components/StepList/index.cjs");
+const index$W = require("./components/Stepper/index.cjs");
+const index$X = require("./components/SwitchButton/index.cjs");
+const index$Y = require("./components/Table/index.cjs");
+const index$Z = require("./components/Tabs/index.cjs");
+const index$_ = require("./components/Tag/index.cjs");
+const index$$ = require("./components/TagInput/index.cjs");
+const index$10 = require("./components/TagList/index.cjs");
+const index$11 = require("./components/Text/index.cjs");
+const index$12 = require("./components/TextArea/index.cjs");
+const index$13 = require("./components/TextInput/index.cjs");
+const index$14 = require("./components/TimeInput/index.cjs");
+const index$15 = require("./components/Toaster/index.cjs");
+const index$16 = require("./components/Toggle/index.cjs");
+const index$17 = require("./components/ToggleGroup/index.cjs");
+const index$18 = require("./components/Tooltip/index.cjs");
+const index$19 = require("./components/UnitInput/index.cjs");
+const index$1a = require("./components/VerificationCode/index.cjs");
 exports.extendTheme = index.extendTheme;
 exports.Breakpoint = Breakpoint;
 exports.normalize = normalize;
@@ -146,54 +147,55 @@ exports.Expandable = index$l.Expandable;
 exports.ExpandableCard = index$m.ExpandableCard;
 exports.GlobalAlert = index$n.GlobalAlert;
 exports.InfiniteScroll = index$o.InfiniteScroll;
-exports.Label = index$p.Label;
-exports.LineChart = index$q.LineChart;
-exports.Link = index$r.Link;
-exports.List = index$s.List;
-exports.Loader = index$t.Loader;
-exports.Menu = index$u.Menu;
-exports.Meter = index$v.Meter;
-exports.Modal = index$w.Modal;
-exports.Notice = index$x.Notice;
-exports.NotificationContainer = index$y.NotificationContainer;
-exports.notification = index$y.notification;
-exports.NumberInput = index$z.NumberInput;
-exports.Pagination = index$A.Pagination;
-exports.PasswordCheck = index$B.PasswordCheck;
-exports.PieChart = index$C.PieChart;
-exports.Popover = index$D.Popover;
-exports.Popup = index$E.Popup;
-exports.ProgressBar = index$F.ProgressBar;
-exports.Radio = index$G.Radio;
-exports.RadioGroup = index$H.RadioGroup;
-exports.Row = index$I.Row;
-exports.SearchInput = index$J.SearchInput;
-exports.SelectableCard = index$K.SelectableCard;
-exports.SelectableCardGroup = index$L.SelectableCardGroup;
-exports.SelectableCardOptionGroup = index$M.SelectableCardOptionGroup;
-exports.SelectInput = index$N.SelectInput;
-exports.Separator = index$O.Separator;
-exports.Skeleton = index$P.Skeleton;
-exports.Slider = index$Q.Slider;
-exports.Snippet = index$R.Snippet;
-exports.Stack = index$S.Stack;
-exports.Status = index$T.Status;
-exports.StepList = index$U.StepList;
-exports.Stepper = index$V.Stepper;
-exports.SwitchButton = index$W.SwitchButton;
-exports.Table = index$X.Table;
-exports.Tabs = index$Y.Tabs;
-exports.Tag = index$Z.Tag;
-exports.TagInput = index$_.TagInput;
-exports.TagList = index$$.TagList;
-exports.Text = index$10.Text;
-exports.TextArea = index$11.TextArea;
-exports.TextInput = index$12.TextInput;
-exports.TimeInput = index$13.TimeInput;
-exports.ToastContainer = index$14.ToastContainer;
-exports.toast = index$14.toast;
-exports.Toggle = index$15.Toggle;
-exports.ToggleGroup = index$16.ToggleGroup;
-exports.Tooltip = index$17.Tooltip;
-exports.UnitInput = index$18.UnitInput;
-exports.VerificationCode = index$19.VerificationCode;
+exports.Key = index$p.Key;
+exports.Label = index$q.Label;
+exports.LineChart = index$r.LineChart;
+exports.Link = index$s.Link;
+exports.List = index$t.List;
+exports.Loader = index$u.Loader;
+exports.Menu = index$v.Menu;
+exports.Meter = index$w.Meter;
+exports.Modal = index$x.Modal;
+exports.Notice = index$y.Notice;
+exports.NotificationContainer = index$z.NotificationContainer;
+exports.notification = index$z.notification;
+exports.NumberInput = index$A.NumberInput;
+exports.Pagination = index$B.Pagination;
+exports.PasswordCheck = index$C.PasswordCheck;
+exports.PieChart = index$D.PieChart;
+exports.Popover = index$E.Popover;
+exports.Popup = index$F.Popup;
+exports.ProgressBar = index$G.ProgressBar;
+exports.Radio = index$H.Radio;
+exports.RadioGroup = index$I.RadioGroup;
+exports.Row = index$J.Row;
+exports.SearchInput = index$K.SearchInput;
+exports.SelectableCard = index$L.SelectableCard;
+exports.SelectableCardGroup = index$M.SelectableCardGroup;
+exports.SelectableCardOptionGroup = index$N.SelectableCardOptionGroup;
+exports.SelectInput = index$O.SelectInput;
+exports.Separator = index$P.Separator;
+exports.Skeleton = index$Q.Skeleton;
+exports.Slider = index$R.Slider;
+exports.Snippet = index$S.Snippet;
+exports.Stack = index$T.Stack;
+exports.Status = index$U.Status;
+exports.StepList = index$V.StepList;
+exports.Stepper = index$W.Stepper;
+exports.SwitchButton = index$X.SwitchButton;
+exports.Table = index$Y.Table;
+exports.Tabs = index$Z.Tabs;
+exports.Tag = index$_.Tag;
+exports.TagInput = index$$.TagInput;
+exports.TagList = index$10.TagList;
+exports.Text = index$11.Text;
+exports.TextArea = index$12.TextArea;
+exports.TextInput = index$13.TextInput;
+exports.TimeInput = index$14.TimeInput;
+exports.ToastContainer = index$15.ToastContainer;
+exports.toast = index$15.toast;
+exports.Toggle = index$16.Toggle;
+exports.ToggleGroup = index$17.ToggleGroup;
+exports.Tooltip = index$18.Tooltip;
+exports.UnitInput = index$19.UnitInput;
+exports.VerificationCode = index$1a.VerificationCode;

package/dist/index.js

@@ -29,6 +29,7 @@ import { Expandable } from "./components/Expandable/index.js";
 import { ExpandableCard } from "./components/ExpandableCard/index.js";
 import { GlobalAlert } from "./components/GlobalAlert/index.js";
 import { InfiniteScroll } from "./components/InfiniteScroll/index.js";
+import { Key } from "./components/Key/index.js";
 import { Label } from "./components/Label/index.js";
 import { LineChart } from "./components/LineChart/index.js";
 import { Link } from "./components/Link/index.js";
@@ -105,6 +106,7 @@ export {
   ExpandableCard,
   GlobalAlert,
   InfiniteScroll,
+  Key,
   Label,
   LineChart,
   Link,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/ui",
-  "version": "2.0.6",
+  "version": "2.1.1",
   "description": "Ultraviolet UI",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {
@@ -60,11 +60,11 @@
     "react-dom": "18.x || 19.x"
   },
   "devDependencies": {
-    "@babel/core": "7.28.0",
+    "@babel/core": "7.28.3",
     "@emotion/react": "11.14.0",
     "@emotion/styled": "11.14.1",
-    "@types/react": "19.1.9",
-    "@types/react-dom": "19.1.7",
+    "@types/react": "19.1.12",
+    "@types/react-dom": "19.1.9",
     "react": "19.1.1",
     "react-dom": "19.1.1",
     "@utils/test": "0.0.1"
@@ -81,7 +81,7 @@
     "deepmerge": "4.3.1",
     "react-toastify": "11.0.5",
     "react-use-clipboard": "1.0.9",
-    "@ultraviolet/icons": "4.0.3",
+    "@ultraviolet/icons": "4.0.4",
     "@ultraviolet/themes": "2.0.0"
   },
   "scripts": {

package/dist/components/SearchInput/Key.cjs

@@ -1,55 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
-const _styled = require("@emotion/styled/base");
-const react = require("react");
-const index = require("../Text/index.cjs");
-const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
-const Container = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "ekyw9u10"
-} : {
-  target: "ekyw9u10",
-  label: "Container"
-})("cursor:text;background:", ({
-  theme
-}) => theme.colors.neutral.backgroundWeak, ";border-radius:", ({
-  theme
-}) => theme.radii.default, ";border:0.5px solid ", ({
-  theme
-}) => theme.colors.neutral.border, ";min-width:", ({
-  theme
-}) => theme.sizing["300"], ";min-height:", ({
-  theme
-}) => theme.sizing["300"], ";display:flex;justify-content:center;align-items:center;&[data-disabled='true']{background:", ({
-  theme
-}) => theme.colors.neutral.backgroundDisabled, ";border-color:", ({
-  theme
-}) => theme.colors.neutral.borderDisabled, ";}&[data-children-length='true']{width:auto;padding:0 ", ({
-  theme
-}) => 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 */"));
-const KEYS_MATCH = {
-  " ": "␣",
-  Alt: "Alt",
-  ArrowDown: "↓",
-  ArrowLeft: "←",
-  ArrowRight: "→",
-  ArrowUp: "↑",
-  Backspace: "⌫",
-  CapsLock: "Caps",
-  Control: "Ctrl",
-  Delete: "⌦",
-  Enter: "↵",
-  Escape: "Esc",
-  Meta: "⌘"
-};
-const Key = ({
-  children,
-  disabled
-}) => {
-  const isSpecialKey = react.useMemo(() => Object.keys(KEYS_MATCH).find((key) => key === children), [children]);
-  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 }) });
-};
-exports.KEYS_MATCH = KEYS_MATCH;
-exports.Key = Key;

package/dist/components/SearchInput/Key.d.ts

@@ -1,21 +0,0 @@
-export declare const KEYS_MATCH: {
-    readonly ' ': "␣";
-    readonly Alt: "Alt";
-    readonly ArrowDown: "↓";
-    readonly ArrowLeft: "←";
-    readonly ArrowRight: "→";
-    readonly ArrowUp: "↑";
-    readonly Backspace: "⌫";
-    readonly CapsLock: "Caps";
-    readonly Control: "Ctrl";
-    readonly Delete: "⌦";
-    readonly Enter: "↵";
-    readonly Escape: "Esc";
-    readonly Meta: "⌘";
-};
-type KeyProps = {
-    children: KeyboardEvent['key'];
-    disabled?: boolean;
-};
-export declare const Key: ({ children, disabled }: KeyProps) => import("@emotion/react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/SearchInput/Key.js

@@ -1,53 +0,0 @@
-"use client";
-import { jsx } from "@emotion/react/jsx-runtime";
-import _styled from "@emotion/styled/base";
-import { useMemo } from "react";
-import { Text } from "../Text/index.js";
-const Container = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "ekyw9u10"
-} : {
-  target: "ekyw9u10",
-  label: "Container"
-})("cursor:text;background:", ({
-  theme
-}) => theme.colors.neutral.backgroundWeak, ";border-radius:", ({
-  theme
-}) => theme.radii.default, ";border:0.5px solid ", ({
-  theme
-}) => theme.colors.neutral.border, ";min-width:", ({
-  theme
-}) => theme.sizing["300"], ";min-height:", ({
-  theme
-}) => theme.sizing["300"], ";display:flex;justify-content:center;align-items:center;&[data-disabled='true']{background:", ({
-  theme
-}) => theme.colors.neutral.backgroundDisabled, ";border-color:", ({
-  theme
-}) => theme.colors.neutral.borderDisabled, ";}&[data-children-length='true']{width:auto;padding:0 ", ({
-  theme
-}) => 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 */"));
-const KEYS_MATCH = {
-  " ": "␣",
-  Alt: "Alt",
-  ArrowDown: "↓",
-  ArrowLeft: "←",
-  ArrowRight: "→",
-  ArrowUp: "↑",
-  Backspace: "⌫",
-  CapsLock: "Caps",
-  Control: "Ctrl",
-  Delete: "⌦",
-  Enter: "↵",
-  Escape: "Esc",
-  Meta: "⌘"
-};
-const Key = ({
-  children,
-  disabled
-}) => {
-  const isSpecialKey = useMemo(() => Object.keys(KEYS_MATCH).find((key) => key === children), [children]);
-  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 }) });
-};
-export {
-  KEYS_MATCH,
-  Key
-};