@causw/core 0.0.6 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/index.d.mts +304 -1
  2. package/dist/index.d.ts +304 -1
  3. package/dist/index.js +281 -0
  4. package/dist/index.mjs +275 -0
  5. package/package.json +19 -5
  6. package/src/styles/global.css +3 -0
package/dist/index.d.mts CHANGED
@@ -1,2 +1,305 @@
1
+ import React from 'react';
2
+ import { ClassValue } from 'clsx';
1
3
 
2
- export { }
4
+ type TextVariant = 'caption' | 'body2' | 'body' | 'subtitle' | 'title' | 'head' | 'fixed';
5
+ type TextSize = 'sm' | 'md';
6
+ type FixedSize = 12 | 14 | 15 | 16 | 18 | 20 | 24;
7
+ type TextColor = 'gray-50' | 'gray-100' | 'gray-200' | 'gray-300' | 'gray-400' | 'gray-500' | 'gray-600' | 'gray-700' | 'gray-800' | 'gray-900' | 'blue-50' | 'blue-500' | 'blue-700' | 'red-100' | 'red-400' | 'white' | 'black';
8
+
9
+ type BaseTextProps = React.HTMLAttributes<HTMLElement> & {
10
+ point?: boolean;
11
+ color?: TextColor;
12
+ as?: 'span' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div' | 'label';
13
+ children: React.ReactNode;
14
+ };
15
+ type ResponsiveTextProps = {
16
+ variant?: Exclude<TextVariant, 'fixed'>;
17
+ size?: TextSize;
18
+ fixedSize?: never;
19
+ };
20
+ type FixedTextProps = {
21
+ variant: 'fixed';
22
+ size?: never;
23
+ fixedSize: FixedSize;
24
+ };
25
+ type TextProps = BaseTextProps & (ResponsiveTextProps | FixedTextProps);
26
+ declare const Text: {
27
+ ({ variant, size, fixedSize, point, color, as: Component, children, className, ...props }: TextProps): React.DetailedReactHTMLElement<{
28
+ defaultChecked?: boolean | undefined;
29
+ defaultValue?: string | number | readonly string[] | undefined;
30
+ suppressContentEditableWarning?: boolean | undefined;
31
+ suppressHydrationWarning?: boolean | undefined;
32
+ accessKey?: string | undefined;
33
+ autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {});
34
+ autoFocus?: boolean | undefined;
35
+ contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
36
+ contextMenu?: string | undefined;
37
+ dir?: string | undefined;
38
+ draggable?: (boolean | "true" | "false") | undefined;
39
+ enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
40
+ hidden?: boolean | undefined;
41
+ id?: string | undefined;
42
+ lang?: string | undefined;
43
+ nonce?: string | undefined;
44
+ slot?: string | undefined;
45
+ spellCheck?: (boolean | "true" | "false") | undefined;
46
+ style?: React.CSSProperties | undefined;
47
+ tabIndex?: number | undefined;
48
+ title?: string | undefined;
49
+ translate?: "yes" | "no" | undefined;
50
+ radioGroup?: string | undefined;
51
+ role?: React.AriaRole | undefined;
52
+ about?: string | undefined;
53
+ content?: string | undefined;
54
+ datatype?: string | undefined;
55
+ inlist?: any;
56
+ prefix?: string | undefined;
57
+ property?: string | undefined;
58
+ rel?: string | undefined;
59
+ resource?: string | undefined;
60
+ rev?: string | undefined;
61
+ typeof?: string | undefined;
62
+ vocab?: string | undefined;
63
+ autoCorrect?: string | undefined;
64
+ autoSave?: string | undefined;
65
+ itemProp?: string | undefined;
66
+ itemScope?: boolean | undefined;
67
+ itemType?: string | undefined;
68
+ itemID?: string | undefined;
69
+ itemRef?: string | undefined;
70
+ results?: number | undefined;
71
+ security?: string | undefined;
72
+ unselectable?: "on" | "off" | undefined;
73
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
74
+ is?: string | undefined;
75
+ exportparts?: string | undefined;
76
+ part?: string | undefined;
77
+ "aria-activedescendant"?: string | undefined;
78
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
79
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
80
+ "aria-braillelabel"?: string | undefined;
81
+ "aria-brailleroledescription"?: string | undefined;
82
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
83
+ "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
84
+ "aria-colcount"?: number | undefined;
85
+ "aria-colindex"?: number | undefined;
86
+ "aria-colindextext"?: string | undefined;
87
+ "aria-colspan"?: number | undefined;
88
+ "aria-controls"?: string | undefined;
89
+ "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
90
+ "aria-describedby"?: string | undefined;
91
+ "aria-description"?: string | undefined;
92
+ "aria-details"?: string | undefined;
93
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
94
+ "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
95
+ "aria-errormessage"?: string | undefined;
96
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
97
+ "aria-flowto"?: string | undefined;
98
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
99
+ "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
100
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
101
+ "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
102
+ "aria-keyshortcuts"?: string | undefined;
103
+ "aria-label"?: string | undefined;
104
+ "aria-labelledby"?: string | undefined;
105
+ "aria-level"?: number | undefined;
106
+ "aria-live"?: "off" | "assertive" | "polite" | undefined;
107
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
108
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
109
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
110
+ "aria-orientation"?: "horizontal" | "vertical" | undefined;
111
+ "aria-owns"?: string | undefined;
112
+ "aria-placeholder"?: string | undefined;
113
+ "aria-posinset"?: number | undefined;
114
+ "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
115
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
116
+ "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
117
+ "aria-required"?: (boolean | "true" | "false") | undefined;
118
+ "aria-roledescription"?: string | undefined;
119
+ "aria-rowcount"?: number | undefined;
120
+ "aria-rowindex"?: number | undefined;
121
+ "aria-rowindextext"?: string | undefined;
122
+ "aria-rowspan"?: number | undefined;
123
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
124
+ "aria-setsize"?: number | undefined;
125
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
126
+ "aria-valuemax"?: number | undefined;
127
+ "aria-valuemin"?: number | undefined;
128
+ "aria-valuenow"?: number | undefined;
129
+ "aria-valuetext"?: string | undefined;
130
+ dangerouslySetInnerHTML?: {
131
+ __html: string | TrustedHTML;
132
+ } | undefined;
133
+ onCopy?: React.ClipboardEventHandler<HTMLElement> | undefined;
134
+ onCopyCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
135
+ onCut?: React.ClipboardEventHandler<HTMLElement> | undefined;
136
+ onCutCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
137
+ onPaste?: React.ClipboardEventHandler<HTMLElement> | undefined;
138
+ onPasteCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
139
+ onCompositionEnd?: React.CompositionEventHandler<HTMLElement> | undefined;
140
+ onCompositionEndCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
141
+ onCompositionStart?: React.CompositionEventHandler<HTMLElement> | undefined;
142
+ onCompositionStartCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
143
+ onCompositionUpdate?: React.CompositionEventHandler<HTMLElement> | undefined;
144
+ onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
145
+ onFocus?: React.FocusEventHandler<HTMLElement> | undefined;
146
+ onFocusCapture?: React.FocusEventHandler<HTMLElement> | undefined;
147
+ onBlur?: React.FocusEventHandler<HTMLElement> | undefined;
148
+ onBlurCapture?: React.FocusEventHandler<HTMLElement> | undefined;
149
+ onChange?: React.FormEventHandler<HTMLElement> | undefined;
150
+ onChangeCapture?: React.FormEventHandler<HTMLElement> | undefined;
151
+ onBeforeInput?: React.InputEventHandler<HTMLElement> | undefined;
152
+ onBeforeInputCapture?: React.FormEventHandler<HTMLElement> | undefined;
153
+ onInput?: React.FormEventHandler<HTMLElement> | undefined;
154
+ onInputCapture?: React.FormEventHandler<HTMLElement> | undefined;
155
+ onReset?: React.FormEventHandler<HTMLElement> | undefined;
156
+ onResetCapture?: React.FormEventHandler<HTMLElement> | undefined;
157
+ onSubmit?: React.FormEventHandler<HTMLElement> | undefined;
158
+ onSubmitCapture?: React.FormEventHandler<HTMLElement> | undefined;
159
+ onInvalid?: React.FormEventHandler<HTMLElement> | undefined;
160
+ onInvalidCapture?: React.FormEventHandler<HTMLElement> | undefined;
161
+ onLoad?: React.ReactEventHandler<HTMLElement> | undefined;
162
+ onLoadCapture?: React.ReactEventHandler<HTMLElement> | undefined;
163
+ onError?: React.ReactEventHandler<HTMLElement> | undefined;
164
+ onErrorCapture?: React.ReactEventHandler<HTMLElement> | undefined;
165
+ onKeyDown?: React.KeyboardEventHandler<HTMLElement> | undefined;
166
+ onKeyDownCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
167
+ onKeyPress?: React.KeyboardEventHandler<HTMLElement> | undefined;
168
+ onKeyPressCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
169
+ onKeyUp?: React.KeyboardEventHandler<HTMLElement> | undefined;
170
+ onKeyUpCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
171
+ onAbort?: React.ReactEventHandler<HTMLElement> | undefined;
172
+ onAbortCapture?: React.ReactEventHandler<HTMLElement> | undefined;
173
+ onCanPlay?: React.ReactEventHandler<HTMLElement> | undefined;
174
+ onCanPlayCapture?: React.ReactEventHandler<HTMLElement> | undefined;
175
+ onCanPlayThrough?: React.ReactEventHandler<HTMLElement> | undefined;
176
+ onCanPlayThroughCapture?: React.ReactEventHandler<HTMLElement> | undefined;
177
+ onDurationChange?: React.ReactEventHandler<HTMLElement> | undefined;
178
+ onDurationChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
179
+ onEmptied?: React.ReactEventHandler<HTMLElement> | undefined;
180
+ onEmptiedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
181
+ onEncrypted?: React.ReactEventHandler<HTMLElement> | undefined;
182
+ onEncryptedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
183
+ onEnded?: React.ReactEventHandler<HTMLElement> | undefined;
184
+ onEndedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
185
+ onLoadedData?: React.ReactEventHandler<HTMLElement> | undefined;
186
+ onLoadedDataCapture?: React.ReactEventHandler<HTMLElement> | undefined;
187
+ onLoadedMetadata?: React.ReactEventHandler<HTMLElement> | undefined;
188
+ onLoadedMetadataCapture?: React.ReactEventHandler<HTMLElement> | undefined;
189
+ onLoadStart?: React.ReactEventHandler<HTMLElement> | undefined;
190
+ onLoadStartCapture?: React.ReactEventHandler<HTMLElement> | undefined;
191
+ onPause?: React.ReactEventHandler<HTMLElement> | undefined;
192
+ onPauseCapture?: React.ReactEventHandler<HTMLElement> | undefined;
193
+ onPlay?: React.ReactEventHandler<HTMLElement> | undefined;
194
+ onPlayCapture?: React.ReactEventHandler<HTMLElement> | undefined;
195
+ onPlaying?: React.ReactEventHandler<HTMLElement> | undefined;
196
+ onPlayingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
197
+ onProgress?: React.ReactEventHandler<HTMLElement> | undefined;
198
+ onProgressCapture?: React.ReactEventHandler<HTMLElement> | undefined;
199
+ onRateChange?: React.ReactEventHandler<HTMLElement> | undefined;
200
+ onRateChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
201
+ onSeeked?: React.ReactEventHandler<HTMLElement> | undefined;
202
+ onSeekedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
203
+ onSeeking?: React.ReactEventHandler<HTMLElement> | undefined;
204
+ onSeekingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
205
+ onStalled?: React.ReactEventHandler<HTMLElement> | undefined;
206
+ onStalledCapture?: React.ReactEventHandler<HTMLElement> | undefined;
207
+ onSuspend?: React.ReactEventHandler<HTMLElement> | undefined;
208
+ onSuspendCapture?: React.ReactEventHandler<HTMLElement> | undefined;
209
+ onTimeUpdate?: React.ReactEventHandler<HTMLElement> | undefined;
210
+ onTimeUpdateCapture?: React.ReactEventHandler<HTMLElement> | undefined;
211
+ onVolumeChange?: React.ReactEventHandler<HTMLElement> | undefined;
212
+ onVolumeChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
213
+ onWaiting?: React.ReactEventHandler<HTMLElement> | undefined;
214
+ onWaitingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
215
+ onAuxClick?: React.MouseEventHandler<HTMLElement> | undefined;
216
+ onAuxClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
217
+ onClick?: React.MouseEventHandler<HTMLElement> | undefined;
218
+ onClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
219
+ onContextMenu?: React.MouseEventHandler<HTMLElement> | undefined;
220
+ onContextMenuCapture?: React.MouseEventHandler<HTMLElement> | undefined;
221
+ onDoubleClick?: React.MouseEventHandler<HTMLElement> | undefined;
222
+ onDoubleClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
223
+ onDrag?: React.DragEventHandler<HTMLElement> | undefined;
224
+ onDragCapture?: React.DragEventHandler<HTMLElement> | undefined;
225
+ onDragEnd?: React.DragEventHandler<HTMLElement> | undefined;
226
+ onDragEndCapture?: React.DragEventHandler<HTMLElement> | undefined;
227
+ onDragEnter?: React.DragEventHandler<HTMLElement> | undefined;
228
+ onDragEnterCapture?: React.DragEventHandler<HTMLElement> | undefined;
229
+ onDragExit?: React.DragEventHandler<HTMLElement> | undefined;
230
+ onDragExitCapture?: React.DragEventHandler<HTMLElement> | undefined;
231
+ onDragLeave?: React.DragEventHandler<HTMLElement> | undefined;
232
+ onDragLeaveCapture?: React.DragEventHandler<HTMLElement> | undefined;
233
+ onDragOver?: React.DragEventHandler<HTMLElement> | undefined;
234
+ onDragOverCapture?: React.DragEventHandler<HTMLElement> | undefined;
235
+ onDragStart?: React.DragEventHandler<HTMLElement> | undefined;
236
+ onDragStartCapture?: React.DragEventHandler<HTMLElement> | undefined;
237
+ onDrop?: React.DragEventHandler<HTMLElement> | undefined;
238
+ onDropCapture?: React.DragEventHandler<HTMLElement> | undefined;
239
+ onMouseDown?: React.MouseEventHandler<HTMLElement> | undefined;
240
+ onMouseDownCapture?: React.MouseEventHandler<HTMLElement> | undefined;
241
+ onMouseEnter?: React.MouseEventHandler<HTMLElement> | undefined;
242
+ onMouseLeave?: React.MouseEventHandler<HTMLElement> | undefined;
243
+ onMouseMove?: React.MouseEventHandler<HTMLElement> | undefined;
244
+ onMouseMoveCapture?: React.MouseEventHandler<HTMLElement> | undefined;
245
+ onMouseOut?: React.MouseEventHandler<HTMLElement> | undefined;
246
+ onMouseOutCapture?: React.MouseEventHandler<HTMLElement> | undefined;
247
+ onMouseOver?: React.MouseEventHandler<HTMLElement> | undefined;
248
+ onMouseOverCapture?: React.MouseEventHandler<HTMLElement> | undefined;
249
+ onMouseUp?: React.MouseEventHandler<HTMLElement> | undefined;
250
+ onMouseUpCapture?: React.MouseEventHandler<HTMLElement> | undefined;
251
+ onSelect?: React.ReactEventHandler<HTMLElement> | undefined;
252
+ onSelectCapture?: React.ReactEventHandler<HTMLElement> | undefined;
253
+ onTouchCancel?: React.TouchEventHandler<HTMLElement> | undefined;
254
+ onTouchCancelCapture?: React.TouchEventHandler<HTMLElement> | undefined;
255
+ onTouchEnd?: React.TouchEventHandler<HTMLElement> | undefined;
256
+ onTouchEndCapture?: React.TouchEventHandler<HTMLElement> | undefined;
257
+ onTouchMove?: React.TouchEventHandler<HTMLElement> | undefined;
258
+ onTouchMoveCapture?: React.TouchEventHandler<HTMLElement> | undefined;
259
+ onTouchStart?: React.TouchEventHandler<HTMLElement> | undefined;
260
+ onTouchStartCapture?: React.TouchEventHandler<HTMLElement> | undefined;
261
+ onPointerDown?: React.PointerEventHandler<HTMLElement> | undefined;
262
+ onPointerDownCapture?: React.PointerEventHandler<HTMLElement> | undefined;
263
+ onPointerMove?: React.PointerEventHandler<HTMLElement> | undefined;
264
+ onPointerMoveCapture?: React.PointerEventHandler<HTMLElement> | undefined;
265
+ onPointerUp?: React.PointerEventHandler<HTMLElement> | undefined;
266
+ onPointerUpCapture?: React.PointerEventHandler<HTMLElement> | undefined;
267
+ onPointerCancel?: React.PointerEventHandler<HTMLElement> | undefined;
268
+ onPointerCancelCapture?: React.PointerEventHandler<HTMLElement> | undefined;
269
+ onPointerEnter?: React.PointerEventHandler<HTMLElement> | undefined;
270
+ onPointerLeave?: React.PointerEventHandler<HTMLElement> | undefined;
271
+ onPointerOver?: React.PointerEventHandler<HTMLElement> | undefined;
272
+ onPointerOverCapture?: React.PointerEventHandler<HTMLElement> | undefined;
273
+ onPointerOut?: React.PointerEventHandler<HTMLElement> | undefined;
274
+ onPointerOutCapture?: React.PointerEventHandler<HTMLElement> | undefined;
275
+ onGotPointerCapture?: React.PointerEventHandler<HTMLElement> | undefined;
276
+ onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLElement> | undefined;
277
+ onLostPointerCapture?: React.PointerEventHandler<HTMLElement> | undefined;
278
+ onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLElement> | undefined;
279
+ onScroll?: React.UIEventHandler<HTMLElement> | undefined;
280
+ onScrollCapture?: React.UIEventHandler<HTMLElement> | undefined;
281
+ onWheel?: React.WheelEventHandler<HTMLElement> | undefined;
282
+ onWheelCapture?: React.WheelEventHandler<HTMLElement> | undefined;
283
+ onAnimationStart?: React.AnimationEventHandler<HTMLElement> | undefined;
284
+ onAnimationStartCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
285
+ onAnimationEnd?: React.AnimationEventHandler<HTMLElement> | undefined;
286
+ onAnimationEndCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
287
+ onAnimationIteration?: React.AnimationEventHandler<HTMLElement> | undefined;
288
+ onAnimationIterationCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
289
+ onTransitionEnd?: React.TransitionEventHandler<HTMLElement> | undefined;
290
+ onTransitionEndCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
291
+ className: string;
292
+ }, HTMLElement>;
293
+ displayName: string;
294
+ };
295
+
296
+ /**
297
+ * Combines class names with Tailwind CSS conflict resolution
298
+ *
299
+ * @example
300
+ * mergeStyles('px-2 py-1', 'px-4') // => 'py-1 px-4'
301
+ * mergeStyles('text-red-500', condition && 'text-blue-500')
302
+ */
303
+ declare function mergeStyles(...inputs: ClassValue[]): string;
304
+
305
+ export { type FixedSize, Text, type TextProps, type TextSize, type TextVariant, mergeStyles };
package/dist/index.d.ts CHANGED
@@ -1,2 +1,305 @@
1
+ import React from 'react';
2
+ import { ClassValue } from 'clsx';
1
3
 
