@dafaz-ui/react 2.0.1 → 2.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
 
2
- > @dafaz-ui/react@2.0.1 build
2
+ > @dafaz-ui/react@2.1.0 build
3
3
  > tsup src/index.tsx --format esm,cjs --dts --external react
4
4
 
5
5
  CLI Building entry: src/index.tsx
@@ -8,11 +8,11 @@
8
8
  CLI Target: es6
9
9
  ESM Build start
10
10
  CJS Build start
11
- CJS dist/index.js 5.02 KB
12
- CJS ⚡️ Build success in 22ms
13
- ESM dist/index.mjs 3.90 KB
14
- ESM ⚡️ Build success in 22ms
11
+ ESM dist/index.mjs 4.68 KB
12
+ ESM ⚡️ Build success in 25ms
13
+ CJS dist/index.js 5.82 KB
14
+ CJS ⚡️ Build success in 26ms
15
15
  DTS Build start
16
- DTS ⚡️ Build success in 1995ms
17
- DTS dist/index.d.mts 59.20 KB
18
- DTS dist/index.d.ts 59.20 KB
16
+ DTS ⚡️ Build success in 2097ms
17
+ DTS dist/index.d.mts 64.29 KB
18
+ DTS dist/index.d.ts 64.29 KB
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @dafaz-ui/react
2
2
 
3
+ ## 2.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - Add Text UI component
8
+
3
9
  ## 2.0.1
4
10
 
5
11
  ### Patch Changes
package/dist/index.d.mts CHANGED
@@ -2,7 +2,7 @@ import * as _stitches_react_types_styled_component from '@stitches/react/types/s
2
2
  import * as _stitches_react_types_css_util from '@stitches/react/types/css-util';
3
3
  import { ComponentProps } from '@stitches/react';
4
4
  import * as react from 'react';
5
- import { ElementType } from 'react';
5
+ import { ElementType, ComponentProps as ComponentProps$1 } from 'react';
6
6
  import * as _stitches_react_types_theme from '@stitches/react/types/theme';
7
7
  import * as _stitches_react_types_css from '@stitches/react/types/css';
8
8
  import * as _stitches_react_types_stitches from '@stitches/react/types/stitches';
@@ -11,7 +11,8 @@ import * as _stitches_react_types_util from '@stitches/react/types/util';
11
11
  /** Primary UI component for user interaction */
