@croquiscom/pds 0.31.0 → 0.32.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/assets/icons/Minus20.svg +3 -0
  3. package/dist/components/icons/generated/Minus20.d.ts +4 -0
  4. package/dist/components/icons/generated/index.d.ts +1 -0
  5. package/dist/components/index.d.ts +1 -0
  6. package/dist/components/tabs/LineTab.d.ts +17 -0
  7. package/dist/components/tabs/LineTabs.d.ts +560 -0
  8. package/dist/components/tabs/Tabs.stories.d.ts +9 -0
  9. package/dist/components/tabs/index.d.ts +2 -0
  10. package/dist/components/tabs/styles.d.ts +1 -0
  11. package/dist/index.es.js +2 -2
  12. package/dist/index.es.js.map +1 -1
  13. package/dist/index.js +2 -2
  14. package/dist/index.js.map +1 -1
  15. package/package.json +1 -1
  16. package/tools/svgr-icons-component-template.js +5 -5
  17. package/tools/svgr-images-component-template.js +4 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # @croquiscom/pds
2
2
 
3
+ ## 0.32.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 7c61bdf: LineTabs 컴포넌트 추가
8
+
9
+ ## 0.31.1
10
+
11
+ ### Patch Changes
12
+
13
+ - a619b73: IconMinus20 아이콘 추가
14
+
15
+ - IconButton 아이콘 사이즈 16 고정이 추가되었습니다.
16
+
3
17
  ## 0.31.0
4
18
 
5
19
  ### Minor Changes
package/assets/icons/Minus20.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M0 9H20V11H0V9Z" fill="#363644"/>
3
+ </svg>
package/dist/components/icons/generated/Minus20.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { IconProps } from '.';
3
+ declare const SvgMinus20: ({ size, color, secondaryColor, ...props }: IconProps) => JSX.Element;
4
+ export default SvgMinus20;
package/dist/components/icons/generated/index.d.ts CHANGED
@@ -105,6 +105,7 @@ export { default as IconMarketing24 } from './Marketing24';
105
105
  export { default as IconMegaphone14 } from './Megaphone14';
106
106
  export { default as IconMemoAttention20 } from './MemoAttention20';
107
107
  export { default as IconMemoDefault20 } from './MemoDefault20';
108
+ export { default as IconMinus20 } from './Minus20';
108
109
  export { default as IconMove10 } from './Move10';
109
110
  export { default as IconNew10 } from './New10';
110
111
  export { default as IconNotExposed16 } from './NotExposed16';
package/dist/components/index.d.ts CHANGED
@@ -21,3 +21,4 @@ export * from './bottom-sheet';
21
21
  export * from './modal';
22
22
  export * from './provider';
23
23
  export * from './banner';