2
- export { }
4
+ type TextVariant = 'caption' | 'body2' | 'body' | 'subtitle' | 'title' | 'head' | 'fixed';
5
+ type TextSize = 'sm' | 'md';
6
+ type FixedSize = 12 | 14 | 15 | 16 | 18 | 20 | 24;
7
+ type TextColor = 'gray-50' | 'gray-100' | 'gray-200' | 'gray-300' | 'gray-400' | 'gray-500' | 'gray-600' | 'gray-700' | 'gray-800' | 'gray-900' | 'blue-50' | 'blue-500' | 'blue-700' | 'red-100' | 'red-400' | 'white' | 'black';
8
+
9
+ type BaseTextProps = React.HTMLAttributes<HTMLElement> & {
10
+ point?: boolean;
11
+ color?: TextColor;
12
+ as?: 'span' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div' | 'label';
13
+ children: React.ReactNode;
14
+ };
15
+ type ResponsiveTextProps = {
16
+ variant?: Exclude<TextVariant, 'fixed'>;
17
+ size?: TextSize;
18
+ fixedSize?: never;
19
+ };
20
+ type FixedTextProps = {
21
+ variant: 'fixed';
22
+ size?: never;
23
+ fixedSize: FixedSize;
24
+ };
25
+ type TextProps = BaseTextProps & (ResponsiveTextProps | FixedTextProps);
26
+ declare const Text: {
27
+ ({ variant, size, fixedSize, point, color, as: Component, children, className, ...props }: TextProps): React.DetailedReactHTMLElement<{
28
+ defaultChecked?: boolean | undefined;
29
+ defaultValue?: string | number | readonly string[] | undefined;
30
+ suppressContentEditableWarning?: boolean | undefined;
31
+ suppressHydrationWarning?: boolean | undefined;
32
+ accessKey?: string | undefined;
33
+ autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {});
34
+ autoFocus?: boolean | undefined;
35
+ contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
36
+ contextMenu?: string | undefined;
37
+ dir?: string | undefined;
38
+ draggable?: (boolean | "true" | "false") | undefined;
39
+ enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
40
+ hidden?: boolean | undefined;
41
+ id?: string | undefined;
42
+ lang?: string | undefined;
43
+ nonce?: string | undefined;
44
+ slot?: string | undefined;
45
+ spellCheck?: (boolean | "true" | "false") | undefined;
46
+ style?: React.CSSProperties | undefined;
47
+ tabIndex?: number | undefined;
48
+ title?: string | undefined;
49
+ translate?: "yes" | "no" | undefined;
50
+ radioGroup?: string | undefined;
51
+ role?: React.AriaRole | undefined;
52
+ about?: string | undefined;
53
+ content?: string | undefined;
54
+ datatype?: string | undefined;
55
+ inlist?: any;
56
+ prefix?: string | undefined;
57
+ property?: string | undefined;
58
+ rel?: string | undefined;
59
+ resource?: string | undefined;
60
+ rev?: string | undefined;
61
+ typeof?: string | undefined;
62
+ vocab?: string | undefined;
63
+ autoCorrect?: string | undefined;
64
+ autoSave?: string | undefined;
65
+ itemProp?: string | undefined;
66
+ itemScope?: boolean | undefined;
67
+ itemType?: string | undefined;
68
+ itemID?: string | undefined;
69
+ itemRef?: string | undefined;
70
+ results?: number | undefined;
71
+ security?: string | undefined;
72
+ unselectable?: "on" | "off" | undefined;
73
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
74
+ is?: string | undefined;
75
+ exportparts?: string | undefined;
76
+ part?: string | undefined;
77
+ "aria-activedescendant"?: string | undefined;
78
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
79
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
80
+ "aria-braillelabel"?: string | undefined;
81
+ "aria-brailleroledescription"?: string | undefined;
82
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
83
+ "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
84
+ "aria-colcount"?: number | undefined;
85
+ "aria-colindex"?: number | undefined;
86
+ "aria-colindextext"?: string | undefined;
87
+ "aria-colspan"?: number | undefined;
88
+ "aria-controls"?: string | undefined;
89
+ "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
90
+ "aria-describedby"?: string | undefined;
91
+ "aria-description"?: string | undefined;
92
+ "aria-details"?: string | undefined;
93
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
94
+ "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
95
+ "aria-errormessage"?: string | undefined;
96
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
97
+ "aria-flowto"?: string | undefined;
98
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
99
+ "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
100
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
101
+ "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
102
+ "aria-keyshortcuts"?: string | undefined;
103
+ "aria-label"?: string | undefined;
104
+ "aria-labelledby"?: string | undefined;
105
+ "aria-level"?: number | undefined;
106
+ "aria-live"?: "off" | "assertive" | "polite" | undefined;
107
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
108
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
109
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
110
+ "aria-orientation"?: "horizontal" | "vertical" | undefined;
111
+ "aria-owns"?: string | undefined;
112
+ "aria-placeholder"?: string | undefined;
113
+ "aria-posinset"?: number | undefined;
114
+ "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
115
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
116
+ "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
117
+ "aria-required"?: (boolean | "true" | "false") | undefined;
118
+ "aria-roledescription"?: string | undefined;
119
+ "aria-rowcount"?: number | undefined;
120
+ "aria-rowindex"?: number | undefined;
121
+ "aria-rowindextext"?: string | undefined;
122
+ "aria-rowspan"?: number | undefined;
123
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
124
+ "aria-setsize"?: number | undefined;
125
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
126
+ "aria-valuemax"?: number | undefined;
127
+ "aria-valuemin"?: number | undefined;
128
+ "aria-valuenow"?: number | undefined;
129
+ "aria-valuetext"?: string | undefined;
130
+ dangerouslySetInnerHTML?: {
131
+ __html: string | TrustedHTML;
132
+ } | undefined;
133
+ onCopy?: React.ClipboardEventHandler<HTMLElement> | undefined;
134
+ onCopyCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
135
+ onCut?: React.ClipboardEventHandler<HTMLElement> | undefined;
136
+ onCutCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
137
+ onPaste?: React.ClipboardEventHandler<HTMLElement> | undefined;
138
+ onPasteCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
139
+ onCompositionEnd?: React.CompositionEventHandler<HTMLElement> | undefined;
140
+ onCompositionEndCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
141
+ onCompositionStart?: React.CompositionEventHandler<HTMLElement> | undefined;
142
+ onCompositionStartCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
143
+ onCompositionUpdate?: React.CompositionEventHandler<HTMLElement> | undefined;
144
+ onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
145
+ onFocus?: React.FocusEventHandler<HTMLElement> | undefined;
146
+ onFocusCapture?: React.FocusEventHandler<HTMLElement> | undefined;
147
+ onBlur?: React.FocusEventHandler<HTMLElement> | undefined;
148
+ onBlurCapture?: React.FocusEventHandler<HTMLElement> | undefined;
149
+ onChange?: React.FormEventHandler<HTMLElement> | undefined;
150
+ onChangeCapture?: React.FormEventHandler<HTMLElement> | undefined;
151
+ onBeforeInput?: React.InputEventHandler<HTMLElement> | undefined;
152
+ onBeforeInputCapture?: React.FormEventHandler<HTMLElement> | undefined;
153
+ onInput?: React.FormEventHandler<HTMLElement> | undefined;
154
+ onInputCapture?: React.FormEventHandler<HTMLElement> | undefined;
155
+ onReset?: React.FormEventHandler<HTMLElement> | undefined;
156
+ onResetCapture?: React.FormEventHandler<HTMLElement> | undefined;
157
+ onSubmit?: React.FormEventHandler<HTMLElement> | undefined;
158
+ onSubmitCapture?: React.FormEventHandler<HTMLElement> | undefined;
159
+ onInvalid?: React.FormEventHandler<HTMLElement> | undefined;
160
+ onInvalidCapture?: React.FormEventHandler<HTMLElement> | undefined;
161
+ onLoad?: React.ReactEventHandler<HTMLElement> | undefined;
162
+ onLoadCapture?: React.ReactEventHandler<HTMLElement> | undefined;
163
+ onError?: React.ReactEventHandler<HTMLElement> | undefined;
164
+ onErrorCapture?: React.ReactEventHandler<HTMLElement> | undefined;
165
+ onKeyDown?: React.KeyboardEventHandler<HTMLElement> | undefined;
166
+ onKeyDownCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
167
+ onKeyPress?: React.KeyboardEventHandler<HTMLElement> | undefined;
168
+ onKeyPressCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
169
+ onKeyUp?: React.KeyboardEventHandler<HTMLElement> | undefined;
170
+ onKeyUpCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
171
+ onAbort?: React.ReactEventHandler<HTMLElement> | undefined;
172
+ onAbortCapture?: React.ReactEventHandler<HTMLElement> | undefined;
173
+ onCanPlay?: React.ReactEventHandler<HTMLElement> | undefined;
174
+ onCanPlayCapture?: React.ReactEventHandler<HTMLElement> | undefined;
175
+ onCanPlayThrough?: React.ReactEventHandler<HTMLElement> | undefined;
176
+ onCanPlayThroughCapture?: React.ReactEventHandler<HTMLElement> | undefined;
177
+ onDurationChange?: React.ReactEventHandler<HTMLElement> | undefined;
178
+ onDurationChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
179
+ onEmptied?: React.ReactEventHandler<HTMLElement> | undefined;
180
+ onEmptiedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
181
+ onEncrypted?: React.ReactEventHandler<HTMLElement> | undefined;
182
+ onEncryptedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
183
+ onEnded?: React.ReactEventHandler<HTMLElement> | undefined;
184
+ onEndedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
185
+ onLoadedData?: React.ReactEventHandler<HTMLElement> | undefined;
186
+ onLoadedDataCapture?: React.ReactEventHandler<HTMLElement> | undefined;
187
+ onLoadedMetadata?: React.ReactEventHandler<HTMLElement> | undefined;
188
+ onLoadedMetadataCapture?: React.ReactEventHandler<HTMLElement> | undefined;
189
+ onLoadStart?: React.ReactEventHandler<HTMLElement> | undefined;
190
+ onLoadStartCapture?: React.ReactEventHandler<HTMLElement> | undefined;
191
+ onPause?: React.ReactEventHandler<HTMLElement> | undefined;
192
+ onPauseCapture?: React.ReactEventHandler<HTMLElement> | undefined;
193
+ onPlay?: React.ReactEventHandler<HTMLElement> | undefined;
194
+ onPlayCapture?: React.ReactEventHandler<HTMLElement> | undefined;
195
+ onPlaying?: React.ReactEventHandler<HTMLElement> | undefined;
196
+ onPlayingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
197
+ onProgress?: React.ReactEventHandler<HTMLElement> | undefined;
198
+ onProgressCapture?: React.ReactEventHandler<HTMLElement> | undefined;
199
+ onRateChange?: React.ReactEventHandler<HTMLElement> | undefined;
200
+ onRateChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
201
+ onSeeked?: React.ReactEventHandler<HTMLElement> | undefined;
202
+ onSeekedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
203
+ onSeeking?: React.ReactEventHandler<HTMLElement> | undefined;
204
+ onSeekingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
205
+ onStalled?: React.ReactEventHandler<HTMLElement> | undefined;
206
+ onStalledCapture?: React.ReactEventHandler<HTMLElement> | undefined;
207
+ onSuspend?: React.ReactEventHandler<HTMLElement> | undefined;
208
+ onSuspendCapture?: React.ReactEventHandler<HTMLElement> | undefined;
209
+ onTimeUpdate?: React.ReactEventHandler<HTMLElement> | undefined;
210
+ onTimeUpdateCapture?: React.ReactEventHandler<HTMLElement> | undefined;
211
+ onVolumeChange?: React.ReactEventHandler<HTMLElement> | undefined;
212
+ onVolumeChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
213
+ onWaiting?: React.ReactEventHandler<HTMLElement> | undefined;
214
+ onWaitingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
215
+ onAuxClick?: React.MouseEventHandler<HTMLElement> | undefined;
216
+ onAuxClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
217
+ onClick?: React.MouseEventHandler<HTMLElement> | undefined;
218
+ onClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
219
+ onContextMenu?: React.MouseEventHandler<HTMLElement> | undefined;
220
+ onContextMenuCapture?: React.MouseEventHandler<HTMLElement> | undefined;
221
+ onDoubleClick?: React.MouseEventHandler<HTMLElement> | undefined;
222
+ onDoubleClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
223
+ onDrag?: React.DragEventHandler<HTMLElement> | undefined;
224
+ onDragCapture?: React.DragEventHandler<HTMLElement> | undefined;
225
+ onDragEnd?: React.DragEventHandler<HTMLElement> | undefined;
226
+ onDragEndCapture?: React.DragEventHandler<HTMLElement> | undefined;
227
+ onDragEnter?: React.DragEventHandler<HTMLElement> | undefined;
228
+ onDragEnterCapture?: React.DragEventHandler<HTMLElement> | undefined;
229
+ onDragExit?: React.DragEventHandler<HTMLElement> | undefined;
230
+ onDragExitCapture?: React.DragEventHandler<HTMLElement> | undefined;
231
+ onDragLeave?: React.DragEventHandler<HTMLElement> | undefined;
232
+ onDragLeaveCapture?: React.DragEventHandler<HTMLElement> | undefined;
233
+ onDragOver?: React.DragEventHandler<HTMLElement> | undefined;
234
+ onDragOverCapture?: React.DragEventHandler<HTMLElement> | undefined;
235
+ onDragStart?: React.DragEventHandler<HTMLElement> | undefined;
236
+ onDragStartCapture?: React.DragEventHandler<HTMLElement> | undefined;
237
+ onDrop?: React.DragEventHandler<HTMLElement> | undefined;
238
+ onDropCapture?: React.DragEventHandler<HTMLElement> | undefined;
239
+ onMouseDown?: React.MouseEventHandler<HTMLElement> | undefined;
240
+ onMouseDownCapture?: React.MouseEventHandler<HTMLElement> | undefined;
241
+ onMouseEnter?: React.MouseEventHandler<HTMLElement> | undefined;
242
+ onMouseLeave?: React.MouseEventHandler<HTMLElement> | undefined;
243
+ onMouseMove?: React.MouseEventHandler<HTMLElement> | undefined;
244
+ onMouseMoveCapture?: React.MouseEventHandler<HTMLElement> | undefined;
245
+ onMouseOut?: React.MouseEventHandler<HTMLElement> | undefined;
246
+ onMouseOutCapture?: React.MouseEventHandler<HTMLElement> | undefined;
247
+ onMouseOver?: React.MouseEventHandler<HTMLElement> | undefined;
248
+ onMouseOverCapture?: React.MouseEventHandler<HTMLElement> | undefined;
249
+ onMouseUp?: React.MouseEventHandler<HTMLElement> | undefined;
250
+ onMouseUpCapture?: React.MouseEventHandler<HTMLElement> | undefined;
251
+ onSelect?: React.ReactEventHandler<HTMLElement> | undefined;
252
+ onSelectCapture?: React.ReactEventHandler<HTMLElement> | undefined;
253
+ onTouchCancel?: React.TouchEventHandler<HTMLElement> | undefined;
254
+ onTouchCancelCapture?: React.TouchEventHandler<HTMLElement> | undefined;
255
+ onTouchEnd?: React.TouchEventHandler<HTMLElement> | undefined;
256
+ onTouchEndCapture?: React.TouchEventHandler<HTMLElement> | undefined;
257
+ onTouchMove?: React.TouchEventHandler<HTMLElement> | undefined;
258
+ onTouchMoveCapture?: React.TouchEventHandler<HTMLElement> | undefined;
259
+ onTouchStart?: React.TouchEventHandler<HTMLElement> | undefined;
260
+ onTouchStartCapture?: React.TouchEventHandler<HTMLElement> | undefined;
261
+ onPointerDown?: React.PointerEventHandler<HTMLElement> | undefined;
262
+ onPointerDownCapture?: React.PointerEventHandler<HTMLElement> | undefined;
263
+ onPointerMove?: React.PointerEventHandler<HTMLElement> | undefined;
264
+ onPointerMoveCapture?: React.PointerEventHandler<HTMLElement> | undefined;
265
+ onPointerUp?: React.PointerEventHandler<HTMLElement> | undefined;
266
+ onPointerUpCapture?: React.PointerEventHandler<HTMLElement> | undefined;
267
+ onPointerCancel?: React.PointerEventHandler<HTMLElement> | undefined;
268
+ onPointerCancelCapture?: React.PointerEventHandler<HTMLElement> | undefined;
269
+ onPointerEnter?: React.PointerEventHandler<HTMLElement> | undefined;
270
+ onPointerLeave?: React.PointerEventHandler<HTMLElement> | undefined;
271
+ onPointerOver?: React.PointerEventHandler<HTMLElement> | undefined;
272
+ onPointerOverCapture?: React.PointerEventHandler<HTMLElement> | undefined;
273
+ onPointerOut?: React.PointerEventHandler<HTMLElement> | undefined;
274
+ onPointerOutCapture?: React.PointerEventHandler<HTMLElement> | undefined;
275
+ onGotPointerCapture?: React.PointerEventHandler<HTMLElement> | undefined;
276
+ onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLElement> | undefined;
277
+ onLostPointerCapture?: React.PointerEventHandler<HTMLElement> | undefined;
278
+ onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLElement> | undefined;
279
+ onScroll?: React.UIEventHandler<HTMLElement> | undefined;
280
+ onScrollCapture?: React.UIEventHandler<HTMLElement> | undefined;
281
+ onWheel?: React.WheelEventHandler<HTMLElement> | undefined;
282
+ onWheelCapture?: React.WheelEventHandler<HTMLElement> | undefined;
283
+ onAnimationStart?: React.AnimationEventHandler<HTMLElement> | undefined;
284
+ onAnimationStartCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
285
+ onAnimationEnd?: React.AnimationEventHandler<HTMLElement> | undefined;
286
+ onAnimationEndCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
287
+ onAnimationIteration?: React.AnimationEventHandler<HTMLElement> | undefined;
288
+ onAnimationIterationCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
289
+ onTransitionEnd?: React.TransitionEventHandler<HTMLElement> | undefined;
290
+ onTransitionEndCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
291
+ className: string;
292
+ }, HTMLElement>;
293
+ displayName: string;
294
+ };
295
+
296
+ /**
297
+ * Combines class names with Tailwind CSS conflict resolution
298
+ *
299
+ * @example
300
+ * mergeStyles('px-2 py-1', 'px-4') // => 'py-1 px-4'
301
+ * mergeStyles('text-red-500', condition && 'text-blue-500')
302
+ */
303
+ declare function mergeStyles(...inputs: ClassValue[]): string;
304
+
305
+ export { type FixedSize, Text, type TextProps, type TextSize, type TextVariant, mergeStyles };
package/dist/index.js CHANGED
@@ -1,2 +1,283 @@
1
1
  'use strict';