12
12
  declare const Button: _stitches_react_types_styled_component.StyledComponent<"button", {
13
13
  variant?: "primary" | "secondary" | "tertiary" | undefined;
14
- size?: "sm" | "md" | undefined;
14
+ size?: "sm" | "md" | "lg" | undefined;
15
+ flat?: boolean | "true" | "false" | undefined;
15
16
  }, {}, _stitches_react_types_css_util.CSS<{}, {
16
17
  colors: {
17
18
  white: string;
@@ -25,7 +26,6 @@ declare const Button: _stitches_react_types_styled_component.StyledComponent<"bu
25
26
  dafaz400: string;
26
27
  dafaz600: string;
27
28
  dafaz800: string;
28
- teste: string;
29
29
  };
30
30
  fontSizes: {
31
31
  xxs: string;
@@ -216,7 +216,7 @@ declare const Button: _stitches_react_types_styled_component.StyledComponent<"bu
216
216
  interface ButtonProps extends ComponentProps<typeof Button> {
217
217
  as?: ElementType;
218
218
  /** How large should the button be? */
219
- size?: 'sm' | 'md';
219
+ size?: 'sm' | 'md' | 'lg';
220
220
  /** Optional click handler */
221
221
  onClick?: () => void;
222
222
  /** Button contents */
@@ -224,6 +224,215 @@ interface ButtonProps extends ComponentProps<typeof Button> {
224
224
  /** Button is disable? */
225
225
  disabled?: boolean;
226
226
  variant?: 'primary' | 'secondary' | 'tertiary';
227
+ flat?: boolean;
228
+ }
229
+
230
+ declare const Text: _stitches_react_types_styled_component.StyledComponent<"p", {
231
+ size?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | undefined;
232
+ }, {}, _stitches_react_types_css_util.CSS<{}, {
233
+ colors: {
234
+ white: string;
235
+ black: string;
236
+ gray100: string;
237
+ gray200: string;
238
+ gray400: string;
239
+ gray800: string;
240
+ dafaz100: string;
241
+ dafaz200: string;
242
+ dafaz400: string;
243
+ dafaz600: string;
244
+ dafaz800: string;
245
+ };
246
+ fontSizes: {
247
+ xxs: string;
248
+ xs: string;
249
+ sm: string;
250
+ md: string;
251
+ lg: string;
252
+ xl: string;
253
+ '2xl': string;
254
+ };
255
+ fontWeights: {
256
+ regular: string;
257
+ medium: string;
258
+ bold: string;
259
+ };
260
+ fonts: {
261
+ default: string;
262
+ app: string;
263
+ web: string;
264
+ offer: string;
265
+ code: string;
266
+ };
267
+ lineHeights: {
268
+ shorter: string;
269
+ short: string;
270
+ base: string;
271
+ tall: string;
272
+ };
273
+ radii: {
274
+ px: string;
275
+ sm: string;
276
+ md: string;
277
+ full: string;
278
+ };
279
+ space: {
280
+ 1: string;
281
+ 2: string;
282
+ 3: string;
283
+ 4: string;
284
+ 5: string;
285
+ 6: string;
286
+ 7: string;
287
+ 8: string;
288
+ 10: string;
289
+ 12: string;
290
+ 16: string;
291
+ 20: string;
292
+ 40: string;
293
+ 64: string;
294
+ 80: string;
295
+ };
296
+ opacities: {
297
+ opacity400: string;
298
+ opacity600: string;
299
+ opacity800: string;
300
+ opacity900: string;
301
+ };
302
+ }, {
303
+ height: "space";
304
+ width: "space";
305
+ gap: "space";
306
+ gridGap: "space";
307
+ columnGap: "space";
308
+ gridColumnGap: "space";
309
+ rowGap: "space";
310
+ gridRowGap: "space";
311
+ inset: "space";
312
+ insetBlock: "space";
313
+ insetBlockEnd: "space";
314
+ insetBlockStart: "space";
315
+ insetInline: "space";
316
+ insetInlineEnd: "space";
317
+ insetInlineStart: "space";
318
+ margin: "space";
319
+ marginTop: "space";
320
+ marginRight: "space";
321
+ marginBottom: "space";
322
+ marginLeft: "space";
323
+ marginBlock: "space";
324
+ marginBlockEnd: "space";
325
+ marginBlockStart: "space";
326
+ marginInline: "space";
327
+ marginInlineEnd: "space";
328
+ marginInlineStart: "space";
329
+ padding: "space";
330
+ paddingTop: "space";
331
+ paddingRight: "space";
332
+ paddingBottom: "space";
333
+ paddingLeft: "space";
334
+ paddingBlock: "space";
335
+ paddingBlockEnd: "space";
336
+ paddingBlockStart: "space";
337
+ paddingInline: "space";
338
+ paddingInlineEnd: "space";
339
+ paddingInlineStart: "space";
340
+ scrollMargin: "space";
341
+ scrollMarginTop: "space";
342
+ scrollMarginRight: "space";
343
+ scrollMarginBottom: "space";
344
+ scrollMarginLeft: "space";
345
+ scrollMarginBlock: "space";
346
+ scrollMarginBlockEnd: "space";
347
+ scrollMarginBlockStart: "space";
348
+ scrollMarginInline: "space";
349
+ scrollMarginInlineEnd: "space";
350
+ scrollMarginInlineStart: "space";
351
+ scrollPadding: "space";
352
+ scrollPaddingTop: "space";
353
+ scrollPaddingRight: "space";
354
+ scrollPaddingBottom: "space";
355
+ scrollPaddingLeft: "space";
356
+ scrollPaddingBlock: "space";
357
+ scrollPaddingBlockEnd: "space";
358
+ scrollPaddingBlockStart: "space";
359
+ scrollPaddingInline: "space";
360
+ scrollPaddingInlineEnd: "space";
361
+ scrollPaddingInlineStart: "space";
362
+ top: "space";
363
+ right: "space";
364
+ bottom: "space";
365
+ left: "space";
366
+ fontSize: "fontSizes";
367
+ background: "colors";
368
+ backgroundColor: "colors";
369
+ backgroundImage: "colors";
370
+ borderImage: "colors";
371
+ border: "colors";
372
+ borderBlock: "colors";
373
+ borderBlockEnd: "colors";
374
+ borderBlockStart: "colors";
375
+ borderBottom: "colors";
376
+ borderBottomColor: "colors";
377
+ borderColor: "colors";
378
+ borderInline: "colors";
379
+ borderInlineEnd: "colors";
380
+ borderInlineStart: "colors";
381
+ borderLeft: "colors";
382
+ borderLeftColor: "colors";
383
+ borderRight: "colors";
384
+ borderRightColor: "colors";
385
+ borderTop: "colors";
386
+ borderTopColor: "colors";
387
+ caretColor: "colors";
388
+ color: "colors";
389
+ columnRuleColor: "colors";
390
+ outline: "colors";
391
+ outlineColor: "colors";
392
+ fill: "colors";
393
+ stroke: "colors";
394
+ textDecorationColor: "colors";
395
+ fontFamily: "fonts";
396
+ fontWeight: "fontWeights";
397
+ lineHeight: "lineHeights";
398
+ letterSpacing: "letterSpacings";
399
+ blockSize: "sizes";
400
+ minBlockSize: "sizes";
401
+ maxBlockSize: "sizes";
402
+ inlineSize: "sizes";
403
+ minInlineSize: "sizes";
404
+ maxInlineSize: "sizes";
405
+ minWidth: "sizes";
406
+ maxWidth: "sizes";
407
+ minHeight: "sizes";
408
+ maxHeight: "sizes";
409
+ flexBasis: "sizes";
410
+ gridTemplateColumns: "sizes";
411
+ gridTemplateRows: "sizes";
412
+ borderWidth: "borderWidths";
413
+ borderTopWidth: "borderWidths";
414
+ borderLeftWidth: "borderWidths";
415
+ borderRightWidth: "borderWidths";
416
+ borderBottomWidth: "borderWidths";
417
+ borderStyle: "borderStyles";
418
+ borderTopStyle: "borderStyles";
419
+ borderLeftStyle: "borderStyles";
420
+ borderRightStyle: "borderStyles";
421
+ borderBottomStyle: "borderStyles";
422
+ borderRadius: "radii";
423
+ borderTopLeftRadius: "radii";
424
+ borderTopRightRadius: "radii";
425
+ borderBottomRightRadius: "radii";
426
+ borderBottomLeftRadius: "radii";
427
+ boxShadow: "shadows";
428
+ textShadow: "shadows";
429
+ transition: "transitions";
430
+ zIndex: "zIndices";
431
+ }, {}>>;
432
+ interface TextProps extends ComponentProps$1<typeof Text> {
433
+ as?: ElementType;
434
+ content: string;
435
+ size?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
227
436
  }
228
437
 
229
438
  declare const styled: <Type extends keyof JSX.IntrinsicElements | React.ComponentType<any> | _stitches_react_types_util.Function, Composers extends (string | React.ComponentType<any> | _stitches_react_types_util.Function | {
@@ -241,7 +450,6 @@ declare const styled: <Type extends keyof JSX.IntrinsicElements | React.Componen
241
450
  dafaz400: string;
242
451
  dafaz600: string;
243
452
  dafaz800: string;
244
- teste: string;
245
453
  };
246
454
  fontSizes: {
247
455
  xxs: string;
@@ -452,7 +660,6 @@ declare const styled: <Type extends keyof JSX.IntrinsicElements | React.Componen
452
660
  dafaz400: string;
453
661
  dafaz600: string;
454
662
  dafaz800: string;
455
- teste: string;
456
663
  };
457
664
  fontSizes: {
458
665
  xxs: string;
@@ -655,7 +862,6 @@ declare const css: <Composers extends (string | React.ExoticComponent<any> | Rea
655
862
  dafaz400: string;
656
863
  dafaz600: string;
657
864
  dafaz800: string;
658
- teste: string;
659
865
  };
660
866
  fontSizes: {
661
867
  xxs: string;
@@ -873,7 +1079,6 @@ declare const globalCss: <Styles extends {
873
1079
  dafaz400: string;
874
1080
  dafaz600: string;
875
1081
  dafaz800: string;
876
- teste: string;
877
1082
  };
878
1083
  fontSizes: {
879
1084
  xxs: string;
@@ -1074,7 +1279,6 @@ declare const globalCss: <Styles extends {
1074
1279
  dafaz400: string;
1075
1280
  dafaz600: string;
1076
1281
  dafaz800: string;
1077
- teste: string;
1078
1282
  };
1079
1283
  fontSizes: {
1080
1284
  xxs: string;
@@ -1278,7 +1482,6 @@ declare const keyframes: (style: {
1278
1482
  dafaz400: string;
1279
1483
  dafaz600: string;
1280
1484
  dafaz800: string;
1281
- teste: string;
1282
1485
  };
1283
1486
  fontSizes: {
1284
1487
  xxs: string;
@@ -1487,7 +1690,6 @@ declare const theme: string & {
1487
1690
  dafaz400: _stitches_react_types_theme.Token<"dafaz400", string, "colors", "">;
1488
1691
  dafaz600: _stitches_react_types_theme.Token<"dafaz600", string, "colors", "">;
1489
1692
  dafaz800: _stitches_react_types_theme.Token<"dafaz800", string, "colors", "">;
1490
- teste: _stitches_react_types_theme.Token<"teste", string, "colors", "">;
1491
1693
  };
1492
1694
  fontSizes: {
1493
1695
  xxs: _stitches_react_types_theme.Token<"xxs", string, "fontSizes", "">;
@@ -1559,7 +1761,6 @@ declare const createTheme: <Argument0 extends string | ({
1559
1761
  dafaz400?: string | number | boolean | undefined;
1560
1762
  dafaz600?: string | number | boolean | undefined;
1561
1763
  dafaz800?: string | number | boolean | undefined;
1562
- teste?: string | number | boolean | undefined;
1563
1764
  } | undefined;
1564
1765
  fontSizes?: {
1565
1766
  xxs?: string | number | boolean | undefined;
@@ -1635,7 +1836,6 @@ declare const createTheme: <Argument0 extends string | ({
1635
1836
  dafaz400?: string | number | boolean | undefined;
1636
1837
  dafaz600?: string | number | boolean | undefined;
1637
1838
  dafaz800?: string | number | boolean | undefined;
1638
- teste?: string | number | boolean | undefined;
1639
1839
  } | undefined;
1640
1840
  fontSizes?: {
1641
1841
  xxs?: string | number | boolean | undefined;
@@ -1718,7 +1918,6 @@ declare const config: {
1718
1918
  dafaz400: string;
1719
1919
  dafaz600: string;
1720
1920
  dafaz800: string;
1721
- teste: string;
1722
1921
  };
1723
1922
  fontSizes: {
1724
1923
  xxs: string;
@@ -1910,4 +2109,4 @@ declare const config: {
1910
2109
  utils: {};
1911
2110
  };
1912
2111
 
1913
- export { Button, type ButtonProps, config, createTheme, css, getCssText, globalCss, keyframes, styled, theme };
2112
+ export { Button, type ButtonProps, Text, type TextProps, config, createTheme, css, getCssText, globalCss, keyframes, styled, theme };
package/dist/index.d.ts CHANGED
@@ -2,7 +2,7 @@ import * as _stitches_react_types_styled_component from '@stitches/react/types/s
2
2
  import * as _stitches_react_types_css_util from '@stitches/react/types/css-util';
3
3
  import { ComponentProps } from '@stitches/react';
4
4
  import * as react from 'react';
5
- import { ElementType } from 'react';
5
+ import { ElementType, ComponentProps as ComponentProps$1 } from 'react';
6
6
  import * as _stitches_react_types_theme from '@stitches/react/types/theme';
7
7
  import * as _stitches_react_types_css from '@stitches/react/types/css';
8
8
  import * as _stitches_react_types_stitches from '@stitches/react/types/stitches';
@@ -11,7 +11,8 @@ import * as _stitches_react_types_util from '@stitches/react/types/util';
11
11
  /** Primary UI component for user interaction */
12
12
  declare const Button: _stitches_react_types_styled_component.StyledComponent<"button", {
13
13
  variant?: "primary" | "secondary" | "tertiary" | undefined;
14
- size?: "sm" | "md" | undefined;
14
+ size?: "sm" | "md" | "lg" | undefined;
15
+ flat?: boolean | "true" | "false" | undefined;
15
16
  }, {}, _stitches_react_types_css_util.CSS<{}, {
16
17
  colors: {
17
18
  white: string;
@@ -25,7 +26,6 @@ declare const Button: _stitches_react_types_styled_component.StyledComponent<"bu
25
26
  dafaz400: string;
26
27
  dafaz600: string;
27
28
  dafaz800: string;
28
- teste: string;
29
29
  };
30
30
  fontSizes: {
31
31
  xxs: string;
@@ -216,7 +216,7 @@ declare const Button: _stitches_react_types_styled_component.StyledComponent<"bu
216
216
  interface ButtonProps extends ComponentProps<typeof Button> {
217
217
  as?: ElementType;
218
218
  /** How large should the button be? */
219
- size?: 'sm' | 'md';
219
+ size?: 'sm' | 'md' | 'lg';
220
220
  /** Optional click handler */
221
221
  onClick?: () => void;
222
222
  /** Button contents */
@@ -224,6 +224,215 @@ interface ButtonProps extends ComponentProps<typeof Button> {
224
224
  /** Button is disable? */
225
225
  disabled?: boolean;
226
226
  variant?: 'primary' | 'secondary' | 'tertiary';
227
+ flat?: boolean;
228
+ }
229
+
230
+ declare const Text: _stitches_react_types_styled_component.StyledComponent<"p", {
231
+ size?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | undefined;
232
+ }, {}, _stitches_react_types_css_util.CSS<{}, {
233
+ colors: {
234
+ white: string;
235
+ black: string;
236
+ gray100: string;
237
+ gray200: string;
238
+ gray400: string;
239
+ gray800: string;
240
+ dafaz100: string;
241
+ dafaz200: string;
242
+ dafaz400: string;
243
+ dafaz600: string;
244
+ dafaz800: string;
245
+ };
246
+ fontSizes: {
247
+ xxs: string;
248
+ xs: string;
249
+ sm: string;
250
+ md: string;
251
+ lg: string;
252
+ xl: string;
253
+ '2xl': string;
254
+ };
255
+ fontWeights: {
256
+ regular: string;
257
+ medium: string;
258
+ bold: string;
259
+ };
260
+ fonts: {
261
+ default: string;
262
+ app: string;
263
+ web: string;
264
+ offer: string;
265
+ code: string;
266
+ };
267
+ lineHeights: {
268
+ shorter: string;
269
+ short: string;
270
+ base: string;
271
+ tall: string;
272
+ };
273
+ radii: {
274
+ px: string;
275
+ sm: string;
276
+ md: string;
277
+ full: string;
278
+ };
279
+ space: {
280
+ 1: string;
281
+ 2: string;
282
+ 3: string;
283
+ 4: string;
284
+ 5: string;
285
+ 6: string;
286
+ 7: string;
287
+ 8: string;
288
+ 10: string;
289
+ 12: string;
290
+ 16: string;
291
+ 20: string;
292
+ 40: string;
293
+ 64: string;
294
+ 80: string;
295
+ };
296
+ opacities: {
297
+ opacity400: string;
298
+ opacity600: string;
299
+ opacity800: string;
300
+ opacity900: string;
301
+ };
302
+ }, {
303
+ height: "space";
304
+ width: "space";
305
+ gap: "space";
306
+ gridGap: "space";
307
+ columnGap: "space";
308
+ gridColumnGap: "space";
309
+ rowGap: "space";
310
+ gridRowGap: "space";
311
+ inset: "space";
312
+ insetBlock: "space";
313
+ insetBlockEnd: "space";
314
+ insetBlockStart: "space";
315
+ insetInline: "space";
316
+ insetInlineEnd: "space";
317
+ insetInlineStart: "space";
318
+ margin: "space";
319
+ marginTop: "space";
320
+ marginRight: "space";
321
+ marginBottom: "space";
322
+ marginLeft: "space";
323
+ marginBlock: "space";
324
+ marginBlockEnd: "space";
325
+ marginBlockStart: "space";
326
+ marginInline: "space";
327
+ marginInlineEnd: "space";
328
+ marginInlineStart: "space";
329
+ padding: "space";
330
+ paddingTop: "space";
331
+ paddingRight: "space";
332
+ paddingBottom: "space";
333
+ paddingLeft: "space";
334
+ paddingBlock: "space";
335
+ paddingBlockEnd: "space";
336
+ paddingBlockStart: "space";
337
+ paddingInline: "space";
338
+ paddingInlineEnd: "space";
339
+ paddingInlineStart: "space";
340
+ scrollMargin: "space";
341
+ scrollMarginTop: "space";
342
+ scrollMarginRight: "space";
343
+ scrollMarginBottom: "space";
344
+ scrollMarginLeft: "space";
345
+ scrollMarginBlock: "space";
346
+ scrollMarginBlockEnd: "space";
347
+ scrollMarginBlockStart: "space";
348
+ scrollMarginInline: "space";
349
+ scrollMarginInlineEnd: "space";
350
+ scrollMarginInlineStart: "space";
351
+ scrollPadding: "space";
352
+ scrollPaddingTop: "space";
353
+ scrollPaddingRight: "space";
354
+ scrollPaddingBottom: "space";
355
+ scrollPaddingLeft: "space";
356
+ scrollPaddingBlock: "space";
357
+ scrollPaddingBlockEnd: "space";
358
+ scrollPaddingBlockStart: "space";
359
+ scrollPaddingInline: "space";
360
+ scrollPaddingInlineEnd: "space";
361
+ scrollPaddingInlineStart: "space";
362
+ top: "space";
363
+ right: "space";
364
+ bottom: "space";
365
+ left: "space";
366
+ fontSize: "fontSizes";
367
+ background: "colors";
368
+ backgroundColor: "colors";
369
+ backgroundImage: "colors";
370
+ borderImage: "colors";
371
+ border: "colors";
372
+ borderBlock: "colors";
373
+ borderBlockEnd: "colors";
374
+ borderBlockStart: "colors";
375
+ borderBottom: "colors";
376
+ borderBottomColor: "colors";
377
+ borderColor: "colors";
378
+ borderInline: "colors";
379
+ borderInlineEnd: "colors";
380
+ borderInlineStart: "colors";
381
+ borderLeft: "colors";
382
+ borderLeftColor: "colors";
383
+ borderRight: "colors";
384
+ borderRightColor: "colors";
385
+ borderTop: "colors";
386
+ borderTopColor: "colors";
387
+ caretColor: "colors";
388
+ color: "colors";
389
+ columnRuleColor: "colors";
390
+ outline: "colors";
391
+ outlineColor: "colors";
392
+ fill: "colors";
393
+ stroke: "colors";
394
+ textDecorationColor: "colors";
395
+ fontFamily: "fonts";
396
+ fontWeight: "fontWeights";
397
+ lineHeight: "lineHeights";
398
+ letterSpacing: "letterSpacings";
399
+ blockSize: "sizes";
400
+ minBlockSize: "sizes";
401
+ maxBlockSize: "sizes";
402
+ inlineSize: "sizes";
403
+ minInlineSize: "sizes";
404
+ maxInlineSize: "sizes";
405
+ minWidth: "sizes";
406
+ maxWidth: "sizes";
407
+ minHeight: "sizes";
408
+ maxHeight: "sizes";
409
+ flexBasis: "sizes";
410
+ gridTemplateColumns: "sizes";
411
+ gridTemplateRows: "sizes";
412
+ borderWidth: "borderWidths";
413
+ borderTopWidth: "borderWidths";
414
+ borderLeftWidth: "borderWidths";
415
+ borderRightWidth: "borderWidths";
416
+ borderBottomWidth: "borderWidths";
417
+ borderStyle: "borderStyles";
418
+ borderTopStyle: "borderStyles";
419
+ borderLeftStyle: "borderStyles";
420
+ borderRightStyle: "borderStyles";
421
+ borderBottomStyle: "borderStyles";
422
+ borderRadius: "radii";
423
+ borderTopLeftRadius: "radii";
424
+ borderTopRightRadius: "radii";
425
+ borderBottomRightRadius: "radii";
426
+ borderBottomLeftRadius: "radii";
427
+ boxShadow: "shadows";
428
+ textShadow: "shadows";
429
+ transition: "transitions";
430
+ zIndex: "zIndices";
431
+ }, {}>>;
432
+ interface TextProps extends ComponentProps$1<typeof Text> {
433
+ as?: ElementType;
434
+ content: string;
435
+ size?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
227
436
  }
228
437
 
229
438
  declare const styled: <Type extends keyof JSX.IntrinsicElements | React.ComponentType<any> | _stitches_react_types_util.Function, Composers extends (string | React.ComponentType<any> | _stitches_react_types_util.Function | {
@@ -241,7 +450,6 @@ declare const styled: <Type extends keyof JSX.IntrinsicElements | React.Componen
241
450
  dafaz400: string;
242
451
  dafaz600: string;
243
452
  dafaz800: string;
244
- teste: string;
245
453
  };
246
454
  fontSizes: {
247
455
  xxs: string;
@@ -452,7 +660,6 @@ declare const styled: <Type extends keyof JSX.IntrinsicElements | React.Componen
452
660
  dafaz400: string;
453
661
  dafaz600: string;
454
662
  dafaz800: string;
455
- teste: string;
456
663
  };
457
664
  fontSizes: {
458
665
  xxs: string;
@@ -655,7 +862,6 @@ declare const css: <Composers extends (string | React.ExoticComponent<any> | Rea
655
862
  dafaz400: string;
656
863
  dafaz600: string;
657
864
  dafaz800: string;
658
- teste: string;
659
865
  };
660
866
  fontSizes: {
661
867
  xxs: string;
@@ -873,7 +1079,6 @@ declare const globalCss: <Styles extends {
873
1079
  dafaz400: string;
874
1080
  dafaz600: string;
875
1081
  dafaz800: string;
876
- teste: string;
877
1082
  };
878
1083
  fontSizes: {
879
1084
  xxs: string;
@@ -1074,7 +1279,6 @@ declare const globalCss: <Styles extends {
1074
1279
  dafaz400: string;
1075
1280
  dafaz600: string;
1076
1281
  dafaz800: string;
1077
- teste: string;
1078
1282
  };
1079
1283
  fontSizes: {
1080
1284
  xxs: string;
@@ -1278,7 +1482,6 @@ declare const keyframes: (style: {
1278
1482
  dafaz400: string;
1279
1483
  dafaz600: string;
1280
1484
  dafaz800: string;
1281
- teste: string;
1282
1485
  };
1283
1486
  fontSizes: {
1284
1487
  xxs: string;
@@ -1487,7 +1690,6 @@ declare const theme: string & {
1487
1690
  dafaz400: _stitches_react_types_theme.Token<"dafaz400", string, "colors", "">;
1488
1691
  dafaz600: _stitches_react_types_theme.Token<"dafaz600", string, "colors", "">;
1489
1692
  dafaz800: _stitches_react_types_theme.Token<"dafaz800", string, "colors", "">;
1490
- teste: _stitches_react_types_theme.Token<"teste", string, "colors", "">;
1491
1693
  };
1492
1694
  fontSizes: {
1493
1695
  xxs: _stitches_react_types_theme.Token<"xxs", string, "fontSizes", "">;
@@ -1559,7 +1761,6 @@ declare const createTheme: <Argument0 extends string | ({
1559
1761
  dafaz400?: string | number | boolean | undefined;
1560
1762
  dafaz600?: string | number | boolean | undefined;
1561
1763
  dafaz800?: string | number | boolean | undefined;
1562
- teste?: string | number | boolean | undefined;
1563
1764
  } | undefined;
1564
1765
  fontSizes?: {
1565
1766
  xxs?: string | number | boolean | undefined;
@@ -1635,7 +1836,6 @@ declare const createTheme: <Argument0 extends string | ({
1635
1836
  dafaz400?: string | number | boolean | undefined;
1636
1837
  dafaz600?: string | number | boolean | undefined;
1637
1838
  dafaz800?: string | number | boolean | undefined;
1638
- teste?: string | number | boolean | undefined;
1639
1839
  } | undefined;
1640
1840
  fontSizes?: {
1641
1841
  xxs?: string | number | boolean | undefined;
@@ -1718,7 +1918,6 @@ declare const config: {
1718
1918
  dafaz400: string;
1719
1919
  dafaz600: string;
1720
1920
  dafaz800: string;
1721
- teste: string;
1722
1921
  };
1723
1922
  fontSizes: {
1724
1923
  xxs: string;
@@ -1910,4 +2109,4 @@ declare const config: {
1910
2109
  utils: {};
1911
2110
  };
1912
2111
 
1913
- export { Button, type ButtonProps, config, createTheme, css, getCssText, globalCss, keyframes, styled, theme };
2112
+ export { Button, type ButtonProps, Text, type TextProps, config, createTheme, css, getCssText, globalCss, keyframes, styled, theme };
package/dist/index.js CHANGED
@@ -38,6 +38,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
38
38
  var src_exports = {};
39
39
  __export(src_exports, {
40
40
  Button: () => Button,
41
+ Text: () => Text,
41
42
  config: () => config,
42
43
  createTheme: () => createTheme,
43
44
  css: () => css,
@@ -61,8 +62,7 @@ var colors = {
61
62
  dafaz200: "#52D058",
62
63
  dafaz400: "#2FC136",
63
64
  dafaz600: "#229E45",
64
- dafaz800: "#2A6A2D",
65
- teste: "#FFF"
65
+ dafaz800: "#2A6A2D"
66
66
  };
67
67
  var opacities = {
68
68
  opacity400: "0.4",
@@ -104,8 +104,8 @@ var fontSizes = {
104
104
  xxs: "0.5rem",
105
105
  xs: "0.625rem",
106
106
  sm: "0.75rem",
107
- md: "0.875",
108
- lg: "1rem",
107
+ md: "0.875rem",
108
+ lg: "1.0rem",
109
109
  xl: "1.25rem",
110
110
  "2xl": "2rem"
111
111
  };
@@ -211,21 +211,63 @@ var Button = styled("button", {
211
211
  },
212
212
  size: {
213
213
  sm: {
214
- height: 38
214
+ height: 38,
215
+ fontSize: "$sm"
215
216
  },
216
217
  md: {
217
- height: 46
218
+ height: 46,
219
+ fontSize: "$lg"
220
+ },
221
+ lg: {
222
+ height: 54,
223
+ fontSize: "$xl"
218
224
  }
225
+ },
226
+ flat: {
227
+ true: {
228
+ border: 0,
229
+ background: "transparent",
230
+ "&:disabled": {
231
+ color: "$gray200",
232
+ background: "transparent",
233
+ border: "none"
234
+ }
235
+ },
236
+ false: {}
219
237
  }
220
238
  },
221
239
  defaultVariants: {
222
240
  variant: "primary",
241
+ size: "md",
242
+ flat: false
243
+ }
244
+ });
245
+
246
+ // src/components/Text.tsx
247
+ var Text = styled("p", {
248
+ fontFamily: "$web",
249
+ lineHeight: "$base",
250
+ margin: 0,
251
+ color: "$white",
252
+ variants: {
253
+ size: {
254
+ xxs: { fontSize: "$xxs" },
255
+ xs: { fontSize: "$xs" },
256
+ sm: { fontSize: "$sm" },
257
+ md: { fontSize: "$md" },
258
+ lg: { fontSize: "$lg" },
259
+ xl: { fontSize: "$xl" },
260
+ "2xl": { fontSize: "$2xl" }
261
+ }
262
+ },
263
+ defaultVariants: {
223
264
  size: "md"
224
265
  }
225
266
  });
226
267
  // Annotate the CommonJS export names for ESM import in node:
227
268
  0 && (module.exports = {
228
269
  Button,
270
+ Text,
229
271
  config,
230
272
  createTheme,
231
273
  css,
package/dist/index.mjs CHANGED
@@ -30,8 +30,7 @@ var colors = {
30
30
  dafaz200: "#52D058",
31
31
  dafaz400: "#2FC136",
32
32
  dafaz600: "#229E45",
33
- dafaz800: "#2A6A2D",
34
- teste: "#FFF"
33
+ dafaz800: "#2A6A2D"
35
34
  };
36
35
  var opacities = {
37
36
  opacity400: "0.4",
@@ -73,8 +72,8 @@ var fontSizes = {
73
72
  xxs: "0.5rem",
74
73
  xs: "0.625rem",
75
74
  sm: "0.75rem",
76
- md: "0.875",
77
- lg: "1rem",
75
+ md: "0.875rem",
76
+ lg: "1.0rem",
78
77
  xl: "1.25rem",
79
78
  "2xl": "2rem"
80
79
  };
@@ -180,20 +179,62 @@ var Button = styled("button", {
180
179
  },
181
180
  size: {
182
181
  sm: {
183
- height: 38
182
+ height: 38,
183
+ fontSize: "$sm"
184
184
  },
185
185
  md: {
186
- height: 46
186
+ height: 46,
187
+ fontSize: "$lg"
188
+ },
189
+ lg: {
190
+ height: 54,
191
+ fontSize: "$xl"
187
192
  }
193
+ },
194
+ flat: {
195
+ true: {
196
+ border: 0,
197
+ background: "transparent",
198
+ "&:disabled": {
199
+ color: "$gray200",
200
+ background: "transparent",
201
+ border: "none"
202
+ }
203
+ },
204
+ false: {}
188
205
  }
189
206
  },
190
207
  defaultVariants: {
191
208
  variant: "primary",
209
+ size: "md",
210
+ flat: false
211
+ }
212
+ });
213
+
214
+ // src/components/Text.tsx
215
+ var Text = styled("p", {
216
+ fontFamily: "$web",
217
+ lineHeight: "$base",
218
+ margin: 0,
219
+ color: "$white",
220
+ variants: {
221
+ size: {
222
+ xxs: { fontSize: "$xxs" },
223
+ xs: { fontSize: "$xs" },
224
+ sm: { fontSize: "$sm" },
225
+ md: { fontSize: "$md" },
226
+ lg: { fontSize: "$lg" },
227
+ xl: { fontSize: "$xl" },
228
+ "2xl": { fontSize: "$2xl" }
229
+ }
230
+ },
231
+ defaultVariants: {
192
232
  size: "md"
193
233
  }
194
234
  });
195
235
  export {
196
236
  Button,
237
+ Text,
197
238
  config,
198
239
  createTheme,
199
240
  css,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dafaz-ui/react",
3
- "version": "2.0.1",
3
+ "version": "2.1.0",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.ts",
@@ -76,23 +76,42 @@ export const Button = styled('button', {
76
76
  size: {
77
77
  sm: {
78
78
  height: 38,
79
+ fontSize: '$sm',
79
80
  },
80
81
  md: {
81
82
  height: 46,
83
+ fontSize: '$lg',
84
+ },
85
+ lg: {
86
+ height: 54,
87
+ fontSize: '$xl',
82
88
  },
83
89
  },
84
- },
90
+ flat: {
91
+ true: {
92
+ border: 0,
93
+ background: 'transparent',
85
94
 
95
+ '&:disabled': {
96
+ color: '$gray200',
97
+ background: 'transparent',
98
+ border: 'none',
99
+ },
100
+ },
101
+ false: {},
102
+ },
103
+ },
86
104
  defaultVariants: {
87
105
  variant: 'primary',
88
106
  size: 'md',
107
+ flat: false,
89
108
  },
90
109
  })
91
110
 
92
111
  export interface ButtonProps extends ComponentProps<typeof Button> {
93
112
  as?: ElementType
94
113
  /** How large should the button be? */
95
- size?: 'sm' | 'md'
114
+ size?: 'sm' | 'md' | 'lg'
96
115
  /** Optional click handler */
97
116
  onClick?: () => void
98
117
  /** Button contents */
@@ -101,4 +120,6 @@ export interface ButtonProps extends ComponentProps<typeof Button> {
101
120
  disabled?: boolean
102
121
  //** Button UI mode */
103
122
  variant?: 'primary' | 'secondary' | 'tertiary'
123
+ //** Flat mode */
124
+ flat?: boolean
104
125
  }
@@ -0,0 +1,31 @@
1
+ import type { ComponentProps, ElementType } from 'react'
2
+ import { styled } from '../styles'
3
+
4
+ export const Text = styled('p', {
5
+ fontFamily: '$web',
6
+ lineHeight: '$base',
7
+ margin: 0,
8
+ color: '$white',
9
+
10
+ variants: {
11
+ size: {
12
+ xxs: { fontSize: '$xxs' },
13
+ xs: { fontSize: '$xs' },
14
+ sm: { fontSize: '$sm' },
15
+ md: { fontSize: '$md' },
16
+ lg: { fontSize: '$lg' },
17
+ xl: { fontSize: '$xl' },
18
+ '2xl': { fontSize: '$2xl' },
19
+ },
20
+ },
21
+
22
+ defaultVariants: {
23
+ size: 'md',
24
+ },
25
+ })
26
+
27
+ export interface TextProps extends ComponentProps<typeof Text> {
28
+ as?: ElementType
29
+ content: string
30
+ size?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'
31
+ }
package/src/index.tsx CHANGED
@@ -1,3 +1,4 @@
1
1
  export * from './components/Button'
2
+ export * from './components/Text'
2
3
 
3
4
  export * from './styles'