24
+ export * from './tabs';
package/dist/components/tabs/LineTab.d.ts ADDED
@@ -0,0 +1,17 @@
1
+ import React, { HTMLAttributes, PropsWithChildren } from 'react';
2
+ import { TabWidth } from './LineTabs';
3
+ export interface LineTabProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick'> {
4
+ id: string;
5
+ onClick?: (id: string) => void;
6
+ }
7
+ export declare const LineTab: ({ id, onClick, className, children, ...props }: PropsWithChildren<LineTabProps>) => JSX.Element;
8
+ export declare const TabItemWrapper: import("@emotion/styled").StyledComponent<{
9
+ theme?: import("@emotion/react").Theme;
10
+ as?: React.ElementType<any>;
11
+ } & import("../stack").VStackProps & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
12
+ theme?: import("@emotion/react").Theme;
13
+ } & {
14
+ $width: TabWidth;
15
+ focused?: boolean;
16
+ selected: boolean;
17
+ }, {}, {}>;
package/dist/components/tabs/LineTabs.d.ts ADDED
@@ -0,0 +1,560 @@
1
+ import React, { PropsWithChildren } from 'react';
2
+ export type TabWidth = 'fill' | 'auto';
3
+ export type IndicatorStyle = {
4
+ left: number;
5
+ width: number;
6
+ };
7
+ export interface LineTabsContextProps {
8
+ width?: TabWidth;
9
+ activeTabId: string;
10
+ onChange?: (id: string) => void;
11
+ }
12
+ export declare const LineTabContext: React.Context<LineTabsContextProps>;
13
+ export declare const useLineTabContext: () => LineTabsContextProps;
14
+ export interface LineTabsProps {
15
+ className?: string;
16
+ /**
17
+ * @desc 'fill' 일경우 컨테이너 기준 Full Width 값, 'auto' 일경우 컨텐츠에 따라 자동 너비 계산됩니다.
18
+ * @default 'auto'
19
+ */
20
+ width?: TabWidth;
21
+ /**
22
+ * @desc width가 'auto' 일경우 탭아이템간 column-gap은 항상 0입니다.
23
+ * @default false
24
+ */
25
+ dense?: boolean;
26
+ activeTabId?: string;
27
+ onChange?: (id?: string) => void;
28
+ }
29
+ export declare const LineTabs: ({ className, children, dense, width, activeTabId, onChange, }: PropsWithChildren<LineTabsProps>) => JSX.Element;
30
+ export declare const TabContainer: import("@emotion/styled").StyledComponent<{
31
+ theme?: import("@emotion/react").Theme;
32
+ as?: React.ElementType<any>;
33
+ }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
34
+ export declare const InitialIndicator: import("@emotion/styled").StyledComponent<{
35
+ theme?: import("@emotion/react").Theme;
36
+ as?: React.ElementType<any>;
37
+ } & {
38
+ width: number;
39
+ }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
40
+ export declare const Indicator: import("@emotion/styled").StyledComponent<{
41
+ theme?: import("@emotion/react").Theme;
42
+ as?: React.ElementType<any>;
43
+ } & {
44
+ width: number;
45
+ } & {
46
+ id?: string;
47
+ color?: string;
48
+ translate?: "yes" | "no";
49
+ hidden?: boolean;
50
+ slot?: string;
51
+ title?: string;
52
+ dir?: string;
53
+ accessKey?: string;
54
+ draggable?: boolean | "false" | "true";
55
+ lang?: string;
56
+ className?: string;
57
+ prefix?: string;
58
+ role?: React.AriaRole;
59
+ children?: React.ReactNode;
60
+ contentEditable?: "inherit" | (boolean | "false" | "true");
61
+ inputMode?: "search" | "numeric" | "none" | "url" | "text" | "decimal" | "tel" | "email";
62
+ nonce?: string;
63
+ tabIndex?: number;
64
+ defaultChecked?: boolean;
65
+ defaultValue?: string | number | readonly string[];
66
+ suppressContentEditableWarning?: boolean;
67
+ suppressHydrationWarning?: boolean;
68
+ contextMenu?: string;
69
+ placeholder?: string;
70
+ spellCheck?: boolean | "false" | "true";
71
+ radioGroup?: string;
72
+ about?: string;
73
+ datatype?: string;
74
+ inlist?: any;
75
+ property?: string;
76
+ resource?: string;
77
+ typeof?: string;
78
+ vocab?: string;
79
+ autoCapitalize?: string;
80
+ autoCorrect?: string;
81
+ autoSave?: string;
82
+ itemProp?: string;
83
+ itemScope?: boolean;
84
+ itemType?: string;
85
+ itemID?: string;
86
+ itemRef?: string;
87
+ results?: number;
88
+ security?: string;
89
+ unselectable?: "on" | "off";
90
+ is?: string;
91
+ "aria-activedescendant"?: string;
92
+ "aria-atomic"?: boolean | "false" | "true";
93
+ "aria-autocomplete"?: "inline" | "both" | "none" | "list";
94
+ "aria-busy"?: boolean | "false" | "true";
95
+ "aria-checked"?: boolean | "false" | "mixed" | "true";
96
+ "aria-colcount"?: number;
97
+ "aria-colindex"?: number;
98
+ "aria-colspan"?: number;
99
+ "aria-controls"?: string;
100
+ "aria-current"?: boolean | "location" | "time" | "false" | "page" | "true" | "step" | "date";
101
+ "aria-describedby"?: string;
102
+ "aria-details"?: string;
103
+ "aria-disabled"?: boolean | "false" | "true";
104
+ "aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup";
105
+ "aria-errormessage"?: string;
106
+ "aria-expanded"?: boolean | "false" | "true";
107
+ "aria-flowto"?: string;
108
+ "aria-grabbed"?: boolean | "false" | "true";
109
+ "aria-haspopup"?: boolean | "grid" | "dialog" | "menu" | "false" | "listbox" | "true" | "tree";
110
+ "aria-hidden"?: boolean | "false" | "true";
111
+ "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling";
112
+ "aria-keyshortcuts"?: string;
113
+ "aria-label"?: string;
114
+ "aria-labelledby"?: string;
115
+ "aria-level"?: number;
116
+ "aria-live"?: "off" | "assertive" | "polite";
117
+ "aria-modal"?: boolean | "false" | "true";
118
+ "aria-multiline"?: boolean | "false" | "true";
119
+ "aria-multiselectable"?: boolean | "false" | "true";
120
+ "aria-orientation"?: "horizontal" | "vertical";
121
+ "aria-owns"?: string;
122
+ "aria-placeholder"?: string;
123
+ "aria-posinset"?: number;
124
+ "aria-pressed"?: boolean | "false" | "mixed" | "true";
125
+ "aria-readonly"?: boolean | "false" | "true";
126
+ "aria-relevant"?: "all" | "text" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
127
+ "aria-required"?: boolean | "false" | "true";
128
+ "aria-roledescription"?: string;
129
+ "aria-rowcount"?: number;
130
+ "aria-rowindex"?: number;
131
+ "aria-rowspan"?: number;
132
+ "aria-selected"?: boolean | "false" | "true";
133
+ "aria-setsize"?: number;
134
+ "aria-sort"?: "none" | "other" | "ascending" | "descending";
135
+ "aria-valuemax"?: number;
136
+ "aria-valuemin"?: number;
137
+ "aria-valuenow"?: number;
138
+ "aria-valuetext"?: string;
139
+ dangerouslySetInnerHTML?: {
140
+ __html: string;
141
+ };
142
+ onCopy?: React.ClipboardEventHandler<HTMLDivElement>;
143
+ onCopyCapture?: React.ClipboardEventHandler<HTMLDivElement>;
144
+ onCut?: React.ClipboardEventHandler<HTMLDivElement>;
145
+ onCutCapture?: React.ClipboardEventHandler<HTMLDivElement>;
146
+ onPaste?: React.ClipboardEventHandler<HTMLDivElement>;
147
+ onPasteCapture?: React.ClipboardEventHandler<HTMLDivElement>;
148
+ onCompositionEnd?: React.CompositionEventHandler<HTMLDivElement>;
149
+ onCompositionEndCapture?: React.CompositionEventHandler<HTMLDivElement>;
150
+ onCompositionStart?: React.CompositionEventHandler<HTMLDivElement>;
151
+ onCompositionStartCapture?: React.CompositionEventHandler<HTMLDivElement>;
152
+ onCompositionUpdate?: React.CompositionEventHandler<HTMLDivElement>;
153
+ onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLDivElement>;
154
+ onFocus?: React.FocusEventHandler<HTMLDivElement>;
155
+ onFocusCapture?: React.FocusEventHandler<HTMLDivElement>;
156
+ onBlur?: React.FocusEventHandler<HTMLDivElement>;
157
+ onBlurCapture?: React.FocusEventHandler<HTMLDivElement>;
158
+ onChange?: React.FormEventHandler<HTMLDivElement>;
159
+ onChangeCapture?: React.FormEventHandler<HTMLDivElement>;
160
+ onBeforeInput?: React.FormEventHandler<HTMLDivElement>;
161
+ onBeforeInputCapture?: React.FormEventHandler<HTMLDivElement>;
162
+ onInput?: React.FormEventHandler<HTMLDivElement>;
163
+ onInputCapture?: React.FormEventHandler<HTMLDivElement>;
164
+ onReset?: React.FormEventHandler<HTMLDivElement>;
165
+ onResetCapture?: React.FormEventHandler<HTMLDivElement>;
166
+ onSubmit?: React.FormEventHandler<HTMLDivElement>;
167
+ onSubmitCapture?: React.FormEventHandler<HTMLDivElement>;
168
+ onInvalid?: React.FormEventHandler<HTMLDivElement>;
169
+ onInvalidCapture?: React.FormEventHandler<HTMLDivElement>;
170
+ onLoad?: React.ReactEventHandler<HTMLDivElement>;
171
+ onLoadCapture?: React.ReactEventHandler<HTMLDivElement>;
172
+ onError?: React.ReactEventHandler<HTMLDivElement>;
173
+ onErrorCapture?: React.ReactEventHandler<HTMLDivElement>;
174
+ onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
175
+ onKeyDownCapture?: React.KeyboardEventHandler<HTMLDivElement>;
176
+ onKeyPress?: React.KeyboardEventHandler<HTMLDivElement>;
177
+ onKeyPressCapture?: React.KeyboardEventHandler<HTMLDivElement>;
178
+ onKeyUp?: React.KeyboardEventHandler<HTMLDivElement>;
179
+ onKeyUpCapture?: React.KeyboardEventHandler<HTMLDivElement>;
180
+ onAbort?: React.ReactEventHandler<HTMLDivElement>;
181
+ onAbortCapture?: React.ReactEventHandler<HTMLDivElement>;
182
+ onCanPlay?: React.ReactEventHandler<HTMLDivElement>;
183
+ onCanPlayCapture?: React.ReactEventHandler<HTMLDivElement>;
184
+ onCanPlayThrough?: React.ReactEventHandler<HTMLDivElement>;
185
+ onCanPlayThroughCapture?: React.ReactEventHandler<HTMLDivElement>;
186
+ onDurationChange?: React.ReactEventHandler<HTMLDivElement>;
187
+ onDurationChangeCapture?: React.ReactEventHandler<HTMLDivElement>;
188
+ onEmptied?: React.ReactEventHandler<HTMLDivElement>;
189
+ onEmptiedCapture?: React.ReactEventHandler<HTMLDivElement>;
190
+ onEncrypted?: React.ReactEventHandler<HTMLDivElement>;
191
+ onEncryptedCapture?: React.ReactEventHandler<HTMLDivElement>;
192
+ onEnded?: React.ReactEventHandler<HTMLDivElement>;
193
+ onEndedCapture?: React.ReactEventHandler<HTMLDivElement>;
194
+ onLoadedData?: React.ReactEventHandler<HTMLDivElement>;
195
+ onLoadedDataCapture?: React.ReactEventHandler<HTMLDivElement>;
196
+ onLoadedMetadata?: React.ReactEventHandler<HTMLDivElement>;
197
+ onLoadedMetadataCapture?: React.ReactEventHandler<HTMLDivElement>;
198
+ onLoadStart?: React.ReactEventHandler<HTMLDivElement>;
199
+ onLoadStartCapture?: React.ReactEventHandler<HTMLDivElement>;
200
+ onPause?: React.ReactEventHandler<HTMLDivElement>;
201
+ onPauseCapture?: React.ReactEventHandler<HTMLDivElement>;
202
+ onPlay?: React.ReactEventHandler<HTMLDivElement>;
203
+ onPlayCapture?: React.ReactEventHandler<HTMLDivElement>;
204
+ onPlaying?: React.ReactEventHandler<HTMLDivElement>;
205
+ onPlayingCapture?: React.ReactEventHandler<HTMLDivElement>;
206
+ onProgress?: React.ReactEventHandler<HTMLDivElement>;
207
+ onProgressCapture?: React.ReactEventHandler<HTMLDivElement>;
208
+ onRateChange?: React.ReactEventHandler<HTMLDivElement>;
209
+ onRateChangeCapture?: React.ReactEventHandler<HTMLDivElement>;
210
+ onResize?: React.ReactEventHandler<HTMLDivElement>;
211
+ onResizeCapture?: React.ReactEventHandler<HTMLDivElement>;
212
+ onSeeked?: React.ReactEventHandler<HTMLDivElement>;
213
+ onSeekedCapture?: React.ReactEventHandler<HTMLDivElement>;
214
+ onSeeking?: React.ReactEventHandler<HTMLDivElement>;
215
+ onSeekingCapture?: React.ReactEventHandler<HTMLDivElement>;
216
+ onStalled?: React.ReactEventHandler<HTMLDivElement>;
217
+ onStalledCapture?: React.ReactEventHandler<HTMLDivElement>;
218
+ onSuspend?: React.ReactEventHandler<HTMLDivElement>;
219
+ onSuspendCapture?: React.ReactEventHandler<HTMLDivElement>;
220
+ onTimeUpdate?: React.ReactEventHandler<HTMLDivElement>;
221
+ onTimeUpdateCapture?: React.ReactEventHandler<HTMLDivElement>;
222
+ onVolumeChange?: React.ReactEventHandler<HTMLDivElement>;
223
+ onVolumeChangeCapture?: React.ReactEventHandler<HTMLDivElement>;
224
+ onWaiting?: React.ReactEventHandler<HTMLDivElement>;
225
+ onWaitingCapture?: React.ReactEventHandler<HTMLDivElement>;
226
+ onAuxClick?: React.MouseEventHandler<HTMLDivElement>;
227
+ onAuxClickCapture?: React.MouseEventHandler<HTMLDivElement>;
228
+ onClick?: React.MouseEventHandler<HTMLDivElement>;
229
+ onClickCapture?: React.MouseEventHandler<HTMLDivElement>;
230
+ onContextMenu?: React.MouseEventHandler<HTMLDivElement>;
231
+ onContextMenuCapture?: React.MouseEventHandler<HTMLDivElement>;
232
+ onDoubleClick?: React.MouseEventHandler<HTMLDivElement>;
233
+ onDoubleClickCapture?: React.MouseEventHandler<HTMLDivElement>;
234
+ onDragCapture?: React.DragEventHandler<HTMLDivElement>;
235
+ onDragEndCapture?: React.DragEventHandler<HTMLDivElement>;
236
+ onDragEnter?: React.DragEventHandler<HTMLDivElement>;
237
+ onDragEnterCapture?: React.DragEventHandler<HTMLDivElement>;
238
+ onDragExit?: React.DragEventHandler<HTMLDivElement>;
239
+ onDragExitCapture?: React.DragEventHandler<HTMLDivElement>;
240
+ onDragLeave?: React.DragEventHandler<HTMLDivElement>;
241
+ onDragLeaveCapture?: React.DragEventHandler<HTMLDivElement>;
242
+ onDragOver?: React.DragEventHandler<HTMLDivElement>;
243
+ onDragOverCapture?: React.DragEventHandler<HTMLDivElement>;
244
+ onDragStartCapture?: React.DragEventHandler<HTMLDivElement>;
245
+ onDrop?: React.DragEventHandler<HTMLDivElement>;
246
+ onDropCapture?: React.DragEventHandler<HTMLDivElement>;
247
+ onMouseDown?: React.MouseEventHandler<HTMLDivElement>;
248
+ onMouseDownCapture?: React.MouseEventHandler<HTMLDivElement>;
249
+ onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
250
+ onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
251
+ onMouseMove?: React.MouseEventHandler<HTMLDivElement>;
252
+ onMouseMoveCapture?: React.MouseEventHandler<HTMLDivElement>;
253
+ onMouseOut?: React.MouseEventHandler<HTMLDivElement>;
254
+ onMouseOutCapture?: React.MouseEventHandler<HTMLDivElement>;
255
+ onMouseOver?: React.MouseEventHandler<HTMLDivElement>;
256
+ onMouseOverCapture?: React.MouseEventHandler<HTMLDivElement>;
257
+ onMouseUp?: React.MouseEventHandler<HTMLDivElement>;
258
+ onMouseUpCapture?: React.MouseEventHandler<HTMLDivElement>;
259
+ onSelect?: React.ReactEventHandler<HTMLDivElement>;
260
+ onSelectCapture?: React.ReactEventHandler<HTMLDivElement>;
261
+ onTouchCancel?: React.TouchEventHandler<HTMLDivElement>;
262
+ onTouchCancelCapture?: React.TouchEventHandler<HTMLDivElement>;
263
+ onTouchEnd?: React.TouchEventHandler<HTMLDivElement>;
264
+ onTouchEndCapture?: React.TouchEventHandler<HTMLDivElement>;
265
+ onTouchMove?: React.TouchEventHandler<HTMLDivElement>;
266
+ onTouchMoveCapture?: React.TouchEventHandler<HTMLDivElement>;
267
+ onTouchStart?: React.TouchEventHandler<HTMLDivElement>;
268
+ onTouchStartCapture?: React.TouchEventHandler<HTMLDivElement>;
269
+ onPointerDown?: React.PointerEventHandler<HTMLDivElement>;
270
+ onPointerDownCapture?: React.PointerEventHandler<HTMLDivElement>;
271
+ onPointerMove?: React.PointerEventHandler<HTMLDivElement>;
272
+ onPointerMoveCapture?: React.PointerEventHandler<HTMLDivElement>;
273
+ onPointerUp?: React.PointerEventHandler<HTMLDivElement>;
274
+ onPointerUpCapture?: React.PointerEventHandler<HTMLDivElement>;
275
+ onPointerCancel?: React.PointerEventHandler<HTMLDivElement>;
276
+ onPointerCancelCapture?: React.PointerEventHandler<HTMLDivElement>;
277
+ onPointerEnter?: React.PointerEventHandler<HTMLDivElement>;
278
+ onPointerEnterCapture?: React.PointerEventHandler<HTMLDivElement>;
279
+ onPointerLeave?: React.PointerEventHandler<HTMLDivElement>;
280
+ onPointerLeaveCapture?: React.PointerEventHandler<HTMLDivElement>;
281
+ onPointerOver?: React.PointerEventHandler<HTMLDivElement>;
282
+ onPointerOverCapture?: React.PointerEventHandler<HTMLDivElement>;
283
+ onPointerOut?: React.PointerEventHandler<HTMLDivElement>;
284
+ onPointerOutCapture?: React.PointerEventHandler<HTMLDivElement>;
285
+ onGotPointerCapture?: React.PointerEventHandler<HTMLDivElement>;
286
+ onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement>;
287
+ onLostPointerCapture?: React.PointerEventHandler<HTMLDivElement>;
288
+ onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement>;
289
+ onScroll?: React.UIEventHandler<HTMLDivElement>;
290
+ onScrollCapture?: React.UIEventHandler<HTMLDivElement>;
291
+ onWheel?: React.WheelEventHandler<HTMLDivElement>;
292
+ onWheelCapture?: React.WheelEventHandler<HTMLDivElement>;
293
+ onAnimationStartCapture?: React.AnimationEventHandler<HTMLDivElement>;
294
+ onAnimationEnd?: React.AnimationEventHandler<HTMLDivElement>;
295
+ onAnimationEndCapture?: React.AnimationEventHandler<HTMLDivElement>;
296
+ onAnimationIteration?: React.AnimationEventHandler<HTMLDivElement>;
297
+ onAnimationIterationCapture?: React.AnimationEventHandler<HTMLDivElement>;
298
+ onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement>;
299
+ onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement>;
300
+ } & import("framer-motion").MotionProps & React.RefAttributes<HTMLDivElement>, {}, {}>;
301
+ export declare const Mask: import("@emotion/styled").StyledComponent<{
302
+ id?: string;
303
+ color?: string;
304
+ translate?: "yes" | "no";
305
+ hidden?: boolean;
306
+ slot?: string;
307
+ title?: string;
308
+ dir?: string;
309
+ accessKey?: string;
310
+ draggable?: boolean | "false" | "true";
311
+ lang?: string;
312
+ className?: string;
313
+ prefix?: string;
314
+ role?: React.AriaRole;
315
+ children?: React.ReactNode;
316
+ contentEditable?: "inherit" | (boolean | "false" | "true");
317
+ inputMode?: "search" | "numeric" | "none" | "url" | "text" | "decimal" | "tel" | "email";
318
+ nonce?: string;
319
+ tabIndex?: number;
320
+ defaultChecked?: boolean;
321
+ defaultValue?: string | number | readonly string[];
322
+ suppressContentEditableWarning?: boolean;
323
+ suppressHydrationWarning?: boolean;
324
+ contextMenu?: string;
325
+ placeholder?: string;
326
+ spellCheck?: boolean | "false" | "true";
327
+ radioGroup?: string;
328
+ about?: string;
329
+ datatype?: string;
330
+ inlist?: any;
331
+ property?: string;
332
+ resource?: string;
333
+ typeof?: string;
334
+ vocab?: string;
335
+ autoCapitalize?: string;
336
+ autoCorrect?: string;
337
+ autoSave?: string;
338
+ itemProp?: string;
339
+ itemScope?: boolean;
340
+ itemType?: string;
341
+ itemID?: string;
342
+ itemRef?: string;
343
+ results?: number;
344
+ security?: string;
345
+ unselectable?: "on" | "off";
346
+ is?: string;
347
+ "aria-activedescendant"?: string;
348
+ "aria-atomic"?: boolean | "false" | "true";
349
+ "aria-autocomplete"?: "inline" | "both" | "none" | "list";
350
+ "aria-busy"?: boolean | "false" | "true";
351
+ "aria-checked"?: boolean | "false" | "mixed" | "true";
352
+ "aria-colcount"?: number;
353
+ "aria-colindex"?: number;
354
+ "aria-colspan"?: number;
355
+ "aria-controls"?: string;
356
+ "aria-current"?: boolean | "location" | "time" | "false" | "page" | "true" | "step" | "date";
357
+ "aria-describedby"?: string;
358
+ "aria-details"?: string;
359
+ "aria-disabled"?: boolean | "false" | "true";
360
+ "aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup";
361
+ "aria-errormessage"?: string;
362
+ "aria-expanded"?: boolean | "false" | "true";
363
+ "aria-flowto"?: string;
364
+ "aria-grabbed"?: boolean | "false" | "true";
365
+ "aria-haspopup"?: boolean | "grid" | "dialog" | "menu" | "false" | "listbox" | "true" | "tree";
366
+ "aria-hidden"?: boolean | "false" | "true";
367
+ "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling";
368
+ "aria-keyshortcuts"?: string;
369
+ "aria-label"?: string;
370
+ "aria-labelledby"?: string;
371
+ "aria-level"?: number;
372
+ "aria-live"?: "off" | "assertive" | "polite";
373
+ "aria-modal"?: boolean | "false" | "true";
374
+ "aria-multiline"?: boolean | "false" | "true";
375
+ "aria-multiselectable"?: boolean | "false" | "true";
376
+ "aria-orientation"?: "horizontal" | "vertical";
377
+ "aria-owns"?: string;
378
+ "aria-placeholder"?: string;
379
+ "aria-posinset"?: number;
380
+ "aria-pressed"?: boolean | "false" | "mixed" | "true";
381
+ "aria-readonly"?: boolean | "false" | "true";
382
+ "aria-relevant"?: "all" | "text" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
383
+ "aria-required"?: boolean | "false" | "true";
384
+ "aria-roledescription"?: string;
385
+ "aria-rowcount"?: number;
386
+ "aria-rowindex"?: number;
387
+ "aria-rowspan"?: number;
388
+ "aria-selected"?: boolean | "false" | "true";
389
+ "aria-setsize"?: number;
390
+ "aria-sort"?: "none" | "other" | "ascending" | "descending";
391
+ "aria-valuemax"?: number;
392
+ "aria-valuemin"?: number;
393
+ "aria-valuenow"?: number;
394
+ "aria-valuetext"?: string;
395
+ dangerouslySetInnerHTML?: {
396
+ __html: string;
397
+ };
398
+ onCopy?: React.ClipboardEventHandler<HTMLDivElement>;
399
+ onCopyCapture?: React.ClipboardEventHandler<HTMLDivElement>;
400
+ onCut?: React.ClipboardEventHandler<HTMLDivElement>;
401
+ onCutCapture?: React.ClipboardEventHandler<HTMLDivElement>;
402
+ onPaste?: React.ClipboardEventHandler<HTMLDivElement>;
403
+ onPasteCapture?: React.ClipboardEventHandler<HTMLDivElement>;
404
+ onCompositionEnd?: React.CompositionEventHandler<HTMLDivElement>;
405
+ onCompositionEndCapture?: React.CompositionEventHandler<HTMLDivElement>;
406
+ onCompositionStart?: React.CompositionEventHandler<HTMLDivElement>;
407
+ onCompositionStartCapture?: React.CompositionEventHandler<HTMLDivElement>;
408
+ onCompositionUpdate?: React.CompositionEventHandler<HTMLDivElement>;
409
+ onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLDivElement>;
410
+ onFocus?: React.FocusEventHandler<HTMLDivElement>;
411
+ onFocusCapture?: React.FocusEventHandler<HTMLDivElement>;
412
+ onBlur?: React.FocusEventHandler<HTMLDivElement>;
413
+ onBlurCapture?: React.FocusEventHandler<HTMLDivElement>;
414
+ onChange?: React.FormEventHandler<HTMLDivElement>;
415
+ onChangeCapture?: React.FormEventHandler<HTMLDivElement>;
416
+ onBeforeInput?: React.FormEventHandler<HTMLDivElement>;
417
+ onBeforeInputCapture?: React.FormEventHandler<HTMLDivElement>;
418
+ onInput?: React.FormEventHandler<HTMLDivElement>;
419
+ onInputCapture?: React.FormEventHandler<HTMLDivElement>;
420
+ onReset?: React.FormEventHandler<HTMLDivElement>;
421
+ onResetCapture?: React.FormEventHandler<HTMLDivElement>;
422
+ onSubmit?: React.FormEventHandler<HTMLDivElement>;
423
+ onSubmitCapture?: React.FormEventHandler<HTMLDivElement>;
424
+ onInvalid?: React.FormEventHandler<HTMLDivElement>;
425
+ onInvalidCapture?: React.FormEventHandler<HTMLDivElement>;
426
+ onLoad?: React.ReactEventHandler<HTMLDivElement>;
427
+ onLoadCapture?: React.ReactEventHandler<HTMLDivElement>;
428
+ onError?: React.ReactEventHandler<HTMLDivElement>;
429
+ onErrorCapture?: React.ReactEventHandler<HTMLDivElement>;
430
+ onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
431
+ onKeyDownCapture?: React.KeyboardEventHandler<HTMLDivElement>;
432
+ onKeyPress?: React.KeyboardEventHandler<HTMLDivElement>;
433
+ onKeyPressCapture?: React.KeyboardEventHandler<HTMLDivElement>;
434
+ onKeyUp?: React.KeyboardEventHandler<HTMLDivElement>;
435
+ onKeyUpCapture?: React.KeyboardEventHandler<HTMLDivElement>;
436
+ onAbort?: React.ReactEventHandler<HTMLDivElement>;
437
+ onAbortCapture?: React.ReactEventHandler<HTMLDivElement>;
438
+ onCanPlay?: React.ReactEventHandler<HTMLDivElement>;
439
+ onCanPlayCapture?: React.ReactEventHandler<HTMLDivElement>;
440
+ onCanPlayThrough?: React.ReactEventHandler<HTMLDivElement>;
441
+ onCanPlayThroughCapture?: React.ReactEventHandler<HTMLDivElement>;
442
+ onDurationChange?: React.ReactEventHandler<HTMLDivElement>;
443
+ onDurationChangeCapture?: React.ReactEventHandler<HTMLDivElement>;
444
+ onEmptied?: React.ReactEventHandler<HTMLDivElement>;
445
+ onEmptiedCapture?: React.ReactEventHandler<HTMLDivElement>;
446
+ onEncrypted?: React.ReactEventHandler<HTMLDivElement>;
447
+ onEncryptedCapture?: React.ReactEventHandler<HTMLDivElement>;
448
+ onEnded?: React.ReactEventHandler<HTMLDivElement>;
449
+ onEndedCapture?: React.ReactEventHandler<HTMLDivElement>;
450
+ onLoadedData?: React.ReactEventHandler<HTMLDivElement>;
451
+ onLoadedDataCapture?: React.ReactEventHandler<HTMLDivElement>;
452
+ onLoadedMetadata?: React.ReactEventHandler<HTMLDivElement>;
453
+ onLoadedMetadataCapture?: React.ReactEventHandler<HTMLDivElement>;
454
+ onLoadStart?: React.ReactEventHandler<HTMLDivElement>;
455
+ onLoadStartCapture?: React.ReactEventHandler<HTMLDivElement>;
456
+ onPause?: React.ReactEventHandler<HTMLDivElement>;
457
+ onPauseCapture?: React.ReactEventHandler<HTMLDivElement>;
458
+ onPlay?: React.ReactEventHandler<HTMLDivElement>;
459
+ onPlayCapture?: React.ReactEventHandler<HTMLDivElement>;
460
+ onPlaying?: React.ReactEventHandler<HTMLDivElement>;
461
+ onPlayingCapture?: React.ReactEventHandler<HTMLDivElement>;
462
+ onProgress?: React.ReactEventHandler<HTMLDivElement>;
463
+ onProgressCapture?: React.ReactEventHandler<HTMLDivElement>;
464
+ onRateChange?: React.ReactEventHandler<HTMLDivElement>;
465
+ onRateChangeCapture?: React.ReactEventHandler<HTMLDivElement>;
466
+ onResize?: React.ReactEventHandler<HTMLDivElement>;
467
+ onResizeCapture?: React.ReactEventHandler<HTMLDivElement>;
468
+ onSeeked?: React.ReactEventHandler<HTMLDivElement>;
469
+ onSeekedCapture?: React.ReactEventHandler<HTMLDivElement>;
470
+ onSeeking?: React.ReactEventHandler<HTMLDivElement>;
471
+ onSeekingCapture?: React.ReactEventHandler<HTMLDivElement>;
472
+ onStalled?: React.ReactEventHandler<HTMLDivElement>;
473
+ onStalledCapture?: React.ReactEventHandler<HTMLDivElement>;
474
+ onSuspend?: React.ReactEventHandler<HTMLDivElement>;
475
+ onSuspendCapture?: React.ReactEventHandler<HTMLDivElement>;
476
+ onTimeUpdate?: React.ReactEventHandler<HTMLDivElement>;
477
+ onTimeUpdateCapture?: React.ReactEventHandler<HTMLDivElement>;
478
+ onVolumeChange?: React.ReactEventHandler<HTMLDivElement>;
479
+ onVolumeChangeCapture?: React.ReactEventHandler<HTMLDivElement>;
480
+ onWaiting?: React.ReactEventHandler<HTMLDivElement>;
481
+ onWaitingCapture?: React.ReactEventHandler<HTMLDivElement>;
482
+ onAuxClick?: React.MouseEventHandler<HTMLDivElement>;
483
+ onAuxClickCapture?: React.MouseEventHandler<HTMLDivElement>;
484
+ onClick?: React.MouseEventHandler<HTMLDivElement>;
485
+ onClickCapture?: React.MouseEventHandler<HTMLDivElement>;
486
+ onContextMenu?: React.MouseEventHandler<HTMLDivElement>;
487
+ onContextMenuCapture?: React.MouseEventHandler<HTMLDivElement>;
488
+ onDoubleClick?: React.MouseEventHandler<HTMLDivElement>;
489
+ onDoubleClickCapture?: React.MouseEventHandler<HTMLDivElement>;
490
+ onDragCapture?: React.DragEventHandler<HTMLDivElement>;
491
+ onDragEndCapture?: React.DragEventHandler<HTMLDivElement>;
492
+ onDragEnter?: React.DragEventHandler<HTMLDivElement>;
493
+ onDragEnterCapture?: React.DragEventHandler<HTMLDivElement>;
494
+ onDragExit?: React.DragEventHandler<HTMLDivElement>;
495
+ onDragExitCapture?: React.DragEventHandler<HTMLDivElement>;
496
+ onDragLeave?: React.DragEventHandler<HTMLDivElement>;
497
+ onDragLeaveCapture?: React.DragEventHandler<HTMLDivElement>;
498
+ onDragOver?: React.DragEventHandler<HTMLDivElement>;
499
+ onDragOverCapture?: React.DragEventHandler<HTMLDivElement>;
500
+ onDragStartCapture?: React.DragEventHandler<HTMLDivElement>;
501
+ onDrop?: React.DragEventHandler<HTMLDivElement>;
502
+ onDropCapture?: React.DragEventHandler<HTMLDivElement>;
503
+ onMouseDown?: React.MouseEventHandler<HTMLDivElement>;
504
+ onMouseDownCapture?: React.MouseEventHandler<HTMLDivElement>;
505
+ onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
506
+ onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
507
+ onMouseMove?: React.MouseEventHandler<HTMLDivElement>;
508
+ onMouseMoveCapture?: React.MouseEventHandler<HTMLDivElement>;
509
+ onMouseOut?: React.MouseEventHandler<HTMLDivElement>;
510
+ onMouseOutCapture?: React.MouseEventHandler<HTMLDivElement>;
511
+ onMouseOver?: React.MouseEventHandler<HTMLDivElement>;
512
+ onMouseOverCapture?: React.MouseEventHandler<HTMLDivElement>;
513
+ onMouseUp?: React.MouseEventHandler<HTMLDivElement>;
514
+ onMouseUpCapture?: React.MouseEventHandler<HTMLDivElement>;
515
+ onSelect?: React.ReactEventHandler<HTMLDivElement>;
516
+ onSelectCapture?: React.ReactEventHandler<HTMLDivElement>;
517
+ onTouchCancel?: React.TouchEventHandler<HTMLDivElement>;
518
+ onTouchCancelCapture?: React.TouchEventHandler<HTMLDivElement>;
519
+ onTouchEnd?: React.TouchEventHandler<HTMLDivElement>;
520
+ onTouchEndCapture?: React.TouchEventHandler<HTMLDivElement>;
521
+ onTouchMove?: React.TouchEventHandler<HTMLDivElement>;
522
+ onTouchMoveCapture?: React.TouchEventHandler<HTMLDivElement>;
523
+ onTouchStart?: React.TouchEventHandler<HTMLDivElement>;
524
+ onTouchStartCapture?: React.TouchEventHandler<HTMLDivElement>;
525
+ onPointerDown?: React.PointerEventHandler<HTMLDivElement>;
526
+ onPointerDownCapture?: React.PointerEventHandler<HTMLDivElement>;
527
+ onPointerMove?: React.PointerEventHandler<HTMLDivElement>;
528
+ onPointerMoveCapture?: React.PointerEventHandler<HTMLDivElement>;
529
+ onPointerUp?: React.PointerEventHandler<HTMLDivElement>;
530
+ onPointerUpCapture?: React.PointerEventHandler<HTMLDivElement>;
531
+ onPointerCancel?: React.PointerEventHandler<HTMLDivElement>;
532
+ onPointerCancelCapture?: React.PointerEventHandler<HTMLDivElement>;
533
+ onPointerEnter?: React.PointerEventHandler<HTMLDivElement>;
534
+ onPointerEnterCapture?: React.PointerEventHandler<HTMLDivElement>;
535
+ onPointerLeave?: React.PointerEventHandler<HTMLDivElement>;
536
+ onPointerLeaveCapture?: React.PointerEventHandler<HTMLDivElement>;
537
+ onPointerOver?: React.PointerEventHandler<HTMLDivElement>;
538
+ onPointerOverCapture?: React.PointerEventHandler<HTMLDivElement>;
539
+ onPointerOut?: React.PointerEventHandler<HTMLDivElement>;
540
+ onPointerOutCapture?: React.PointerEventHandler<HTMLDivElement>;
541
+ onGotPointerCapture?: React.PointerEventHandler<HTMLDivElement>;
542
+ onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement>;
543
+ onLostPointerCapture?: React.PointerEventHandler<HTMLDivElement>;
544
+ onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement>;
545
+ onScroll?: React.UIEventHandler<HTMLDivElement>;
546
+ onScrollCapture?: React.UIEventHandler<HTMLDivElement>;
547
+ onWheel?: React.WheelEventHandler<HTMLDivElement>;
548
+ onWheelCapture?: React.WheelEventHandler<HTMLDivElement>;
549
+ onAnimationStartCapture?: React.AnimationEventHandler<HTMLDivElement>;
550
+ onAnimationEnd?: React.AnimationEventHandler<HTMLDivElement>;
551
+ onAnimationEndCapture?: React.AnimationEventHandler<HTMLDivElement>;
552
+ onAnimationIteration?: React.AnimationEventHandler<HTMLDivElement>;
553
+ onAnimationIterationCapture?: React.AnimationEventHandler<HTMLDivElement>;
554
+ onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement>;
555
+ onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement>;
556
+ } & import("framer-motion").MotionProps & React.RefAttributes<HTMLDivElement> & {
557
+ theme?: import("@emotion/react").Theme;
558
+ } & {
559
+ position: 'left' | 'right';
560
+ }, {}, {}>;
package/dist/components/tabs/Tabs.stories.d.ts ADDED
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { ComponentMeta } from '@storybook/react';
3
+ declare const _default: ComponentMeta<({ className, children, dense, width, activeTabId, onChange, }: React.PropsWithChildren<import("./LineTabs").LineTabsProps>) => JSX.Element>;
4
+ export default _default;
5
+ export declare const Base: any;
6
+ export declare const Fill: any;
7
+ export declare const Dense: any;
8
+ export declare const WithIcon: () => JSX.Element;
9
+ export declare const Scroll: any;
package/dist/components/tabs/index.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export * from './LineTabs';
2
+ export * from './LineTab';
package/dist/components/tabs/styles.d.ts ADDED
@@ -0,0 +1 @@
1
+ export declare const line_tabs_base_css: import("@emotion/utils").SerializedStyles;