2
2
 
3
+ var React = require('react');
4
+ var clsx = require('clsx');
5
+ var tailwindMerge = require('tailwind-merge');
6
+
7
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
8
+
9
+ var React__default = /*#__PURE__*/_interopDefault(React);
10
+
11
+ // src/components/Text/Text.tsx
12
+
13
+ // src/components/Text/Text.styles.ts
14
+ var colorClasses = {
15
+ "gray-50": "text-gray-50",
16
+ "gray-100": "text-gray-100",
17
+ "gray-200": "text-gray-200",
18
+ "gray-300": "text-gray-300",
19
+ "gray-400": "text-gray-400",
20
+ "gray-500": "text-gray-500",
21
+ "gray-600": "text-gray-600",
22
+ "gray-700": "text-gray-700",
23
+ "gray-800": "text-gray-800",
24
+ "gray-900": "text-gray-900",
25
+ "blue-50": "text-blue-50",
26
+ "blue-500": "text-blue-500",
27
+ "blue-700": "text-blue-700",
28
+ "red-100": "text-red-100",
29
+ "red-400": "text-red-400",
30
+ white: "text-white-main",
31
+ black: "text-black-main"
32
+ };
33
+ var variantStyles = {
34
+ caption: {
35
+ sm: {
36
+ normal: {
37
+ fontSize: "text-12",
38
+ lineHeight: "leading-normal",
39
+ fontWeight: "font-regular"
40
+ },
41
+ point: {
42
+ fontSize: "text-12",
43
+ lineHeight: "leading-normal",
44
+ fontWeight: "font-semibold"
45
+ }
46
+ },
47
+ md: {
48
+ normal: {
49
+ fontSize: "text-14",
50
+ lineHeight: "leading-normal",
51
+ fontWeight: "font-medium"
52
+ },
53
+ point: {
54
+ fontSize: "text-14",
55
+ lineHeight: "leading-normal",
56
+ fontWeight: "font-semibold"
57
+ }
58
+ }
59
+ },
60
+ body2: {
61
+ sm: {
62
+ normal: {
63
+ fontSize: "text-14",
64
+ lineHeight: "leading-normal",
65
+ fontWeight: "font-regular"
66
+ },
67
+ point: {
68
+ fontSize: "text-14",
69
+ lineHeight: "leading-normal",
70
+ fontWeight: "font-semibold"
71
+ }
72
+ },
73
+ md: {
74
+ normal: {
75
+ fontSize: "text-16",
76
+ lineHeight: "leading-normal",
77
+ fontWeight: "font-medium"
78
+ },
79
+ point: {
80
+ fontSize: "text-16",
81
+ lineHeight: "leading-normal",
82
+ fontWeight: "font-semibold"
83
+ }
84
+ }
85
+ },
86
+ body: {
87
+ sm: {
88
+ normal: {
89
+ fontSize: "text-16",
90
+ lineHeight: "leading-tight",
91
+ fontWeight: "font-regular"
92
+ },
93
+ point: {
94
+ fontSize: "text-16",
95
+ lineHeight: "leading-normal",
96
+ fontWeight: "font-bold"
97
+ }
98
+ },
99
+ md: {
100
+ normal: {
101
+ fontSize: "text-18",
102
+ lineHeight: "leading-normal",
103
+ fontWeight: "font-medium"
104
+ },
105
+ point: {
106
+ fontSize: "text-18",
107
+ lineHeight: "leading-normal",
108
+ fontWeight: "font-bold"
109
+ }
110
+ }
111
+ },
112
+ subtitle: {
113
+ sm: {
114
+ normal: {
115
+ fontSize: "text-18",
116
+ lineHeight: "leading-normal",
117
+ fontWeight: "font-medium"
118
+ },
119
+ point: {
120
+ fontSize: "text-18",
121
+ lineHeight: "leading-normal",
122
+ fontWeight: "font-bold"
123
+ }
124
+ },
125
+ md: {
126
+ normal: {
127
+ fontSize: "text-20",
128
+ lineHeight: "leading-normal",
129
+ fontWeight: "font-medium"
130
+ },
131
+ point: {
132
+ fontSize: "text-20",
133
+ lineHeight: "leading-normal",
134
+ fontWeight: "font-bold"
135
+ }
136
+ }
137
+ },
138
+ title: {
139
+ sm: {
140
+ normal: {
141
+ fontSize: "text-22",
142
+ lineHeight: "leading-normal",
143
+ fontWeight: "font-bold"
144
+ },
145
+ point: {
146
+ fontSize: "text-22",
147
+ lineHeight: "leading-normal",
148
+ fontWeight: "font-bold"
149
+ }
150
+ },
151
+ md: {
152
+ normal: {
153
+ fontSize: "text-32",
154
+ lineHeight: "leading-normal",
155
+ fontWeight: "font-bold"
156
+ },
157
+ point: {
158
+ fontSize: "text-32",
159
+ lineHeight: "leading-normal",
160
+ fontWeight: "font-bold"
161
+ }
162
+ }
163
+ },
164
+ head: {
165
+ sm: {
166
+ normal: {
167
+ fontSize: "text-30",
168
+ lineHeight: "leading-normal",
169
+ fontWeight: "font-bold"
170
+ },
171
+ point: {
172
+ fontSize: "text-30",
173
+ lineHeight: "leading-normal",
174
+ fontWeight: "font-bold"
175
+ }
176
+ },
177
+ md: {
178
+ normal: {
179
+ fontSize: "text-48",
180
+ lineHeight: "leading-normal",
181
+ fontWeight: "font-bold"
182
+ },
183
+ point: {
184
+ fontSize: "text-48",
185
+ lineHeight: "leading-normal",
186
+ fontWeight: "font-bold"
187
+ }
188
+ }
189
+ }
190
+ };
191
+ var fixedStyles = {
192
+ 12: {
193
+ fontSize: "text-12",
194
+ lineHeight: "leading-normal",
195
+ fontWeight: "font-medium"
196
+ },
197
+ 14: {
198
+ fontSize: "text-14",
199
+ lineHeight: "leading-normal",
200
+ fontWeight: "font-medium"
201
+ },
202
+ 15: {
203
+ fontSize: "text-15",
204
+ lineHeight: "leading-normal",
205
+ fontWeight: "font-semibold"
206
+ },
207
+ 16: {
208
+ fontSize: "text-16",
209
+ lineHeight: "leading-normal",
210
+ fontWeight: "font-medium"
211
+ },
212
+ 18: {
213
+ fontSize: "text-18",
214
+ lineHeight: "leading-normal",
215
+ fontWeight: "font-medium"
216
+ },
217
+ 20: {
218
+ fontSize: "text-20",
219
+ lineHeight: "leading-normal",
220
+ fontWeight: "font-semibold"
221
+ },
222
+ 24: {
223
+ fontSize: "text-24",
224
+ lineHeight: "leading-normal",
225
+ fontWeight: "font-bold"
226
+ }
227
+ };
228
+ function textStyles({
229
+ variant,
230
+ size,
231
+ fixedSize,
232
+ point,
233
+ color
234
+ }) {
235
+ const baseStyles = "font-sans";
236
+ const colorClass = colorClasses[color];
237
+ let config;
238
+ if (variant === "fixed" && fixedSize) {
239
+ config = fixedStyles[fixedSize];
240
+ } else if (variant !== "fixed") {
241
+ const variantConfig = variantStyles[variant][size];
242
+ config = point ? variantConfig.point : variantConfig.normal;
243
+ } else {
244
+ config = fixedStyles[16];
245
+ }
246
+ return `${baseStyles} ${colorClass} ${config.fontSize} ${config.lineHeight} ${config.fontWeight}`.trim();
247
+ }
248
+ function mergeStyles(...inputs) {
249
+ return tailwindMerge.twMerge(clsx.clsx(inputs));
250
+ }
251
+
252
+ // src/components/Text/Text.tsx
253
+ var Text = ({
254
+ variant = "body",
255
+ size = "sm",
256
+ fixedSize,
257
+ point = false,
258
+ color = "gray-700",
259
+ as: Component = "span",
260
+ children,
261
+ className = "",
262
+ ...props
263
+ }) => {
264
+ const classes = textStyles({
265
+ variant,
266
+ size,
267
+ fixedSize,
268
+ point,
269
+ color
270
+ });
271
+ return React__default.default.createElement(
272
+ Component,
273
+ {
274
+ className: mergeStyles(classes, className),
275
+ ...props
276
+ },
277
+ children
278
+ );
279
+ };
280
+ Text.displayName = "Text";
281
+
282
+ exports.Text = Text;
283
+ exports.mergeStyles = mergeStyles;
package/dist/index.mjs CHANGED
@@ -1 +1,276 @@
1
+ import React from 'react';
2
+ import { clsx } from 'clsx';
3
+ import { twMerge } from 'tailwind-merge';
1
4
 
