@shapesos/clay 0.13.0 → 0.14.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.
- package/dist/ai-elements.cjs +877 -0
- package/dist/ai-elements.cjs.map +1 -0
- package/dist/ai-elements.d.cts +136 -0
- package/dist/ai-elements.d.ts +136 -0
- package/dist/ai-elements.js +31 -0
- package/dist/ai-elements.js.map +1 -0
- package/dist/artifacts.cjs +56 -11
- package/dist/artifacts.cjs.map +1 -1
- package/dist/artifacts.js +6 -6
- package/dist/blocks.cjs +95 -28
- package/dist/blocks.cjs.map +1 -1
- package/dist/blocks.css +1 -1
- package/dist/blocks.js +7 -7
- package/dist/button.cjs +27 -17
- package/dist/button.cjs.map +1 -1
- package/dist/button.js +3 -2
- package/dist/chart.js +3 -3
- package/dist/chat.cjs +95 -28
- package/dist/chat.cjs.map +1 -1
- package/dist/chat.js +8 -8
- package/dist/{chunk-QH2WW2MW.js → chunk-3THOTQO3.js} +7 -7
- package/dist/{chunk-WPQQVKWY.js → chunk-7OYIDM42.js} +2 -2
- package/dist/{chunk-EDICS62G.js → chunk-B4U37WIH.js} +9 -11
- package/dist/chunk-B4U37WIH.js.map +1 -0
- package/dist/chunk-BR5S37SC.js +171 -0
- package/dist/chunk-BR5S37SC.js.map +1 -0
- package/dist/chunk-CYC2YUKU.js +1 -0
- package/dist/chunk-CYC2YUKU.js.map +1 -0
- package/dist/chunk-L75JPWGS.js +1 -0
- package/dist/chunk-L75JPWGS.js.map +1 -0
- package/dist/{chunk-26XVDY6Z.js → chunk-MDAWYZBI.js} +15 -3
- package/dist/{chunk-26XVDY6Z.js.map → chunk-MDAWYZBI.js.map} +1 -1
- package/dist/{chunk-L6DUGB2E.js → chunk-PGR2MDDU.js} +16 -5
- package/dist/chunk-PGR2MDDU.js.map +1 -0
- package/dist/{chunk-OBOXCBDL.js → chunk-PYDVANWI.js} +58 -13
- package/dist/chunk-PYDVANWI.js.map +1 -0
- package/dist/{chunk-SV24ONND.js → chunk-UXT2H3FM.js} +28 -18
- package/dist/chunk-UXT2H3FM.js.map +1 -0
- package/dist/{chunk-DT44KNCV.js → chunk-XFJ6XMJZ.js} +5 -5
- package/dist/{chunk-QXGYMDIA.js → chunk-YZB6YXKK.js} +4 -4
- package/dist/icon.cjs +56 -11
- package/dist/icon.cjs.map +1 -1
- package/dist/icon.d.cts +11 -2
- package/dist/icon.d.ts +11 -2
- package/dist/icon.js +1 -1
- package/dist/index.cjs +658 -415
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +50 -28
- package/dist/keyboard-shortcut.cjs +15 -4
- package/dist/keyboard-shortcut.cjs.map +1 -1
- package/dist/keyboard-shortcut.d.cts +10 -3
- package/dist/keyboard-shortcut.d.ts +10 -3
- package/dist/keyboard-shortcut.js +1 -1
- package/dist/text-area.cjs +27 -17
- package/dist/text-area.cjs.map +1 -1
- package/dist/text-area.d.cts +2 -24
- package/dist/text-area.d.ts +2 -24
- package/dist/text-area.js +3 -2
- package/dist/tokens.cjs +27 -17
- package/dist/tokens.cjs.map +1 -1
- package/dist/tokens.d.cts +6 -5
- package/dist/tokens.d.ts +6 -5
- package/dist/tokens.js +1 -1
- package/dist/types-CMzZsL_J.d.cts +25 -0
- package/dist/types-CMzZsL_J.d.ts +25 -0
- package/dist/utils.js +3 -3
- package/package.json +6 -1
- package/dist/chunk-EDICS62G.js.map +0 -1
- package/dist/chunk-L6DUGB2E.js.map +0 -1
- package/dist/chunk-OBOXCBDL.js.map +0 -1
- package/dist/chunk-SV24ONND.js.map +0 -1
- /package/dist/{chunk-QH2WW2MW.js.map → chunk-3THOTQO3.js.map} +0 -0
- /package/dist/{chunk-WPQQVKWY.js.map → chunk-7OYIDM42.js.map} +0 -0
- /package/dist/{chunk-DT44KNCV.js.map → chunk-XFJ6XMJZ.js.map} +0 -0
- /package/dist/{chunk-QXGYMDIA.js.map → chunk-YZB6YXKK.js.map} +0 -0
package/dist/index.d.cts
CHANGED
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
export { ColorToken, TypographyStyle, TypographyType, colors, fontFamilies, typographyMixin, typographyStyles, typographyTypes } from './tokens.cjs';
|
|
2
2
|
export { ArtifactRefBlock, ArtifactRefBlockService, Block, BlockContext, BlockContextValue, BlockServices, TextBlockService, useBlockContext } from './blocks.cjs';
|
|
3
3
|
export { A as ArtifactRefBlockRecord, B as BlockComponentProps, a as BlockRecord, b as BlockService, c as BlockType, T as TextBlockRecord, d as blockTypes } from './types-CW45GBXl.cjs';
|
|
4
|
+
export { CHAT_STATUS, ChatStatus, MouseGrid, MouseGridProps, PromptInput, PromptInputFooter, PromptInputFooterProps, PromptInputMessage, PromptInputProps, PromptInputSubmit, PromptInputSubmitProps, PromptInputTextarea, PromptInputTextareaProps, PromptInputTools, PromptInputToolsProps, Suggestion, SuggestionProps, Suggestions, SuggestionsProps } from './ai-elements.cjs';
|
|
4
5
|
export { A as ArtifactCallbacksOf, a as ArtifactDataRow, b as ArtifactLabelsOf, c as ArtifactRecord, d as ArtifactService, e as ArtifactServiceProps, f as ArtifactType, B as BarChartConfig, C as ChartArtifactLabels, g as ChartArtifactRecord, h as ChartConfig, i as ChartStats, D as DEFAULT_CHART_ARTIFACT_LABELS, j as DEFAULT_TABLE_ARTIFACT_LABELS, L as LineChartConfig, P as PieChartConfig, T as TableArtifactLabels, k as TableArtifactRecord, l as TableColumn, m as TableConfig, n as TableRow, o as TableStats, p as artifactTypes } from './types-BzXPBy6s.cjs';
|
|
5
6
|
export { ArtifactCopyAsImageButton, ArtifactCopyAsImageButtonProps, ArtifactDownloadButton, ArtifactDownloadButtonProps, ArtifactDownloadMenu, ArtifactDownloadMenuCsvAction, ArtifactDownloadMenuPngAction, ArtifactDownloadMenuProps, ArtifactServices, ChartArtifact, TableArtifact, artifactToClipboardText, isSafeDownloadUrl } from './artifacts.cjs';
|
|
6
7
|
export { ChatContext, ChatContextValue, ChatMessage, ChatMessageType, MESSAGE_ROLE, MessageRole, copyMessageText, useChatContext, useCopyToClipboard } from './chat.cjs';
|
|
7
|
-
export { Icon, IconButton, IconButtonProps, IconButtonSize, IconButtonVariant, IconProps } from './icon.cjs';
|
|
8
|
+
export { Icon, IconButton, IconButtonIntent, IconButtonProps, IconButtonSize, IconButtonVariant, IconProps } from './icon.cjs';
|
|
8
9
|
export { IconCtrl, KEYBOARD_SHORTCUT_VARIANTS, KeyIcon, KeyboardShortcut, KeyboardShortcutProps, KeyboardShortcutVariant } from './keyboard-shortcut.cjs';
|
|
9
10
|
export { Lottie, LottieAnimationData, LottieProps, LottieRef } from './lottie.cjs';
|
|
10
|
-
export { TextArea
|
|
11
|
+
export { TextArea } from './text-area.cjs';
|
|
12
|
+
export { T as TextAreaProps } from './types-CMzZsL_J.cjs';
|
|
11
13
|
export { MarkdownTable, convertTableToCSV, escapeCsvField, markdownToPlainText, mergeRefs, parseMarkdownTable } from './utils.cjs';
|
|
12
14
|
export { BUTTON_INTENT, BUTTON_SIZE, BUTTON_VARIANT, Button, ButtonIntent, ButtonProps, ButtonSize, ButtonVariant, ICON_POSITION, IconPosition } from './button.cjs';
|
|
13
15
|
export { C as ChartSeries, a as ChartVariant } from './types-B2aYk82c.cjs';
|
package/dist/index.d.ts
CHANGED
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
export { ColorToken, TypographyStyle, TypographyType, colors, fontFamilies, typographyMixin, typographyStyles, typographyTypes } from './tokens.js';
|
|
2
2
|
export { ArtifactRefBlock, ArtifactRefBlockService, Block, BlockContext, BlockContextValue, BlockServices, TextBlockService, useBlockContext } from './blocks.js';
|
|
3
3
|
export { A as ArtifactRefBlockRecord, B as BlockComponentProps, a as BlockRecord, b as BlockService, c as BlockType, T as TextBlockRecord, d as blockTypes } from './types-D1b8v7EY.js';
|
|
4
|
+
export { CHAT_STATUS, ChatStatus, MouseGrid, MouseGridProps, PromptInput, PromptInputFooter, PromptInputFooterProps, PromptInputMessage, PromptInputProps, PromptInputSubmit, PromptInputSubmitProps, PromptInputTextarea, PromptInputTextareaProps, PromptInputTools, PromptInputToolsProps, Suggestion, SuggestionProps, Suggestions, SuggestionsProps } from './ai-elements.js';
|
|
4
5
|
export { A as ArtifactCallbacksOf, a as ArtifactDataRow, b as ArtifactLabelsOf, c as ArtifactRecord, d as ArtifactService, e as ArtifactServiceProps, f as ArtifactType, B as BarChartConfig, C as ChartArtifactLabels, g as ChartArtifactRecord, h as ChartConfig, i as ChartStats, D as DEFAULT_CHART_ARTIFACT_LABELS, j as DEFAULT_TABLE_ARTIFACT_LABELS, L as LineChartConfig, P as PieChartConfig, T as TableArtifactLabels, k as TableArtifactRecord, l as TableColumn, m as TableConfig, n as TableRow, o as TableStats, p as artifactTypes } from './types-GCkXbyFm.js';
|
|
5
6
|
export { ArtifactCopyAsImageButton, ArtifactCopyAsImageButtonProps, ArtifactDownloadButton, ArtifactDownloadButtonProps, ArtifactDownloadMenu, ArtifactDownloadMenuCsvAction, ArtifactDownloadMenuPngAction, ArtifactDownloadMenuProps, ArtifactServices, ChartArtifact, TableArtifact, artifactToClipboardText, isSafeDownloadUrl } from './artifacts.js';
|
|
6
7
|
export { ChatContext, ChatContextValue, ChatMessage, ChatMessageType, MESSAGE_ROLE, MessageRole, copyMessageText, useChatContext, useCopyToClipboard } from './chat.js';
|
|
7
|
-
export { Icon, IconButton, IconButtonProps, IconButtonSize, IconButtonVariant, IconProps } from './icon.js';
|
|
8
|
+
export { Icon, IconButton, IconButtonIntent, IconButtonProps, IconButtonSize, IconButtonVariant, IconProps } from './icon.js';
|
|
8
9
|
export { IconCtrl, KEYBOARD_SHORTCUT_VARIANTS, KeyIcon, KeyboardShortcut, KeyboardShortcutProps, KeyboardShortcutVariant } from './keyboard-shortcut.js';
|
|
9
10
|
export { Lottie, LottieAnimationData, LottieProps, LottieRef } from './lottie.js';
|
|
10
|
-
export { TextArea
|
|
11
|
+
export { TextArea } from './text-area.js';
|
|
12
|
+
export { T as TextAreaProps } from './types-CMzZsL_J.js';
|
|
11
13
|
export { MarkdownTable, convertTableToCSV, escapeCsvField, markdownToPlainText, mergeRefs, parseMarkdownTable } from './utils.js';
|
|
12
14
|
export { BUTTON_INTENT, BUTTON_SIZE, BUTTON_VARIANT, Button, ButtonIntent, ButtonProps, ButtonSize, ButtonVariant, ICON_POSITION, IconPosition } from './button.js';
|
|
13
15
|
export { C as ChartSeries, a as ChartVariant } from './types-B2aYk82c.js';
|
package/dist/index.js
CHANGED
|
@@ -1,29 +1,19 @@
|
|
|
1
|
+
import "./chunk-72TJUKMV.js";
|
|
1
2
|
import {
|
|
2
3
|
Lottie
|
|
3
4
|
} from "./chunk-BIATJTD4.js";
|
|
4
|
-
import
|
|
5
|
-
TextArea
|
|
6
|
-
} from "./chunk-WPQQVKWY.js";
|
|
5
|
+
import "./chunk-L75JPWGS.js";
|
|
7
6
|
import {
|
|
8
7
|
IconCtrl,
|
|
9
8
|
KEYBOARD_SHORTCUT_VARIANTS,
|
|
10
9
|
KeyboardShortcut
|
|
11
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-PGR2MDDU.js";
|
|
12
11
|
import {
|
|
13
12
|
convertTableToCSV,
|
|
14
13
|
escapeCsvField,
|
|
15
14
|
parseMarkdownTable
|
|
16
15
|
} from "./chunk-JJUIBBBU.js";
|
|
17
|
-
import
|
|
18
|
-
mergeRefs
|
|
19
|
-
} from "./chunk-KNYB3RL7.js";
|
|
20
|
-
import {
|
|
21
|
-
BUTTON_INTENT,
|
|
22
|
-
BUTTON_SIZE,
|
|
23
|
-
BUTTON_VARIANT,
|
|
24
|
-
Button,
|
|
25
|
-
ICON_POSITION
|
|
26
|
-
} from "./chunk-EDICS62G.js";
|
|
16
|
+
import "./chunk-CYC2YUKU.js";
|
|
27
17
|
import {
|
|
28
18
|
ChatContext,
|
|
29
19
|
ChatMessage,
|
|
@@ -31,7 +21,7 @@ import {
|
|
|
31
21
|
copyMessageText,
|
|
32
22
|
useChatContext,
|
|
33
23
|
useCopyToClipboard
|
|
34
|
-
} from "./chunk-
|
|
24
|
+
} from "./chunk-3THOTQO3.js";
|
|
35
25
|
import {
|
|
36
26
|
BlockContext,
|
|
37
27
|
useBlockContext
|
|
@@ -43,10 +33,34 @@ import {
|
|
|
43
33
|
BlockServices,
|
|
44
34
|
TextBlockService,
|
|
45
35
|
blockTypes
|
|
46
|
-
} from "./chunk-
|
|
36
|
+
} from "./chunk-MDAWYZBI.js";
|
|
47
37
|
import {
|
|
48
38
|
markdownToPlainText
|
|
49
39
|
} from "./chunk-NMKKU2UG.js";
|
|
40
|
+
import {
|
|
41
|
+
CHAT_STATUS,
|
|
42
|
+
MouseGrid,
|
|
43
|
+
PromptInput,
|
|
44
|
+
PromptInputFooter,
|
|
45
|
+
PromptInputSubmit,
|
|
46
|
+
PromptInputTextarea,
|
|
47
|
+
PromptInputTools,
|
|
48
|
+
Suggestion,
|
|
49
|
+
Suggestions
|
|
50
|
+
} from "./chunk-BR5S37SC.js";
|
|
51
|
+
import {
|
|
52
|
+
TextArea
|
|
53
|
+
} from "./chunk-7OYIDM42.js";
|
|
54
|
+
import {
|
|
55
|
+
mergeRefs
|
|
56
|
+
} from "./chunk-KNYB3RL7.js";
|
|
57
|
+
import {
|
|
58
|
+
BUTTON_INTENT,
|
|
59
|
+
BUTTON_SIZE,
|
|
60
|
+
BUTTON_VARIANT,
|
|
61
|
+
Button,
|
|
62
|
+
ICON_POSITION
|
|
63
|
+
} from "./chunk-B4U37WIH.js";
|
|
50
64
|
import "./chunk-RSRNSWJN.js";
|
|
51
65
|
import {
|
|
52
66
|
ArtifactCopyAsImageButton,
|
|
@@ -60,28 +74,27 @@ import {
|
|
|
60
74
|
artifactToClipboardText,
|
|
61
75
|
artifactTypes,
|
|
62
76
|
isSafeDownloadUrl
|
|
63
|
-
} from "./chunk-
|
|
77
|
+
} from "./chunk-XFJ6XMJZ.js";
|
|
78
|
+
import {
|
|
79
|
+
IconButton
|
|
80
|
+
} from "./chunk-PYDVANWI.js";
|
|
64
81
|
import "./chunk-LXYCT4YO.js";
|
|
65
|
-
import
|
|
82
|
+
import {
|
|
83
|
+
Icon
|
|
84
|
+
} from "./chunk-OLJIJYB5.js";
|
|
85
|
+
import "./chunk-YZB6YXKK.js";
|
|
66
86
|
import "./chunk-C77QMQNT.js";
|
|
67
87
|
import {
|
|
68
88
|
fontFamilies,
|
|
69
89
|
typographyMixin,
|
|
70
90
|
typographyStyles,
|
|
71
91
|
typographyTypes
|
|
72
|
-
} from "./chunk-
|
|
73
|
-
import "./chunk-4MZZH3WX.js";
|
|
74
|
-
import "./chunk-P6GUNIAE.js";
|
|
75
|
-
import "./chunk-72TJUKMV.js";
|
|
76
|
-
import {
|
|
77
|
-
IconButton
|
|
78
|
-
} from "./chunk-OBOXCBDL.js";
|
|
79
|
-
import {
|
|
80
|
-
Icon
|
|
81
|
-
} from "./chunk-OLJIJYB5.js";
|
|
92
|
+
} from "./chunk-UXT2H3FM.js";
|
|
82
93
|
import {
|
|
83
94
|
colors
|
|
84
95
|
} from "./chunk-JF3P66JF.js";
|
|
96
|
+
import "./chunk-4MZZH3WX.js";
|
|
97
|
+
import "./chunk-P6GUNIAE.js";
|
|
85
98
|
import "./chunk-5WRI5ZAA.js";
|
|
86
99
|
export {
|
|
87
100
|
ArtifactCopyAsImageButton,
|
|
@@ -97,6 +110,7 @@ export {
|
|
|
97
110
|
BlockContext,
|
|
98
111
|
BlockServices,
|
|
99
112
|
Button,
|
|
113
|
+
CHAT_STATUS,
|
|
100
114
|
ChartArtifact,
|
|
101
115
|
ChatContext,
|
|
102
116
|
ChatMessage,
|
|
@@ -110,6 +124,14 @@ export {
|
|
|
110
124
|
KeyboardShortcut,
|
|
111
125
|
Lottie,
|
|
112
126
|
MESSAGE_ROLE,
|
|
127
|
+
MouseGrid,
|
|
128
|
+
PromptInput,
|
|
129
|
+
PromptInputFooter,
|
|
130
|
+
PromptInputSubmit,
|
|
131
|
+
PromptInputTextarea,
|
|
132
|
+
PromptInputTools,
|
|
133
|
+
Suggestion,
|
|
134
|
+
Suggestions,
|
|
113
135
|
TableArtifact,
|
|
114
136
|
TextArea,
|
|
115
137
|
TextBlockService,
|
|
@@ -171,9 +171,9 @@ var colors = {
|
|
|
171
171
|
|
|
172
172
|
// src/components/keyboard-shortcut/types.ts
|
|
173
173
|
var KEYBOARD_SHORTCUT_VARIANTS = {
|
|
174
|
-
/** Outlined keys with a subtle border —
|
|
174
|
+
/** Outlined keys with a subtle border + light glyph — for dark surfaces / app chrome. Default. */
|
|
175
175
|
OUTLINED: "outlined",
|
|
176
|
-
/** Filled keys with a solid background —
|
|
176
|
+
/** Filled keys with a solid background — for emphasis. */
|
|
177
177
|
FILLED: "filled"
|
|
178
178
|
};
|
|
179
179
|
|
|
@@ -188,6 +188,16 @@ var variantStyles = {
|
|
|
188
188
|
color: ${colors["brown-10"]};
|
|
189
189
|
`
|
|
190
190
|
};
|
|
191
|
+
var adaptiveStyles = {
|
|
192
|
+
[KEYBOARD_SHORTCUT_VARIANTS.OUTLINED]: import_styled_components2.css`
|
|
193
|
+
border: 1px solid color-mix(in oklch, currentColor 40%, transparent);
|
|
194
|
+
color: currentColor;
|
|
195
|
+
`,
|
|
196
|
+
[KEYBOARD_SHORTCUT_VARIANTS.FILLED]: import_styled_components2.css`
|
|
197
|
+
background: color-mix(in oklch, currentColor 12%, transparent);
|
|
198
|
+
color: currentColor;
|
|
199
|
+
`
|
|
200
|
+
};
|
|
191
201
|
var Wrapper = import_styled_components2.default.div`
|
|
192
202
|
display: inline-flex;
|
|
193
203
|
align-items: center;
|
|
@@ -199,7 +209,7 @@ var Key = import_styled_components2.default.kbd`
|
|
|
199
209
|
justify-content: center;
|
|
200
210
|
padding: 2px;
|
|
201
211
|
border-radius: 6px;
|
|
202
|
-
${({ $variant }) => variantStyles[$variant]};
|
|
212
|
+
${({ $variant, $adaptive }) => ($adaptive ? adaptiveStyles : variantStyles)[$variant]};
|
|
203
213
|
`;
|
|
204
214
|
|
|
205
215
|
// src/components/keyboard-shortcut/keyboard-shortcut.tsx
|
|
@@ -207,9 +217,10 @@ var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
|
207
217
|
function KeyboardShortcut({
|
|
208
218
|
keys,
|
|
209
219
|
variant = KEYBOARD_SHORTCUT_VARIANTS.OUTLINED,
|
|
220
|
+
adaptive = false,
|
|
210
221
|
className
|
|
211
222
|
}) {
|
|
212
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Wrapper, { className, children: keys.map((KeyComponent, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Key, { $variant: variant, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { icon: KeyComponent, size: 12 }) }, index)) });
|
|
223
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Wrapper, { className, children: keys.map((KeyComponent, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Key, { $variant: variant, $adaptive: adaptive, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { icon: KeyComponent, size: 12 }) }, index)) });
|
|
213
224
|
}
|
|
214
225
|
|
|
215
226
|
// src/components/keyboard-shortcut/icons/icon-ctrl.tsx
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/keyboard-shortcut/index.ts","../src/components/icon/icon.tsx","../src/components/icon/icon-styles.ts","../src/components/keyboard-shortcut/keyboard-shortcut-styles.ts","../src/tokens/colors.ts","../src/components/keyboard-shortcut/types.ts","../src/components/keyboard-shortcut/keyboard-shortcut.tsx","../src/components/keyboard-shortcut/icons/icon-ctrl.tsx"],"sourcesContent":["export { KeyboardShortcut } from \"./keyboard-shortcut\";\nexport { IconCtrl } from \"./icons/icon-ctrl\";\nexport { KEYBOARD_SHORTCUT_VARIANTS } from \"./types\";\nexport type { KeyboardShortcutProps, KeyIcon, KeyboardShortcutVariant } from \"./types\";\n","import { forwardRef } from \"react\";\n\nimport { IconWrapper, getStrokeWidth } from \"./icon-styles\";\nimport type { IconProps } from \"./types\";\n\nconst DEFAULT_SIZE = 16;\n\nexport const Icon = forwardRef<HTMLSpanElement, IconProps>(function Icon(\n { icon: IconComponent, size = DEFAULT_SIZE, color, className, \"aria-label\": ariaLabel },\n ref\n) {\n return (\n <IconWrapper\n ref={ref}\n className={className}\n $color={color}\n aria-label={ariaLabel}\n role={ariaLabel ? \"img\" : undefined}\n >\n <IconComponent width={size} height={size} strokeWidth={getStrokeWidth(size)} />\n </IconWrapper>\n );\n});\n","import styled from \"styled-components\";\n\nexport const STROKE_WIDTH_BY_SIZE: Record<number, number> = {\n 12: 1.4,\n 14: 1.4,\n 16: 1.8,\n 18: 1.8,\n 20: 1.8,\n 24: 1.8,\n};\n\nexport const DEFAULT_STROKE_WIDTH = 1.8;\n\nexport function getStrokeWidth(size: number): number {\n return STROKE_WIDTH_BY_SIZE[size] ?? DEFAULT_STROKE_WIDTH;\n}\n\nexport const IconWrapper = styled.span<{ $color?: string }>`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: ${({ $color }) => $color ?? \"currentColor\"};\n flex-shrink: 0;\n`;\n","import styled, { css } from \"styled-components\";\n\nimport { colors } from \"../../tokens/colors\";\nimport { KEYBOARD_SHORTCUT_VARIANTS } from \"./types\";\nimport type { KeyboardShortcutVariant } from \"./types\";\n\nconst variantStyles: Record<KeyboardShortcutVariant, ReturnType<typeof css>> = {\n [KEYBOARD_SHORTCUT_VARIANTS.OUTLINED]: css`\n border: 1px solid ${colors[\"white-alpha-40\"]};\n color: ${colors[\"brown-10\"]};\n `,\n [KEYBOARD_SHORTCUT_VARIANTS.FILLED]: css`\n background: ${colors[\"brown-80\"]};\n color: ${colors[\"brown-10\"]};\n `,\n};\n\nexport const Wrapper = styled.div`\n display: inline-flex;\n align-items: center;\n gap: 2px;\n`;\n\nexport const Key = styled.kbd<{ $variant: KeyboardShortcutVariant }>`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 2px;\n border-radius: 6px;\n ${({ $variant }) => variantStyles[$variant]};\n`;\n","export const colors = {\n // White\n white: \"#FFFFFF\",\n \"white-alpha-85\": \"rgba(255, 255, 255, 0.85)\",\n \"white-alpha-40\": \"rgba(255, 255, 255, 0.40)\",\n\n // Brown\n \"brown-10\": \"#FAF9F8\",\n \"brown-20\": \"#F5F3F0\",\n \"brown-30\": \"#EEEBE5\",\n \"brown-40\": \"#E6E2DA\",\n \"brown-50\": \"#CFCBC4\",\n \"brown-60\": \"#A19E99\",\n \"brown-70\": \"#73716D\",\n \"brown-80\": \"#5C5A57\",\n \"brown-90\": \"#2E2D2C\",\n \"brown-100\": \"#171716\",\n \"brown-alpha-12\": \"rgba(23, 23, 22, 0.12)\",\n \"brown-alpha-20\": \"rgba(23, 23, 22, 0.20)\",\n \"brown-alpha-55\": \"rgba(23, 23, 22, 0.55)\",\n \"brown-alpha-70\": \"rgba(23, 23, 22, 0.70)\",\n \"brown-alpha-80\": \"rgba(23, 23, 22, 0.80)\",\n \"brown-alpha-90\": \"rgba(23, 23, 22, 0.90)\",\n\n // Fuchsia\n \"fuchsia-50\": \"#FAF5FF\",\n \"fuchsia-300\": \"#F0ABFC\",\n \"fuchsia-500\": \"#D946EF\",\n \"fuchsia-600\": \"#C026D3\",\n \"fuchsia-800\": \"#86198F\",\n\n // Pink\n \"pink-50\": \"#FDF2F8\",\n \"pink-400\": \"#F472B6\",\n \"pink-600\": \"#DB2777\",\n \"pink-800\": \"#9D174D\",\n\n // Violet\n \"violet-50\": \"#F5F3FF\",\n \"violet-400\": \"#A78BFA\",\n \"violet-600\": \"#7C3AED\",\n \"violet-800\": \"#5B21B6\",\n\n // Indigo\n \"indigo-50\": \"#EEF2FF\",\n \"indigo-400\": \"#818CF8\",\n \"indigo-500\": \"#6366F1\",\n \"indigo-600\": \"#4F46E5\",\n \"indigo-800\": \"#3730A3\",\n\n // Cyan\n \"cyan-50\": \"#E7FEFF\",\n \"cyan-300\": \"#67E8F9\",\n \"cyan-600\": \"#0891B2\",\n \"cyan-900\": \"#164E63\",\n\n // Teal\n \"teal-50\": \"#EBFDF9\",\n \"teal-300\": \"#5EEAD4\",\n \"teal-600\": \"#0D9488\",\n\n // Rose\n \"rose-400\": \"#FB7185\",\n\n // Purple\n \"purple-400\": \"#C084FC\",\n\n // Blue\n \"blue-50\": \"#EFF6FF\",\n \"blue-100\": \"#DBEAFE\",\n \"blue-300\": \"#93C5FD\",\n \"blue-400\": \"#60A5FA\",\n \"blue-600\": \"#2563EB\",\n \"blue-800\": \"#1E40AF\",\n\n // Sky\n \"sky-300\": \"#7DD3FC\",\n\n // Green\n \"green-50\": \"#ECF9F0\",\n \"green-100\": \"#D4F1D9\",\n \"green-400\": \"#3DC269\",\n \"green-700\": \"#277C43\",\n \"green-800\": \"#1C5930\",\n\n // Orange\n \"orange-50\": \"#FFF7ED\",\n \"orange-100\": \"#FFEDD5\",\n \"orange-200\": \"#FED7AA\",\n \"orange-500\": \"#F97316\",\n \"orange-600\": \"#EA580C\",\n\n // Red\n \"red-50\": \"#FEF2F2\",\n \"red-100\": \"#FEE2E2\",\n \"red-200\": \"#FECACA\",\n \"red-400\": \"#F7776C\",\n \"red-500\": \"#EF4444\",\n \"red-600\": \"#DC2626\",\n} as const;\n\nexport type ColorToken = keyof typeof colors;\n","import type { ComponentType, SVGProps } from \"react\";\n\n/** An SVG icon component representing a single keyboard key (e.g., Cmd, Shift, a letter). */\nexport type KeyIcon = ComponentType<SVGProps<SVGSVGElement>>;\n\n/** Available visual variants for the keyboard shortcut display. */\nexport const KEYBOARD_SHORTCUT_VARIANTS = {\n /** Outlined keys with a subtle border — use on dark backgrounds. */\n OUTLINED: \"outlined\",\n /** Filled keys with a solid background — use for emphasis or light backgrounds. */\n FILLED: \"filled\",\n} as const;\n\n/** Visual variant for the KeyboardShortcut component. */\nexport type KeyboardShortcutVariant = (typeof KEYBOARD_SHORTCUT_VARIANTS)[keyof typeof KEYBOARD_SHORTCUT_VARIANTS];\n\n/** Props for the KeyboardShortcut display component. */\nexport interface KeyboardShortcutProps {\n /** Ordered array of key icon components representing the shortcut (e.g., `[IconCommand, IconLetterK]` for ⌘K). */\n keys: KeyIcon[];\n /** Visual style variant. @default \"outlined\" */\n variant?: KeyboardShortcutVariant;\n /** Additional CSS class name. */\n className?: string;\n}\n","import type { ReactElement } from \"react\";\n\nimport { Icon } from \"../icon/icon\";\nimport { Key, Wrapper } from \"./keyboard-shortcut-styles\";\nimport { KEYBOARD_SHORTCUT_VARIANTS } from \"./types\";\nimport type { KeyboardShortcutProps } from \"./types\";\n\nexport function KeyboardShortcut({\n keys,\n variant = KEYBOARD_SHORTCUT_VARIANTS.OUTLINED,\n className,\n}: KeyboardShortcutProps): ReactElement {\n return (\n <Wrapper className={className}>\n {keys.map((KeyComponent, index) => (\n <Key key={index} $variant={variant}>\n <Icon icon={KeyComponent} size={12} />\n </Key>\n ))}\n </Wrapper>\n );\n}\n","import type { ReactElement, SVGProps } from \"react\";\n\nexport function IconCtrl(props: SVGProps<SVGSVGElement>): ReactElement {\n const { width = 24, height = 24, ...rest } = props;\n\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" width={width} height={height} fill=\"none\" {...rest}>\n <text\n x=\"50%\"\n y=\"50%\"\n dominantBaseline=\"central\"\n textAnchor=\"middle\"\n fill=\"currentColor\"\n fontFamily=\"Geist, sans-serif\"\n fontWeight={300}\n fontSize={14}\n >\n Ctrl\n </text>\n </svg>\n );\n}\n"],"mappings":"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","names":["styled","Icon","import_styled_components","styled","import_jsx_runtime","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/keyboard-shortcut/index.ts","../src/components/icon/icon.tsx","../src/components/icon/icon-styles.ts","../src/components/keyboard-shortcut/keyboard-shortcut-styles.ts","../src/tokens/colors.ts","../src/components/keyboard-shortcut/types.ts","../src/components/keyboard-shortcut/keyboard-shortcut.tsx","../src/components/keyboard-shortcut/icons/icon-ctrl.tsx"],"sourcesContent":["export { KeyboardShortcut } from \"./keyboard-shortcut\";\nexport { IconCtrl } from \"./icons/icon-ctrl\";\nexport { KEYBOARD_SHORTCUT_VARIANTS } from \"./types\";\nexport type { KeyboardShortcutProps, KeyIcon, KeyboardShortcutVariant } from \"./types\";\n","import { forwardRef } from \"react\";\n\nimport { IconWrapper, getStrokeWidth } from \"./icon-styles\";\nimport type { IconProps } from \"./types\";\n\nconst DEFAULT_SIZE = 16;\n\nexport const Icon = forwardRef<HTMLSpanElement, IconProps>(function Icon(\n { icon: IconComponent, size = DEFAULT_SIZE, color, className, \"aria-label\": ariaLabel },\n ref\n) {\n return (\n <IconWrapper\n ref={ref}\n className={className}\n $color={color}\n aria-label={ariaLabel}\n role={ariaLabel ? \"img\" : undefined}\n >\n <IconComponent width={size} height={size} strokeWidth={getStrokeWidth(size)} />\n </IconWrapper>\n );\n});\n","import styled from \"styled-components\";\n\nexport const STROKE_WIDTH_BY_SIZE: Record<number, number> = {\n 12: 1.4,\n 14: 1.4,\n 16: 1.8,\n 18: 1.8,\n 20: 1.8,\n 24: 1.8,\n};\n\nexport const DEFAULT_STROKE_WIDTH = 1.8;\n\nexport function getStrokeWidth(size: number): number {\n return STROKE_WIDTH_BY_SIZE[size] ?? DEFAULT_STROKE_WIDTH;\n}\n\nexport const IconWrapper = styled.span<{ $color?: string }>`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: ${({ $color }) => $color ?? \"currentColor\"};\n flex-shrink: 0;\n`;\n","import styled, { css } from \"styled-components\";\n\nimport { colors } from \"../../tokens/colors\";\nimport { KEYBOARD_SHORTCUT_VARIANTS } from \"./types\";\nimport type { KeyboardShortcutVariant } from \"./types\";\n\n// Fixed-color treatments (default) — tuned for dark surfaces / app chrome.\nconst variantStyles: Record<KeyboardShortcutVariant, ReturnType<typeof css>> = {\n [KEYBOARD_SHORTCUT_VARIANTS.OUTLINED]: css`\n border: 1px solid ${colors[\"white-alpha-40\"]};\n color: ${colors[\"brown-10\"]};\n `,\n [KEYBOARD_SHORTCUT_VARIANTS.FILLED]: css`\n background: ${colors[\"brown-80\"]};\n color: ${colors[\"brown-10\"]};\n `,\n};\n\n// `adaptive` treatments — border/fill + glyph follow the surrounding text color (currentColor) so\n// the chip reads on any surface (light or dark). Selected when the `adaptive` prop is set.\nconst adaptiveStyles: Record<KeyboardShortcutVariant, ReturnType<typeof css>> = {\n [KEYBOARD_SHORTCUT_VARIANTS.OUTLINED]: css`\n border: 1px solid color-mix(in oklch, currentColor 40%, transparent);\n color: currentColor;\n `,\n [KEYBOARD_SHORTCUT_VARIANTS.FILLED]: css`\n background: color-mix(in oklch, currentColor 12%, transparent);\n color: currentColor;\n `,\n};\n\nexport const Wrapper = styled.div`\n display: inline-flex;\n align-items: center;\n gap: 2px;\n`;\n\nexport const Key = styled.kbd<{ $variant: KeyboardShortcutVariant; $adaptive: boolean }>`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 2px;\n border-radius: 6px;\n ${({ $variant, $adaptive }) => ($adaptive ? adaptiveStyles : variantStyles)[$variant]};\n`;\n","export const colors = {\n // White\n white: \"#FFFFFF\",\n \"white-alpha-85\": \"rgba(255, 255, 255, 0.85)\",\n \"white-alpha-40\": \"rgba(255, 255, 255, 0.40)\",\n\n // Brown\n \"brown-10\": \"#FAF9F8\",\n \"brown-20\": \"#F5F3F0\",\n \"brown-30\": \"#EEEBE5\",\n \"brown-40\": \"#E6E2DA\",\n \"brown-50\": \"#CFCBC4\",\n \"brown-60\": \"#A19E99\",\n \"brown-70\": \"#73716D\",\n \"brown-80\": \"#5C5A57\",\n \"brown-90\": \"#2E2D2C\",\n \"brown-100\": \"#171716\",\n \"brown-alpha-12\": \"rgba(23, 23, 22, 0.12)\",\n \"brown-alpha-20\": \"rgba(23, 23, 22, 0.20)\",\n \"brown-alpha-55\": \"rgba(23, 23, 22, 0.55)\",\n \"brown-alpha-70\": \"rgba(23, 23, 22, 0.70)\",\n \"brown-alpha-80\": \"rgba(23, 23, 22, 0.80)\",\n \"brown-alpha-90\": \"rgba(23, 23, 22, 0.90)\",\n\n // Fuchsia\n \"fuchsia-50\": \"#FAF5FF\",\n \"fuchsia-300\": \"#F0ABFC\",\n \"fuchsia-500\": \"#D946EF\",\n \"fuchsia-600\": \"#C026D3\",\n \"fuchsia-800\": \"#86198F\",\n\n // Pink\n \"pink-50\": \"#FDF2F8\",\n \"pink-400\": \"#F472B6\",\n \"pink-600\": \"#DB2777\",\n \"pink-800\": \"#9D174D\",\n\n // Violet\n \"violet-50\": \"#F5F3FF\",\n \"violet-400\": \"#A78BFA\",\n \"violet-600\": \"#7C3AED\",\n \"violet-800\": \"#5B21B6\",\n\n // Indigo\n \"indigo-50\": \"#EEF2FF\",\n \"indigo-400\": \"#818CF8\",\n \"indigo-500\": \"#6366F1\",\n \"indigo-600\": \"#4F46E5\",\n \"indigo-800\": \"#3730A3\",\n\n // Cyan\n \"cyan-50\": \"#E7FEFF\",\n \"cyan-300\": \"#67E8F9\",\n \"cyan-600\": \"#0891B2\",\n \"cyan-900\": \"#164E63\",\n\n // Teal\n \"teal-50\": \"#EBFDF9\",\n \"teal-300\": \"#5EEAD4\",\n \"teal-600\": \"#0D9488\",\n\n // Rose\n \"rose-400\": \"#FB7185\",\n\n // Purple\n \"purple-400\": \"#C084FC\",\n\n // Blue\n \"blue-50\": \"#EFF6FF\",\n \"blue-100\": \"#DBEAFE\",\n \"blue-300\": \"#93C5FD\",\n \"blue-400\": \"#60A5FA\",\n \"blue-600\": \"#2563EB\",\n \"blue-800\": \"#1E40AF\",\n\n // Sky\n \"sky-300\": \"#7DD3FC\",\n\n // Green\n \"green-50\": \"#ECF9F0\",\n \"green-100\": \"#D4F1D9\",\n \"green-400\": \"#3DC269\",\n \"green-700\": \"#277C43\",\n \"green-800\": \"#1C5930\",\n\n // Orange\n \"orange-50\": \"#FFF7ED\",\n \"orange-100\": \"#FFEDD5\",\n \"orange-200\": \"#FED7AA\",\n \"orange-500\": \"#F97316\",\n \"orange-600\": \"#EA580C\",\n\n // Red\n \"red-50\": \"#FEF2F2\",\n \"red-100\": \"#FEE2E2\",\n \"red-200\": \"#FECACA\",\n \"red-400\": \"#F7776C\",\n \"red-500\": \"#EF4444\",\n \"red-600\": \"#DC2626\",\n} as const;\n\nexport type ColorToken = keyof typeof colors;\n","import type { ComponentType, SVGProps } from \"react\";\n\n/** An SVG icon component representing a single keyboard key (e.g., Cmd, Shift, a letter). */\nexport type KeyIcon = ComponentType<SVGProps<SVGSVGElement>>;\n\n/** Available visual variants for the keyboard shortcut display. */\nexport const KEYBOARD_SHORTCUT_VARIANTS = {\n /** Outlined keys with a subtle border + light glyph — for dark surfaces / app chrome. Default. */\n OUTLINED: \"outlined\",\n /** Filled keys with a solid background — for emphasis. */\n FILLED: \"filled\",\n} as const;\n\n/** Visual variant for the KeyboardShortcut component. */\nexport type KeyboardShortcutVariant = (typeof KEYBOARD_SHORTCUT_VARIANTS)[keyof typeof KEYBOARD_SHORTCUT_VARIANTS];\n\n/** Props for the KeyboardShortcut display component. */\nexport interface KeyboardShortcutProps {\n /** Ordered array of key icon components representing the shortcut (e.g., `[IconCommand, IconLetterK]` for ⌘K). */\n keys: KeyIcon[];\n /** Visual style variant. @default \"outlined\" */\n variant?: KeyboardShortcutVariant;\n /**\n * When true, the border + glyph (outlined) or fill + glyph (filled) follow the surrounding text\n * color (`currentColor`) instead of fixed tokens, so the chip reads on any surface — light or\n * dark. Use on surfaces where the fixed-color variants wouldn't read (e.g. a prompt-launcher hero\n * on a light backdrop). @default false\n */\n adaptive?: boolean;\n /** Additional CSS class name. */\n className?: string;\n}\n","import type { ReactElement } from \"react\";\n\nimport { Icon } from \"../icon/icon\";\nimport { Key, Wrapper } from \"./keyboard-shortcut-styles\";\nimport { KEYBOARD_SHORTCUT_VARIANTS } from \"./types\";\nimport type { KeyboardShortcutProps } from \"./types\";\n\nexport function KeyboardShortcut({\n keys,\n variant = KEYBOARD_SHORTCUT_VARIANTS.OUTLINED,\n adaptive = false,\n className,\n}: KeyboardShortcutProps): ReactElement {\n return (\n <Wrapper className={className}>\n {keys.map((KeyComponent, index) => (\n <Key key={index} $variant={variant} $adaptive={adaptive}>\n <Icon icon={KeyComponent} size={12} />\n </Key>\n ))}\n </Wrapper>\n );\n}\n","import type { ReactElement, SVGProps } from \"react\";\n\nexport function IconCtrl(props: SVGProps<SVGSVGElement>): ReactElement {\n const { width = 24, height = 24, ...rest } = props;\n\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" width={width} height={height} fill=\"none\" {...rest}>\n <text\n x=\"50%\"\n y=\"50%\"\n dominantBaseline=\"central\"\n textAnchor=\"middle\"\n fill=\"currentColor\"\n fontFamily=\"Geist, sans-serif\"\n fontWeight={300}\n fontSize={14}\n >\n Ctrl\n </text>\n </svg>\n );\n}\n"],"mappings":"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","names":["styled","Icon","import_styled_components","styled","import_jsx_runtime","import_jsx_runtime"]}
|
|
@@ -4,9 +4,9 @@ import { ComponentType, SVGProps, ReactElement } from 'react';
|
|
|
4
4
|
type KeyIcon = ComponentType<SVGProps<SVGSVGElement>>;
|
|
5
5
|
/** Available visual variants for the keyboard shortcut display. */
|
|
6
6
|
declare const KEYBOARD_SHORTCUT_VARIANTS: {
|
|
7
|
-
/** Outlined keys with a subtle border —
|
|
7
|
+
/** Outlined keys with a subtle border + light glyph — for dark surfaces / app chrome. Default. */
|
|
8
8
|
readonly OUTLINED: "outlined";
|
|
9
|
-
/** Filled keys with a solid background —
|
|
9
|
+
/** Filled keys with a solid background — for emphasis. */
|
|
10
10
|
readonly FILLED: "filled";
|
|
11
11
|
};
|
|
12
12
|
/** Visual variant for the KeyboardShortcut component. */
|
|
@@ -17,11 +17,18 @@ interface KeyboardShortcutProps {
|
|
|
17
17
|
keys: KeyIcon[];
|
|
18
18
|
/** Visual style variant. @default "outlined" */
|
|
19
19
|
variant?: KeyboardShortcutVariant;
|
|
20
|
+
/**
|
|
21
|
+
* When true, the border + glyph (outlined) or fill + glyph (filled) follow the surrounding text
|
|
22
|
+
* color (`currentColor`) instead of fixed tokens, so the chip reads on any surface — light or
|
|
23
|
+
* dark. Use on surfaces where the fixed-color variants wouldn't read (e.g. a prompt-launcher hero
|
|
24
|
+
* on a light backdrop). @default false
|
|
25
|
+
*/
|
|
26
|
+
adaptive?: boolean;
|
|
20
27
|
/** Additional CSS class name. */
|
|
21
28
|
className?: string;
|
|
22
29
|
}
|
|
23
30
|
|
|
24
|
-
declare function KeyboardShortcut({ keys, variant, className, }: KeyboardShortcutProps): ReactElement;
|
|
31
|
+
declare function KeyboardShortcut({ keys, variant, adaptive, className, }: KeyboardShortcutProps): ReactElement;
|
|
25
32
|
|
|
26
33
|
declare function IconCtrl(props: SVGProps<SVGSVGElement>): ReactElement;
|
|
27
34
|
|
|
@@ -4,9 +4,9 @@ import { ComponentType, SVGProps, ReactElement } from 'react';
|
|
|
4
4
|
type KeyIcon = ComponentType<SVGProps<SVGSVGElement>>;
|
|
5
5
|
/** Available visual variants for the keyboard shortcut display. */
|
|
6
6
|
declare const KEYBOARD_SHORTCUT_VARIANTS: {
|
|
7
|
-
/** Outlined keys with a subtle border —
|
|
7
|
+
/** Outlined keys with a subtle border + light glyph — for dark surfaces / app chrome. Default. */
|
|
8
8
|
readonly OUTLINED: "outlined";
|
|
9
|
-
/** Filled keys with a solid background —
|
|
9
|
+
/** Filled keys with a solid background — for emphasis. */
|
|
10
10
|
readonly FILLED: "filled";
|
|
11
11
|
};
|
|
12
12
|
/** Visual variant for the KeyboardShortcut component. */
|
|
@@ -17,11 +17,18 @@ interface KeyboardShortcutProps {
|
|
|
17
17
|
keys: KeyIcon[];
|
|
18
18
|
/** Visual style variant. @default "outlined" */
|
|
19
19
|
variant?: KeyboardShortcutVariant;
|
|
20
|
+
/**
|
|
21
|
+
* When true, the border + glyph (outlined) or fill + glyph (filled) follow the surrounding text
|
|
22
|
+
* color (`currentColor`) instead of fixed tokens, so the chip reads on any surface — light or
|
|
23
|
+
* dark. Use on surfaces where the fixed-color variants wouldn't read (e.g. a prompt-launcher hero
|
|
24
|
+
* on a light backdrop). @default false
|
|
25
|
+
*/
|
|
26
|
+
adaptive?: boolean;
|
|
20
27
|
/** Additional CSS class name. */
|
|
21
28
|
className?: string;
|
|
22
29
|
}
|
|
23
30
|
|
|
24
|
-
declare function KeyboardShortcut({ keys, variant, className, }: KeyboardShortcutProps): ReactElement;
|
|
31
|
+
declare function KeyboardShortcut({ keys, variant, adaptive, className, }: KeyboardShortcutProps): ReactElement;
|
|
25
32
|
|
|
26
33
|
declare function IconCtrl(props: SVGProps<SVGSVGElement>): ReactElement;
|
|
27
34
|
|
package/dist/text-area.cjs
CHANGED
|
@@ -145,7 +145,7 @@ var colors = {
|
|
|
145
145
|
var fontFamilies = {
|
|
146
146
|
/** Geist — primary UI font for body text, labels, headings, and display. */
|
|
147
147
|
GEIST: "Geist",
|
|
148
|
-
/** Crimson Pro — editorial/serif font,
|
|
148
|
+
/** Crimson Pro — editorial/serif font, mostly italic. Used for decorative headings and pull quotes. */
|
|
149
149
|
CRIMSON_PRO: "Crimson Pro"
|
|
150
150
|
};
|
|
151
151
|
var typographyTypes = {
|
|
@@ -185,14 +185,16 @@ var typographyTypes = {
|
|
|
185
185
|
GEIST_HEADING_L_BOLD: "GEIST_HEADING_L_BOLD",
|
|
186
186
|
// Geist Display Large (36px)
|
|
187
187
|
GEIST_DISPLAY_L_MEDIUM: "GEIST_DISPLAY_L_MEDIUM",
|
|
188
|
-
// Crimson Pro Body Small (16px)
|
|
189
|
-
|
|
190
|
-
// Crimson Pro Body Medium (18px)
|
|
191
|
-
|
|
192
|
-
// Crimson Pro Heading Medium (24px)
|
|
193
|
-
|
|
194
|
-
// Crimson Pro Display
|
|
195
|
-
|
|
188
|
+
// Crimson Pro Body Small (16px, italic)
|
|
189
|
+
CRIMSON_PRO_BODY_S_LIGHT_ITALIC: "CRIMSON_PRO_BODY_S_LIGHT_ITALIC",
|
|
190
|
+
// Crimson Pro Body Medium (18px, italic)
|
|
191
|
+
CRIMSON_PRO_BODY_M_LIGHT_ITALIC: "CRIMSON_PRO_BODY_M_LIGHT_ITALIC",
|
|
192
|
+
// Crimson Pro Heading Medium (24px, italic)
|
|
193
|
+
CRIMSON_PRO_HEADING_M_MEDIUM_ITALIC: "CRIMSON_PRO_HEADING_M_MEDIUM_ITALIC",
|
|
194
|
+
// Crimson Pro Display Large (40px, upright)
|
|
195
|
+
CRIMSON_PRO_DISPLAY_L_REGULAR: "CRIMSON_PRO_DISPLAY_L_REGULAR",
|
|
196
|
+
// Crimson Pro Display Extra Large (46px, italic)
|
|
197
|
+
CRIMSON_PRO_DISPLAY_XL_REGULAR_ITALIC: "CRIMSON_PRO_DISPLAY_XL_REGULAR_ITALIC"
|
|
196
198
|
};
|
|
197
199
|
var typographyStyles = {
|
|
198
200
|
// Geist Label Caption (12px)
|
|
@@ -387,8 +389,8 @@ var typographyStyles = {
|
|
|
387
389
|
lineHeight: 44,
|
|
388
390
|
letterSpacing: -0.72
|
|
389
391
|
},
|
|
390
|
-
// Crimson Pro Body Small (16px)
|
|
391
|
-
[typographyTypes.
|
|
392
|
+
// Crimson Pro Body Small (16px, italic)
|
|
393
|
+
[typographyTypes.CRIMSON_PRO_BODY_S_LIGHT_ITALIC]: {
|
|
392
394
|
fontFamily: fontFamilies.CRIMSON_PRO,
|
|
393
395
|
fontSize: 16,
|
|
394
396
|
fontWeight: 300,
|
|
@@ -396,8 +398,8 @@ var typographyStyles = {
|
|
|
396
398
|
letterSpacing: -0.32,
|
|
397
399
|
fontStyle: "italic"
|
|
398
400
|
},
|
|
399
|
-
// Crimson Pro Body Medium (18px)
|
|
400
|
-
[typographyTypes.
|
|
401
|
+
// Crimson Pro Body Medium (18px, italic)
|
|
402
|
+
[typographyTypes.CRIMSON_PRO_BODY_M_LIGHT_ITALIC]: {
|
|
401
403
|
fontFamily: fontFamilies.CRIMSON_PRO,
|
|
402
404
|
fontSize: 18,
|
|
403
405
|
fontWeight: 300,
|
|
@@ -405,8 +407,8 @@ var typographyStyles = {
|
|
|
405
407
|
letterSpacing: 0,
|
|
406
408
|
fontStyle: "italic"
|
|
407
409
|
},
|
|
408
|
-
// Crimson Pro Heading Medium (24px)
|
|
409
|
-
[typographyTypes.
|
|
410
|
+
// Crimson Pro Heading Medium (24px, italic)
|
|
411
|
+
[typographyTypes.CRIMSON_PRO_HEADING_M_MEDIUM_ITALIC]: {
|
|
410
412
|
fontFamily: fontFamilies.CRIMSON_PRO,
|
|
411
413
|
fontSize: 24,
|
|
412
414
|
fontWeight: 400,
|
|
@@ -414,8 +416,16 @@ var typographyStyles = {
|
|
|
414
416
|
letterSpacing: -0.48,
|
|
415
417
|
fontStyle: "italic"
|
|
416
418
|
},
|
|
417
|
-
// Crimson Pro Display
|
|
418
|
-
[typographyTypes.
|
|
419
|
+
// Crimson Pro Display Large (40px, upright)
|
|
420
|
+
[typographyTypes.CRIMSON_PRO_DISPLAY_L_REGULAR]: {
|
|
421
|
+
fontFamily: fontFamilies.CRIMSON_PRO,
|
|
422
|
+
fontSize: 40,
|
|
423
|
+
fontWeight: 300,
|
|
424
|
+
lineHeight: 48,
|
|
425
|
+
letterSpacing: -1.6
|
|
426
|
+
},
|
|
427
|
+
// Crimson Pro Display Extra Large (46px, italic)
|
|
428
|
+
[typographyTypes.CRIMSON_PRO_DISPLAY_XL_REGULAR_ITALIC]: {
|
|
419
429
|
fontFamily: fontFamilies.CRIMSON_PRO,
|
|
420
430
|
fontSize: 46,
|
|
421
431
|
fontWeight: 400,
|
package/dist/text-area.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/text-area/index.ts","../src/components/text-area/text-area.tsx","../src/utils/merge-refs.ts","../src/components/text-area/text-area-styles.ts","../src/tokens/colors.ts","../src/tokens/typography.ts"],"sourcesContent":["export { TextArea } from \"./text-area\";\nexport type { TextAreaProps } from \"./types\";\n","import { forwardRef, useCallback, useLayoutEffect, useRef, type ChangeEvent } from \"react\";\n\nimport { mergeRefs } from \"@/utils/merge-refs\";\nimport { StyledTextArea } from \"./text-area-styles\";\nimport type { TextAreaProps } from \"./types\";\n\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(function TextArea(\n { value, onChange, placeholder, maxHeight, rows = 1, autoFocus, onKeyDown, disabled, className },\n externalRef\n) {\n const internalRef = useRef<HTMLTextAreaElement>(null);\n\n // Auto-resize: recalculates height whenever value changes so the textarea\n // grows/shrinks to fit its content (also restores correct height when the\n // component re-mounts or becomes visible again after being hidden).\n useLayoutEffect(() => {\n const el = internalRef.current;\n if (el) {\n el.style.height = \"auto\";\n el.style.height = `${el.scrollHeight}px`;\n }\n }, [value]);\n\n const handleChange = useCallback(\n (e: ChangeEvent<HTMLTextAreaElement>) => {\n onChange(e.target.value);\n },\n [onChange]\n );\n\n return (\n <StyledTextArea\n ref={mergeRefs(internalRef, externalRef)}\n value={value}\n onChange={handleChange}\n placeholder={placeholder}\n $maxHeight={maxHeight}\n rows={rows}\n autoFocus={autoFocus}\n onKeyDown={onKeyDown}\n disabled={disabled}\n className={className}\n />\n );\n});\n","import type { Ref } from \"react\";\n\n/**\n * Combines multiple React refs into a single callback ref.\n * Useful when a component needs to forward its ref while also keeping a local ref.\n *\n * @param refs - Any number of React refs (callback refs, RefObjects, or `undefined`).\n * @returns A callback ref that updates all provided refs when the DOM node changes.\n */\nexport function mergeRefs<T>(...refs: (Ref<T> | undefined)[]): (node: T | null) => void {\n return (node) => {\n for (const ref of refs) {\n if (typeof ref === \"function\") {\n ref(node);\n } else if (ref) {\n (ref as React.MutableRefObject<T | null>).current = node;\n }\n }\n };\n}\n","import styled from \"styled-components\";\n\nimport { colors } from \"../../tokens/colors\";\nimport { typographyMixin, typographyTypes } from \"../../tokens/typography\";\n\nexport const StyledTextArea = styled.textarea<{ $maxHeight?: number }>`\n ${typographyMixin(typographyTypes.GEIST_BODY_S_REGULAR)};\n color: ${colors[\"brown-100\"]};\n border: none;\n outline: none;\n resize: none;\n width: 100%;\n background: transparent;\n vertical-align: bottom;\n max-height: ${({ $maxHeight }) => ($maxHeight ? `${$maxHeight}px` : \"none\")};\n overflow-y: ${({ $maxHeight }) => ($maxHeight ? \"auto\" : \"hidden\")};\n\n &::placeholder {\n color: ${colors[\"brown-50\"]};\n }\n\n &:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n`;\n","export const colors = {\n // White\n white: \"#FFFFFF\",\n \"white-alpha-85\": \"rgba(255, 255, 255, 0.85)\",\n \"white-alpha-40\": \"rgba(255, 255, 255, 0.40)\",\n\n // Brown\n \"brown-10\": \"#FAF9F8\",\n \"brown-20\": \"#F5F3F0\",\n \"brown-30\": \"#EEEBE5\",\n \"brown-40\": \"#E6E2DA\",\n \"brown-50\": \"#CFCBC4\",\n \"brown-60\": \"#A19E99\",\n \"brown-70\": \"#73716D\",\n \"brown-80\": \"#5C5A57\",\n \"brown-90\": \"#2E2D2C\",\n \"brown-100\": \"#171716\",\n \"brown-alpha-12\": \"rgba(23, 23, 22, 0.12)\",\n \"brown-alpha-20\": \"rgba(23, 23, 22, 0.20)\",\n \"brown-alpha-55\": \"rgba(23, 23, 22, 0.55)\",\n \"brown-alpha-70\": \"rgba(23, 23, 22, 0.70)\",\n \"brown-alpha-80\": \"rgba(23, 23, 22, 0.80)\",\n \"brown-alpha-90\": \"rgba(23, 23, 22, 0.90)\",\n\n // Fuchsia\n \"fuchsia-50\": \"#FAF5FF\",\n \"fuchsia-300\": \"#F0ABFC\",\n \"fuchsia-500\": \"#D946EF\",\n \"fuchsia-600\": \"#C026D3\",\n \"fuchsia-800\": \"#86198F\",\n\n // Pink\n \"pink-50\": \"#FDF2F8\",\n \"pink-400\": \"#F472B6\",\n \"pink-600\": \"#DB2777\",\n \"pink-800\": \"#9D174D\",\n\n // Violet\n \"violet-50\": \"#F5F3FF\",\n \"violet-400\": \"#A78BFA\",\n \"violet-600\": \"#7C3AED\",\n \"violet-800\": \"#5B21B6\",\n\n // Indigo\n \"indigo-50\": \"#EEF2FF\",\n \"indigo-400\": \"#818CF8\",\n \"indigo-500\": \"#6366F1\",\n \"indigo-600\": \"#4F46E5\",\n \"indigo-800\": \"#3730A3\",\n\n // Cyan\n \"cyan-50\": \"#E7FEFF\",\n \"cyan-300\": \"#67E8F9\",\n \"cyan-600\": \"#0891B2\",\n \"cyan-900\": \"#164E63\",\n\n // Teal\n \"teal-50\": \"#EBFDF9\",\n \"teal-300\": \"#5EEAD4\",\n \"teal-600\": \"#0D9488\",\n\n // Rose\n \"rose-400\": \"#FB7185\",\n\n // Purple\n \"purple-400\": \"#C084FC\",\n\n // Blue\n \"blue-50\": \"#EFF6FF\",\n \"blue-100\": \"#DBEAFE\",\n \"blue-300\": \"#93C5FD\",\n \"blue-400\": \"#60A5FA\",\n \"blue-600\": \"#2563EB\",\n \"blue-800\": \"#1E40AF\",\n\n // Sky\n \"sky-300\": \"#7DD3FC\",\n\n // Green\n \"green-50\": \"#ECF9F0\",\n \"green-100\": \"#D4F1D9\",\n \"green-400\": \"#3DC269\",\n \"green-700\": \"#277C43\",\n \"green-800\": \"#1C5930\",\n\n // Orange\n \"orange-50\": \"#FFF7ED\",\n \"orange-100\": \"#FFEDD5\",\n \"orange-200\": \"#FED7AA\",\n \"orange-500\": \"#F97316\",\n \"orange-600\": \"#EA580C\",\n\n // Red\n \"red-50\": \"#FEF2F2\",\n \"red-100\": \"#FEE2E2\",\n \"red-200\": \"#FECACA\",\n \"red-400\": \"#F7776C\",\n \"red-500\": \"#EF4444\",\n \"red-600\": \"#DC2626\",\n} as const;\n\nexport type ColorToken = keyof typeof colors;\n","/** Available font families in the Shapes.co design system. */\nexport const fontFamilies = {\n /** Geist — primary UI font for body text, labels, headings, and display. */\n GEIST: \"Geist\",\n /** Crimson Pro — editorial/serif font, always italic. Used for decorative headings and pull quotes. */\n CRIMSON_PRO: \"Crimson Pro\",\n} as const;\n\nexport const typographyTypes = {\n // Geist Label Caption (12px)\n GEIST_LABEL_CAPTION_REGULAR: \"GEIST_LABEL_CAPTION_REGULAR\",\n GEIST_LABEL_CAPTION_MEDIUM: \"GEIST_LABEL_CAPTION_MEDIUM\",\n GEIST_LABEL_CAPTION_SEMI_BOLD: \"GEIST_LABEL_CAPTION_SEMI_BOLD\",\n\n // Geist Body Extra Small (14px)\n GEIST_BODY_XS_REGULAR: \"GEIST_BODY_XS_REGULAR\",\n GEIST_BODY_XS_MEDIUM: \"GEIST_BODY_XS_MEDIUM\",\n GEIST_BODY_XS_BOLD: \"GEIST_BODY_XS_BOLD\",\n\n // Geist Body Small (16px)\n GEIST_BODY_S_REGULAR: \"GEIST_BODY_S_REGULAR\",\n GEIST_BODY_S_MEDIUM: \"GEIST_BODY_S_MEDIUM\",\n GEIST_BODY_S_SEMI_BOLD: \"GEIST_BODY_S_SEMI_BOLD\",\n GEIST_BODY_S_BOLD: \"GEIST_BODY_S_BOLD\",\n\n // Geist Body Medium (18px)\n GEIST_BODY_M_LIGHT: \"GEIST_BODY_M_LIGHT\",\n GEIST_BODY_M_REGULAR: \"GEIST_BODY_M_REGULAR\",\n GEIST_BODY_M_MEDIUM: \"GEIST_BODY_M_MEDIUM\",\n GEIST_BODY_M_SEMI_BOLD: \"GEIST_BODY_M_SEMI_BOLD\",\n\n // Geist Body Large (20px)\n GEIST_BODY_L_REGULAR: \"GEIST_BODY_L_REGULAR\",\n GEIST_BODY_L_MEDIUM: \"GEIST_BODY_L_MEDIUM\",\n GEIST_BODY_L_SEMI_BOLD: \"GEIST_BODY_L_SEMI_BOLD\",\n GEIST_BODY_L_BOLD: \"GEIST_BODY_L_BOLD\",\n\n // Geist Heading Small (24px)\n GEIST_HEADING_S_REGULAR: \"GEIST_HEADING_S_REGULAR\",\n GEIST_HEADING_S_MEDIUM: \"GEIST_HEADING_S_MEDIUM\",\n GEIST_HEADING_S_BOLD: \"GEIST_HEADING_S_BOLD\",\n\n // Geist Heading Medium (28px)\n GEIST_HEADING_M_BOLD: \"GEIST_HEADING_M_BOLD\",\n\n // Geist Heading Large (32px)\n GEIST_HEADING_L_REGULAR: \"GEIST_HEADING_L_REGULAR\",\n GEIST_HEADING_L_MEDIUM: \"GEIST_HEADING_L_MEDIUM\",\n GEIST_HEADING_L_SEMI_BOLD: \"GEIST_HEADING_L_SEMI_BOLD\",\n GEIST_HEADING_L_BOLD: \"GEIST_HEADING_L_BOLD\",\n\n // Geist Display Large (36px)\n GEIST_DISPLAY_L_MEDIUM: \"GEIST_DISPLAY_L_MEDIUM\",\n\n // Crimson Pro Body Small (16px)\n CRIMSON_PRO_BODY_S_LIGHT: \"CRIMSON_PRO_BODY_S_LIGHT\",\n\n // Crimson Pro Body Medium (18px)\n CRIMSON_PRO_BODY_M_LIGHT: \"CRIMSON_PRO_BODY_M_LIGHT\",\n\n // Crimson Pro Heading Medium (24px)\n CRIMSON_PRO_HEADING_M_MEDIUM: \"CRIMSON_PRO_HEADING_M_MEDIUM\",\n\n // Crimson Pro Display Extra Large (46px)\n CRIMSON_PRO_DISPLAY_XL_REGULAR: \"CRIMSON_PRO_DISPLAY_XL_REGULAR\",\n} as const;\n\n/** Union of all typography type string constants. Used as keys into `typographyStyles`. */\nexport type TypographyType = (typeof typographyTypes)[keyof typeof typographyTypes];\n\n/** CSS properties for a single typography type. All numeric values are in pixels. */\nexport interface TypographyStyle {\n /** Font family name (e.g., \"Geist\"). */\n fontFamily: string;\n /** Font size in pixels. */\n fontSize: number;\n /** Font weight (100–900). */\n fontWeight: number;\n /** Line height in pixels. */\n lineHeight: number;\n /** Letter spacing in pixels. Omitted when the font's default spacing is correct. */\n letterSpacing?: number;\n /** CSS font-style value (e.g., \"italic\"). Omitted for normal style. */\n fontStyle?: string;\n}\n\nexport const typographyStyles: Record<TypographyType, TypographyStyle> = {\n // Geist Label Caption (12px)\n [typographyTypes.GEIST_LABEL_CAPTION_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 12,\n fontWeight: 400,\n lineHeight: 16,\n },\n [typographyTypes.GEIST_LABEL_CAPTION_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 12,\n fontWeight: 500,\n lineHeight: 16,\n },\n [typographyTypes.GEIST_LABEL_CAPTION_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 12,\n fontWeight: 600,\n lineHeight: 16,\n },\n\n // Geist Body Extra Small (14px)\n [typographyTypes.GEIST_BODY_XS_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 14,\n fontWeight: 400,\n lineHeight: 20,\n },\n [typographyTypes.GEIST_BODY_XS_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 14,\n fontWeight: 500,\n lineHeight: 20,\n },\n [typographyTypes.GEIST_BODY_XS_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 14,\n fontWeight: 600,\n lineHeight: 20,\n },\n\n // Geist Body Small (16px)\n [typographyTypes.GEIST_BODY_S_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 16,\n fontWeight: 400,\n lineHeight: 24,\n letterSpacing: -0.08,\n },\n [typographyTypes.GEIST_BODY_S_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 16,\n fontWeight: 500,\n lineHeight: 24,\n letterSpacing: -0.08,\n },\n [typographyTypes.GEIST_BODY_S_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 16,\n fontWeight: 600,\n lineHeight: 24,\n letterSpacing: -0.08,\n },\n [typographyTypes.GEIST_BODY_S_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 16,\n fontWeight: 700,\n lineHeight: 24,\n letterSpacing: -0.08,\n },\n\n // Geist Body Medium (18px)\n [typographyTypes.GEIST_BODY_M_LIGHT]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 18,\n fontWeight: 300,\n lineHeight: 28,\n letterSpacing: -0.09,\n },\n [typographyTypes.GEIST_BODY_M_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 18,\n fontWeight: 400,\n lineHeight: 28,\n letterSpacing: -0.09,\n },\n [typographyTypes.GEIST_BODY_M_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 18,\n fontWeight: 500,\n lineHeight: 28,\n letterSpacing: -0.09,\n },\n [typographyTypes.GEIST_BODY_M_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 18,\n fontWeight: 600,\n lineHeight: 28,\n letterSpacing: -0.09,\n },\n\n // Geist Body Large (20px)\n [typographyTypes.GEIST_BODY_L_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 20,\n fontWeight: 400,\n lineHeight: 30,\n letterSpacing: -0.2,\n },\n [typographyTypes.GEIST_BODY_L_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 20,\n fontWeight: 500,\n lineHeight: 30,\n letterSpacing: -0.2,\n },\n [typographyTypes.GEIST_BODY_L_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 20,\n fontWeight: 600,\n lineHeight: 30,\n letterSpacing: -0.2,\n },\n [typographyTypes.GEIST_BODY_L_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 20,\n fontWeight: 700,\n lineHeight: 30,\n letterSpacing: -0.2,\n },\n\n // Geist Heading Small (24px)\n [typographyTypes.GEIST_HEADING_S_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 24,\n fontWeight: 400,\n lineHeight: 32,\n letterSpacing: -0.48,\n },\n [typographyTypes.GEIST_HEADING_S_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 24,\n fontWeight: 500,\n lineHeight: 32,\n letterSpacing: -0.48,\n },\n [typographyTypes.GEIST_HEADING_S_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 24,\n fontWeight: 700,\n lineHeight: 32,\n letterSpacing: -0.48,\n },\n\n // Geist Heading Medium (28px)\n [typographyTypes.GEIST_HEADING_M_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 28,\n fontWeight: 700,\n lineHeight: 36,\n letterSpacing: -0.6,\n },\n\n // Geist Heading Large (32px)\n [typographyTypes.GEIST_HEADING_L_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 32,\n fontWeight: 400,\n lineHeight: 40,\n letterSpacing: -0.64,\n },\n [typographyTypes.GEIST_HEADING_L_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 32,\n fontWeight: 500,\n lineHeight: 40,\n letterSpacing: -0.64,\n },\n [typographyTypes.GEIST_HEADING_L_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 32,\n fontWeight: 600,\n lineHeight: 40,\n letterSpacing: -0.64,\n },\n [typographyTypes.GEIST_HEADING_L_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 32,\n fontWeight: 700,\n lineHeight: 40,\n letterSpacing: -0.64,\n },\n\n // Geist Display Large (36px)\n [typographyTypes.GEIST_DISPLAY_L_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 36,\n fontWeight: 500,\n lineHeight: 44,\n letterSpacing: -0.72,\n },\n\n // Crimson Pro Body Small (16px)\n [typographyTypes.CRIMSON_PRO_BODY_S_LIGHT]: {\n fontFamily: fontFamilies.CRIMSON_PRO,\n fontSize: 16,\n fontWeight: 300,\n lineHeight: 20,\n letterSpacing: -0.32,\n fontStyle: \"italic\",\n },\n\n // Crimson Pro Body Medium (18px)\n [typographyTypes.CRIMSON_PRO_BODY_M_LIGHT]: {\n fontFamily: fontFamilies.CRIMSON_PRO,\n fontSize: 18,\n fontWeight: 300,\n lineHeight: 28,\n letterSpacing: 0,\n fontStyle: \"italic\",\n },\n\n // Crimson Pro Heading Medium (24px)\n [typographyTypes.CRIMSON_PRO_HEADING_M_MEDIUM]: {\n fontFamily: fontFamilies.CRIMSON_PRO,\n fontSize: 24,\n fontWeight: 400,\n lineHeight: 32,\n letterSpacing: -0.48,\n fontStyle: \"italic\",\n },\n\n // Crimson Pro Display Extra Large (46px)\n [typographyTypes.CRIMSON_PRO_DISPLAY_XL_REGULAR]: {\n fontFamily: fontFamilies.CRIMSON_PRO,\n fontSize: 46,\n fontWeight: 400,\n lineHeight: 54,\n letterSpacing: -1.38,\n fontStyle: \"italic\",\n },\n};\n\n/**\n * Generates a CSS string for a given typography type, suitable for use in styled-components template literals.\n * @param type - The typography type constant (e.g., `typographyTypes.GEIST_BODY_S_REGULAR`).\n * @returns A semicolon-separated CSS string with font-family, font-size, font-weight, line-height, letter-spacing, and font-style.\n */\nexport function typographyMixin(type: TypographyType): string {\n const style = typographyStyles[type];\n return [\n `font-family: \"${style.fontFamily}\", sans-serif`,\n `font-size: ${style.fontSize}px`,\n `font-weight: ${style.fontWeight}`,\n `line-height: ${style.lineHeight}px`,\n `letter-spacing: ${style.letterSpacing != null ? `${style.letterSpacing}px` : \"inherit\"}`,\n `font-style: ${style.fontStyle ?? \"normal\"}`,\n ].join(\";\\n \");\n}\n"],"mappings":"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","names":["styled","TextArea"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/text-area/index.ts","../src/components/text-area/text-area.tsx","../src/utils/merge-refs.ts","../src/components/text-area/text-area-styles.ts","../src/tokens/colors.ts","../src/tokens/typography.ts"],"sourcesContent":["export { TextArea } from \"./text-area\";\nexport type { TextAreaProps } from \"./types\";\n","import { forwardRef, useCallback, useLayoutEffect, useRef, type ChangeEvent } from \"react\";\n\nimport { mergeRefs } from \"@/utils/merge-refs\";\nimport { StyledTextArea } from \"./text-area-styles\";\nimport type { TextAreaProps } from \"./types\";\n\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(function TextArea(\n { value, onChange, placeholder, maxHeight, rows = 1, autoFocus, onKeyDown, disabled, className },\n externalRef\n) {\n const internalRef = useRef<HTMLTextAreaElement>(null);\n\n // Auto-resize: recalculates height whenever value changes so the textarea\n // grows/shrinks to fit its content (also restores correct height when the\n // component re-mounts or becomes visible again after being hidden).\n useLayoutEffect(() => {\n const el = internalRef.current;\n if (el) {\n el.style.height = \"auto\";\n el.style.height = `${el.scrollHeight}px`;\n }\n }, [value]);\n\n const handleChange = useCallback(\n (e: ChangeEvent<HTMLTextAreaElement>) => {\n onChange(e.target.value);\n },\n [onChange]\n );\n\n return (\n <StyledTextArea\n ref={mergeRefs(internalRef, externalRef)}\n value={value}\n onChange={handleChange}\n placeholder={placeholder}\n $maxHeight={maxHeight}\n rows={rows}\n autoFocus={autoFocus}\n onKeyDown={onKeyDown}\n disabled={disabled}\n className={className}\n />\n );\n});\n","import type { Ref } from \"react\";\n\n/**\n * Combines multiple React refs into a single callback ref.\n * Useful when a component needs to forward its ref while also keeping a local ref.\n *\n * @param refs - Any number of React refs (callback refs, RefObjects, or `undefined`).\n * @returns A callback ref that updates all provided refs when the DOM node changes.\n */\nexport function mergeRefs<T>(...refs: (Ref<T> | undefined)[]): (node: T | null) => void {\n return (node) => {\n for (const ref of refs) {\n if (typeof ref === \"function\") {\n ref(node);\n } else if (ref) {\n (ref as React.MutableRefObject<T | null>).current = node;\n }\n }\n };\n}\n","import styled from \"styled-components\";\n\nimport { colors } from \"../../tokens/colors\";\nimport { typographyMixin, typographyTypes } from \"../../tokens/typography\";\n\nexport const StyledTextArea = styled.textarea<{ $maxHeight?: number }>`\n ${typographyMixin(typographyTypes.GEIST_BODY_S_REGULAR)};\n color: ${colors[\"brown-100\"]};\n border: none;\n outline: none;\n resize: none;\n width: 100%;\n background: transparent;\n vertical-align: bottom;\n max-height: ${({ $maxHeight }) => ($maxHeight ? `${$maxHeight}px` : \"none\")};\n overflow-y: ${({ $maxHeight }) => ($maxHeight ? \"auto\" : \"hidden\")};\n\n &::placeholder {\n color: ${colors[\"brown-50\"]};\n }\n\n &:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n`;\n","export const colors = {\n // White\n white: \"#FFFFFF\",\n \"white-alpha-85\": \"rgba(255, 255, 255, 0.85)\",\n \"white-alpha-40\": \"rgba(255, 255, 255, 0.40)\",\n\n // Brown\n \"brown-10\": \"#FAF9F8\",\n \"brown-20\": \"#F5F3F0\",\n \"brown-30\": \"#EEEBE5\",\n \"brown-40\": \"#E6E2DA\",\n \"brown-50\": \"#CFCBC4\",\n \"brown-60\": \"#A19E99\",\n \"brown-70\": \"#73716D\",\n \"brown-80\": \"#5C5A57\",\n \"brown-90\": \"#2E2D2C\",\n \"brown-100\": \"#171716\",\n \"brown-alpha-12\": \"rgba(23, 23, 22, 0.12)\",\n \"brown-alpha-20\": \"rgba(23, 23, 22, 0.20)\",\n \"brown-alpha-55\": \"rgba(23, 23, 22, 0.55)\",\n \"brown-alpha-70\": \"rgba(23, 23, 22, 0.70)\",\n \"brown-alpha-80\": \"rgba(23, 23, 22, 0.80)\",\n \"brown-alpha-90\": \"rgba(23, 23, 22, 0.90)\",\n\n // Fuchsia\n \"fuchsia-50\": \"#FAF5FF\",\n \"fuchsia-300\": \"#F0ABFC\",\n \"fuchsia-500\": \"#D946EF\",\n \"fuchsia-600\": \"#C026D3\",\n \"fuchsia-800\": \"#86198F\",\n\n // Pink\n \"pink-50\": \"#FDF2F8\",\n \"pink-400\": \"#F472B6\",\n \"pink-600\": \"#DB2777\",\n \"pink-800\": \"#9D174D\",\n\n // Violet\n \"violet-50\": \"#F5F3FF\",\n \"violet-400\": \"#A78BFA\",\n \"violet-600\": \"#7C3AED\",\n \"violet-800\": \"#5B21B6\",\n\n // Indigo\n \"indigo-50\": \"#EEF2FF\",\n \"indigo-400\": \"#818CF8\",\n \"indigo-500\": \"#6366F1\",\n \"indigo-600\": \"#4F46E5\",\n \"indigo-800\": \"#3730A3\",\n\n // Cyan\n \"cyan-50\": \"#E7FEFF\",\n \"cyan-300\": \"#67E8F9\",\n \"cyan-600\": \"#0891B2\",\n \"cyan-900\": \"#164E63\",\n\n // Teal\n \"teal-50\": \"#EBFDF9\",\n \"teal-300\": \"#5EEAD4\",\n \"teal-600\": \"#0D9488\",\n\n // Rose\n \"rose-400\": \"#FB7185\",\n\n // Purple\n \"purple-400\": \"#C084FC\",\n\n // Blue\n \"blue-50\": \"#EFF6FF\",\n \"blue-100\": \"#DBEAFE\",\n \"blue-300\": \"#93C5FD\",\n \"blue-400\": \"#60A5FA\",\n \"blue-600\": \"#2563EB\",\n \"blue-800\": \"#1E40AF\",\n\n // Sky\n \"sky-300\": \"#7DD3FC\",\n\n // Green\n \"green-50\": \"#ECF9F0\",\n \"green-100\": \"#D4F1D9\",\n \"green-400\": \"#3DC269\",\n \"green-700\": \"#277C43\",\n \"green-800\": \"#1C5930\",\n\n // Orange\n \"orange-50\": \"#FFF7ED\",\n \"orange-100\": \"#FFEDD5\",\n \"orange-200\": \"#FED7AA\",\n \"orange-500\": \"#F97316\",\n \"orange-600\": \"#EA580C\",\n\n // Red\n \"red-50\": \"#FEF2F2\",\n \"red-100\": \"#FEE2E2\",\n \"red-200\": \"#FECACA\",\n \"red-400\": \"#F7776C\",\n \"red-500\": \"#EF4444\",\n \"red-600\": \"#DC2626\",\n} as const;\n\nexport type ColorToken = keyof typeof colors;\n","/** Available font families in the Shapes.co design system. */\nexport const fontFamilies = {\n /** Geist — primary UI font for body text, labels, headings, and display. */\n GEIST: \"Geist\",\n /** Crimson Pro — editorial/serif font, mostly italic. Used for decorative headings and pull quotes. */\n CRIMSON_PRO: \"Crimson Pro\",\n} as const;\n\n/*\n * Type-name convention: `<FAMILY>_<ROLE>_<SIZE>_<WEIGHT>[_ITALIC]`. An italic style is marked by a\n * trailing `_ITALIC` suffix on the name (mirroring io-client's `styled-mixins/typography-mixin`);\n * names without it are upright. The suffix is the single source of truth in the NAME — the matching\n * `typographyStyles` entry still carries `fontStyle: \"italic\"`.\n */\n\nexport const typographyTypes = {\n // Geist Label Caption (12px)\n GEIST_LABEL_CAPTION_REGULAR: \"GEIST_LABEL_CAPTION_REGULAR\",\n GEIST_LABEL_CAPTION_MEDIUM: \"GEIST_LABEL_CAPTION_MEDIUM\",\n GEIST_LABEL_CAPTION_SEMI_BOLD: \"GEIST_LABEL_CAPTION_SEMI_BOLD\",\n\n // Geist Body Extra Small (14px)\n GEIST_BODY_XS_REGULAR: \"GEIST_BODY_XS_REGULAR\",\n GEIST_BODY_XS_MEDIUM: \"GEIST_BODY_XS_MEDIUM\",\n GEIST_BODY_XS_BOLD: \"GEIST_BODY_XS_BOLD\",\n\n // Geist Body Small (16px)\n GEIST_BODY_S_REGULAR: \"GEIST_BODY_S_REGULAR\",\n GEIST_BODY_S_MEDIUM: \"GEIST_BODY_S_MEDIUM\",\n GEIST_BODY_S_SEMI_BOLD: \"GEIST_BODY_S_SEMI_BOLD\",\n GEIST_BODY_S_BOLD: \"GEIST_BODY_S_BOLD\",\n\n // Geist Body Medium (18px)\n GEIST_BODY_M_LIGHT: \"GEIST_BODY_M_LIGHT\",\n GEIST_BODY_M_REGULAR: \"GEIST_BODY_M_REGULAR\",\n GEIST_BODY_M_MEDIUM: \"GEIST_BODY_M_MEDIUM\",\n GEIST_BODY_M_SEMI_BOLD: \"GEIST_BODY_M_SEMI_BOLD\",\n\n // Geist Body Large (20px)\n GEIST_BODY_L_REGULAR: \"GEIST_BODY_L_REGULAR\",\n GEIST_BODY_L_MEDIUM: \"GEIST_BODY_L_MEDIUM\",\n GEIST_BODY_L_SEMI_BOLD: \"GEIST_BODY_L_SEMI_BOLD\",\n GEIST_BODY_L_BOLD: \"GEIST_BODY_L_BOLD\",\n\n // Geist Heading Small (24px)\n GEIST_HEADING_S_REGULAR: \"GEIST_HEADING_S_REGULAR\",\n GEIST_HEADING_S_MEDIUM: \"GEIST_HEADING_S_MEDIUM\",\n GEIST_HEADING_S_BOLD: \"GEIST_HEADING_S_BOLD\",\n\n // Geist Heading Medium (28px)\n GEIST_HEADING_M_BOLD: \"GEIST_HEADING_M_BOLD\",\n\n // Geist Heading Large (32px)\n GEIST_HEADING_L_REGULAR: \"GEIST_HEADING_L_REGULAR\",\n GEIST_HEADING_L_MEDIUM: \"GEIST_HEADING_L_MEDIUM\",\n GEIST_HEADING_L_SEMI_BOLD: \"GEIST_HEADING_L_SEMI_BOLD\",\n GEIST_HEADING_L_BOLD: \"GEIST_HEADING_L_BOLD\",\n\n // Geist Display Large (36px)\n GEIST_DISPLAY_L_MEDIUM: \"GEIST_DISPLAY_L_MEDIUM\",\n\n // Crimson Pro Body Small (16px, italic)\n CRIMSON_PRO_BODY_S_LIGHT_ITALIC: \"CRIMSON_PRO_BODY_S_LIGHT_ITALIC\",\n\n // Crimson Pro Body Medium (18px, italic)\n CRIMSON_PRO_BODY_M_LIGHT_ITALIC: \"CRIMSON_PRO_BODY_M_LIGHT_ITALIC\",\n\n // Crimson Pro Heading Medium (24px, italic)\n CRIMSON_PRO_HEADING_M_MEDIUM_ITALIC: \"CRIMSON_PRO_HEADING_M_MEDIUM_ITALIC\",\n\n // Crimson Pro Display Large (40px, upright)\n CRIMSON_PRO_DISPLAY_L_REGULAR: \"CRIMSON_PRO_DISPLAY_L_REGULAR\",\n\n // Crimson Pro Display Extra Large (46px, italic)\n CRIMSON_PRO_DISPLAY_XL_REGULAR_ITALIC: \"CRIMSON_PRO_DISPLAY_XL_REGULAR_ITALIC\",\n} as const;\n\n/** Union of all typography type string constants. Used as keys into `typographyStyles`. */\nexport type TypographyType = (typeof typographyTypes)[keyof typeof typographyTypes];\n\n/** CSS properties for a single typography type. All numeric values are in pixels. */\nexport interface TypographyStyle {\n /** Font family name (e.g., \"Geist\"). */\n fontFamily: string;\n /** Font size in pixels. */\n fontSize: number;\n /** Font weight (100–900). */\n fontWeight: number;\n /** Line height in pixels. */\n lineHeight: number;\n /** Letter spacing in pixels. Omitted when the font's default spacing is correct. */\n letterSpacing?: number;\n /** CSS font-style value (e.g., \"italic\"). Omitted for normal style. */\n fontStyle?: string;\n}\n\nexport const typographyStyles: Record<TypographyType, TypographyStyle> = {\n // Geist Label Caption (12px)\n [typographyTypes.GEIST_LABEL_CAPTION_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 12,\n fontWeight: 400,\n lineHeight: 16,\n },\n [typographyTypes.GEIST_LABEL_CAPTION_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 12,\n fontWeight: 500,\n lineHeight: 16,\n },\n [typographyTypes.GEIST_LABEL_CAPTION_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 12,\n fontWeight: 600,\n lineHeight: 16,\n },\n\n // Geist Body Extra Small (14px)\n [typographyTypes.GEIST_BODY_XS_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 14,\n fontWeight: 400,\n lineHeight: 20,\n },\n [typographyTypes.GEIST_BODY_XS_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 14,\n fontWeight: 500,\n lineHeight: 20,\n },\n [typographyTypes.GEIST_BODY_XS_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 14,\n fontWeight: 600,\n lineHeight: 20,\n },\n\n // Geist Body Small (16px)\n [typographyTypes.GEIST_BODY_S_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 16,\n fontWeight: 400,\n lineHeight: 24,\n letterSpacing: -0.08,\n },\n [typographyTypes.GEIST_BODY_S_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 16,\n fontWeight: 500,\n lineHeight: 24,\n letterSpacing: -0.08,\n },\n [typographyTypes.GEIST_BODY_S_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 16,\n fontWeight: 600,\n lineHeight: 24,\n letterSpacing: -0.08,\n },\n [typographyTypes.GEIST_BODY_S_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 16,\n fontWeight: 700,\n lineHeight: 24,\n letterSpacing: -0.08,\n },\n\n // Geist Body Medium (18px)\n [typographyTypes.GEIST_BODY_M_LIGHT]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 18,\n fontWeight: 300,\n lineHeight: 28,\n letterSpacing: -0.09,\n },\n [typographyTypes.GEIST_BODY_M_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 18,\n fontWeight: 400,\n lineHeight: 28,\n letterSpacing: -0.09,\n },\n [typographyTypes.GEIST_BODY_M_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 18,\n fontWeight: 500,\n lineHeight: 28,\n letterSpacing: -0.09,\n },\n [typographyTypes.GEIST_BODY_M_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 18,\n fontWeight: 600,\n lineHeight: 28,\n letterSpacing: -0.09,\n },\n\n // Geist Body Large (20px)\n [typographyTypes.GEIST_BODY_L_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 20,\n fontWeight: 400,\n lineHeight: 30,\n letterSpacing: -0.2,\n },\n [typographyTypes.GEIST_BODY_L_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 20,\n fontWeight: 500,\n lineHeight: 30,\n letterSpacing: -0.2,\n },\n [typographyTypes.GEIST_BODY_L_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 20,\n fontWeight: 600,\n lineHeight: 30,\n letterSpacing: -0.2,\n },\n [typographyTypes.GEIST_BODY_L_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 20,\n fontWeight: 700,\n lineHeight: 30,\n letterSpacing: -0.2,\n },\n\n // Geist Heading Small (24px)\n [typographyTypes.GEIST_HEADING_S_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 24,\n fontWeight: 400,\n lineHeight: 32,\n letterSpacing: -0.48,\n },\n [typographyTypes.GEIST_HEADING_S_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 24,\n fontWeight: 500,\n lineHeight: 32,\n letterSpacing: -0.48,\n },\n [typographyTypes.GEIST_HEADING_S_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 24,\n fontWeight: 700,\n lineHeight: 32,\n letterSpacing: -0.48,\n },\n\n // Geist Heading Medium (28px)\n [typographyTypes.GEIST_HEADING_M_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 28,\n fontWeight: 700,\n lineHeight: 36,\n letterSpacing: -0.6,\n },\n\n // Geist Heading Large (32px)\n [typographyTypes.GEIST_HEADING_L_REGULAR]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 32,\n fontWeight: 400,\n lineHeight: 40,\n letterSpacing: -0.64,\n },\n [typographyTypes.GEIST_HEADING_L_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 32,\n fontWeight: 500,\n lineHeight: 40,\n letterSpacing: -0.64,\n },\n [typographyTypes.GEIST_HEADING_L_SEMI_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 32,\n fontWeight: 600,\n lineHeight: 40,\n letterSpacing: -0.64,\n },\n [typographyTypes.GEIST_HEADING_L_BOLD]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 32,\n fontWeight: 700,\n lineHeight: 40,\n letterSpacing: -0.64,\n },\n\n // Geist Display Large (36px)\n [typographyTypes.GEIST_DISPLAY_L_MEDIUM]: {\n fontFamily: fontFamilies.GEIST,\n fontSize: 36,\n fontWeight: 500,\n lineHeight: 44,\n letterSpacing: -0.72,\n },\n\n // Crimson Pro Body Small (16px, italic)\n [typographyTypes.CRIMSON_PRO_BODY_S_LIGHT_ITALIC]: {\n fontFamily: fontFamilies.CRIMSON_PRO,\n fontSize: 16,\n fontWeight: 300,\n lineHeight: 20,\n letterSpacing: -0.32,\n fontStyle: \"italic\",\n },\n\n // Crimson Pro Body Medium (18px, italic)\n [typographyTypes.CRIMSON_PRO_BODY_M_LIGHT_ITALIC]: {\n fontFamily: fontFamilies.CRIMSON_PRO,\n fontSize: 18,\n fontWeight: 300,\n lineHeight: 28,\n letterSpacing: 0,\n fontStyle: \"italic\",\n },\n\n // Crimson Pro Heading Medium (24px, italic)\n [typographyTypes.CRIMSON_PRO_HEADING_M_MEDIUM_ITALIC]: {\n fontFamily: fontFamilies.CRIMSON_PRO,\n fontSize: 24,\n fontWeight: 400,\n lineHeight: 32,\n letterSpacing: -0.48,\n fontStyle: \"italic\",\n },\n\n // Crimson Pro Display Large (40px, upright)\n [typographyTypes.CRIMSON_PRO_DISPLAY_L_REGULAR]: {\n fontFamily: fontFamilies.CRIMSON_PRO,\n fontSize: 40,\n fontWeight: 300,\n lineHeight: 48,\n letterSpacing: -1.6,\n },\n\n // Crimson Pro Display Extra Large (46px, italic)\n [typographyTypes.CRIMSON_PRO_DISPLAY_XL_REGULAR_ITALIC]: {\n fontFamily: fontFamilies.CRIMSON_PRO,\n fontSize: 46,\n fontWeight: 400,\n lineHeight: 54,\n letterSpacing: -1.38,\n fontStyle: \"italic\",\n },\n};\n\n/**\n * Generates a CSS string for a given typography type, suitable for use in styled-components template literals.\n * @param type - The typography type constant (e.g., `typographyTypes.GEIST_BODY_S_REGULAR`).\n * @returns A semicolon-separated CSS string with font-family, font-size, font-weight, line-height, letter-spacing, and font-style.\n */\nexport function typographyMixin(type: TypographyType): string {\n const style = typographyStyles[type];\n return [\n `font-family: \"${style.fontFamily}\", sans-serif`,\n `font-size: ${style.fontSize}px`,\n `font-weight: ${style.fontWeight}`,\n `line-height: ${style.lineHeight}px`,\n `letter-spacing: ${style.letterSpacing != null ? `${style.letterSpacing}px` : \"inherit\"}`,\n `font-style: ${style.fontStyle ?? \"normal\"}`,\n ].join(\";\\n \");\n}\n"],"mappings":"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","names":["styled","TextArea"]}
|
package/dist/text-area.d.cts
CHANGED
|
@@ -1,28 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
/** Props for the TextArea auto-resizing input component. */
|
|
5
|
-
interface TextAreaProps {
|
|
6
|
-
/** Current text value (controlled). */
|
|
7
|
-
value: string;
|
|
8
|
-
/** Called on every input change with the new text value. */
|
|
9
|
-
onChange: (value: string) => void;
|
|
10
|
-
/** Placeholder text shown when the textarea is empty. */
|
|
11
|
-
placeholder?: string;
|
|
12
|
-
/** Maximum height in pixels before the textarea scrolls instead of growing. */
|
|
13
|
-
maxHeight?: number;
|
|
14
|
-
/** Initial number of visible text rows. @default 1 */
|
|
15
|
-
rows?: number;
|
|
16
|
-
/** Whether to focus the textarea on mount. */
|
|
17
|
-
autoFocus?: boolean;
|
|
18
|
-
/** Keyboard event handler — useful for intercepting Enter to send. */
|
|
19
|
-
onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement>;
|
|
20
|
-
/** Whether the textarea is non-interactive. */
|
|
21
|
-
disabled?: boolean;
|
|
22
|
-
/** Additional CSS class name. */
|
|
23
|
-
className?: string;
|
|
24
|
-
}
|
|
2
|
+
import { T as TextAreaProps } from './types-CMzZsL_J.cjs';
|
|
25
3
|
|
|
26
4
|
declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
27
5
|
|
|
28
|
-
export { TextArea,
|
|
6
|
+
export { TextArea, TextAreaProps };
|