5
+ // src/components/Text/Text.tsx
6
+
7
+ // src/components/Text/Text.styles.ts
8
+ var colorClasses = {
9
+ "gray-50": "text-gray-50",
10
+ "gray-100": "text-gray-100",
11
+ "gray-200": "text-gray-200",
12
+ "gray-300": "text-gray-300",
13
+ "gray-400": "text-gray-400",
14
+ "gray-500": "text-gray-500",
15
+ "gray-600": "text-gray-600",
16
+ "gray-700": "text-gray-700",
17
+ "gray-800": "text-gray-800",
18
+ "gray-900": "text-gray-900",
19
+ "blue-50": "text-blue-50",
20
+ "blue-500": "text-blue-500",
21
+ "blue-700": "text-blue-700",
22
+ "red-100": "text-red-100",
23
+ "red-400": "text-red-400",
24
+ white: "text-white-main",
25
+ black: "text-black-main"
26
+ };
27
+ var variantStyles = {
28
+ caption: {
29
+ sm: {
30
+ normal: {
31
+ fontSize: "text-12",
32
+ lineHeight: "leading-normal",
33
+ fontWeight: "font-regular"
34
+ },
35
+ point: {
36
+ fontSize: "text-12",
37
+ lineHeight: "leading-normal",
38
+ fontWeight: "font-semibold"
39
+ }
40
+ },
41
+ md: {
42
+ normal: {
43
+ fontSize: "text-14",
44
+ lineHeight: "leading-normal",
45
+ fontWeight: "font-medium"
46
+ },
47
+ point: {
48
+ fontSize: "text-14",
49
+ lineHeight: "leading-normal",
50
+ fontWeight: "font-semibold"
51
+ }
52
+ }
53
+ },
54
+ body2: {
55
+ sm: {
56
+ normal: {
57
+ fontSize: "text-14",
58
+ lineHeight: "leading-normal",
59
+ fontWeight: "font-regular"
60
+ },
61
+ point: {
62
+ fontSize: "text-14",
63
+ lineHeight: "leading-normal",
64
+ fontWeight: "font-semibold"
65
+ }
66
+ },
67
+ md: {
68
+ normal: {
69
+ fontSize: "text-16",
70
+ lineHeight: "leading-normal",
71
+ fontWeight: "font-medium"
72
+ },
73
+ point: {
74
+ fontSize: "text-16",
75
+ lineHeight: "leading-normal",
76
+ fontWeight: "font-semibold"
77
+ }
78
+ }
79
+ },
80
+ body: {
81
+ sm: {
82
+ normal: {
83
+ fontSize: "text-16",
84
+ lineHeight: "leading-tight",
85
+ fontWeight: "font-regular"
86
+ },
87
+ point: {
88
+ fontSize: "text-16",
89
+ lineHeight: "leading-normal",
90
+ fontWeight: "font-bold"
91
+ }
92
+ },
93
+ md: {
94
+ normal: {
95
+ fontSize: "text-18",
96
+ lineHeight: "leading-normal",
97
+ fontWeight: "font-medium"
98
+ },
99
+ point: {
100
+ fontSize: "text-18",
101
+ lineHeight: "leading-normal",
102
+ fontWeight: "font-bold"
103
+ }
104
+ }
105
+ },
106
+ subtitle: {
107
+ sm: {
108
+ normal: {
109
+ fontSize: "text-18",
110
+ lineHeight: "leading-normal",
111
+ fontWeight: "font-medium"
112
+ },
113
+ point: {
114
+ fontSize: "text-18",
115
+ lineHeight: "leading-normal",
116
+ fontWeight: "font-bold"
117
+ }
118
+ },
119
+ md: {
120
+ normal: {
121
+ fontSize: "text-20",
122
+ lineHeight: "leading-normal",
123
+ fontWeight: "font-medium"
124
+ },
125
+ point: {
126
+ fontSize: "text-20",
127
+ lineHeight: "leading-normal",
128
+ fontWeight: "font-bold"
129
+ }
130
+ }
131
+ },
132
+ title: {
133
+ sm: {
134
+ normal: {
135
+ fontSize: "text-22",
136
+ lineHeight: "leading-normal",
137
+ fontWeight: "font-bold"
138
+ },
139
+ point: {
140
+ fontSize: "text-22",
141
+ lineHeight: "leading-normal",
142
+ fontWeight: "font-bold"
143
+ }
144
+ },
145
+ md: {
146
+ normal: {
147
+ fontSize: "text-32",
148
+ lineHeight: "leading-normal",
149
+ fontWeight: "font-bold"
150
+ },
151
+ point: {
152
+ fontSize: "text-32",
153
+ lineHeight: "leading-normal",
154
+ fontWeight: "font-bold"
155
+ }
156
+ }
157
+ },
158
+ head: {
159
+ sm: {
160
+ normal: {
161
+ fontSize: "text-30",
162
+ lineHeight: "leading-normal",
163
+ fontWeight: "font-bold"
164
+ },
165
+ point: {
166
+ fontSize: "text-30",
167
+ lineHeight: "leading-normal",
168
+ fontWeight: "font-bold"
169
+ }
170
+ },
171
+ md: {
172
+ normal: {
173
+ fontSize: "text-48",
174
+ lineHeight: "leading-normal",
175
+ fontWeight: "font-bold"
176
+ },
177
+ point: {
178
+ fontSize: "text-48",
179
+ lineHeight: "leading-normal",
180
+ fontWeight: "font-bold"
181
+ }
182
+ }
183
+ }
184
+ };
185
+ var fixedStyles = {
186
+ 12: {
187
+ fontSize: "text-12",
188
+ lineHeight: "leading-normal",
189
+ fontWeight: "font-medium"
190
+ },
191
+ 14: {
192
+ fontSize: "text-14",
193
+ lineHeight: "leading-normal",
194
+ fontWeight: "font-medium"
195
+ },
196
+ 15: {
197
+ fontSize: "text-15",
198
+ lineHeight: "leading-normal",
199
+ fontWeight: "font-semibold"
200
+ },
201
+ 16: {
202
+ fontSize: "text-16",
203
+ lineHeight: "leading-normal",
204
+ fontWeight: "font-medium"
205
+ },
206
+ 18: {
207
+ fontSize: "text-18",
208
+ lineHeight: "leading-normal",
209
+ fontWeight: "font-medium"
210
+ },
211
+ 20: {
212
+ fontSize: "text-20",
213
+ lineHeight: "leading-normal",
214
+ fontWeight: "font-semibold"
215
+ },
216
+ 24: {
217
+ fontSize: "text-24",
218
+ lineHeight: "leading-normal",
219
+ fontWeight: "font-bold"
220
+ }
221
+ };
222
+ function textStyles({
223
+ variant,
224
+ size,
225
+ fixedSize,
226
+ point,
227
+ color
228
+ }) {
229
+ const baseStyles = "font-sans";
230
+ const colorClass = colorClasses[color];
231
+ let config;
232
+ if (variant === "fixed" && fixedSize) {
233
+ config = fixedStyles[fixedSize];
234
+ } else if (variant !== "fixed") {
235
+ const variantConfig = variantStyles[variant][size];
236
+ config = point ? variantConfig.point : variantConfig.normal;
237
+ } else {
238
+ config = fixedStyles[16];
239
+ }
240
+ return `${baseStyles} ${colorClass} ${config.fontSize} ${config.lineHeight} ${config.fontWeight}`.trim();
241
+ }
242
+ function mergeStyles(...inputs) {
243
+ return twMerge(clsx(inputs));
244
+ }
245
+
246
+ // src/components/Text/Text.tsx
247
+ var Text = ({
248
+ variant = "body",
249
+ size = "sm",
250
+ fixedSize,
251
+ point = false,
252
+ color = "gray-700",
253
+ as: Component = "span",
254
+ children,
255
+ className = "",
256
+ ...props
257
+ }) => {
258
+ const classes = textStyles({
259
+ variant,
260
+ size,
261
+ fixedSize,
262
+ point,
263
+ color
264
+ });
265
+ return React.createElement(
266
+ Component,
267
+ {
268
+ className: mergeStyles(classes, className),
269
+ ...props
270
+ },
271
+ children
272
+ );
273
+ };
274
+ Text.displayName = "Text";
275
+
276
+ export { Text, mergeStyles };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@causw/core",
3
- "version": "0.0.6",
4
- "description": "Core utilities and logging for CAUSW Design System - CAU Software Community Service",
3
+ "version": "0.0.8",
4
+ "description": "Core components and utilities for CAUSW Design System - CAU Software Community Service",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
7
7
  "types": "dist/index.d.ts",
@@ -10,11 +10,25 @@
10
10
  "types": "./dist/index.d.ts",
11
11
  "import": "./dist/index.mjs",
12
12
  "require": "./dist/index.js"
13
+ },
14
+ "./styles": {
15
+ "import": "./src/styles/global.css",
16
+ "require": "./src/styles/global.css"
13
17
  }
14
18
  },
15
19
  "files": [
16
- "dist"
20
+ "dist",
21
+ "src/styles"
17
22
  ],
23
+ "dependencies": {
24
+ "clsx": "^2.1.1",
25
+ "tailwind-merge": "^3.4.0",
26
+ "@causw/icons": "0.0.8",
27
+ "@causw/tokens": "0.0.9"
28
+ },
29
+ "peerDependencies": {
30
+ "react": ">=18"
31
+ },
18
32
  "repository": {
19
33
  "type": "git",
20
34
  "url": "https://github.com/CAUCSE/CAUSW-frontend-design-system",
@@ -26,8 +40,8 @@
26
40
  },
27
41
  "sideEffects": false,
28
42
  "scripts": {
29
- "build": "tsup src/index.ts --format cjs,esm --dts --treeshake",
30
- "dev": "tsup src/index.ts --format cjs,esm --dts --watch",
43
+ "build": "tsup src/index.ts --format cjs,esm --dts --external react --treeshake",
44
+ "dev": "tsup src/index.ts --format cjs,esm --dts --external react --watch",
31
45
  "lint": "eslint src"
32
46
  }
33
47
  }
package/src/styles/global.css ADDED
@@ -0,0 +1,3 @@
1
+ @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css');
2
+ @import 'tailwindcss';
3
+ @config '@causw/tokens/config';