@bolio-ui/core 1.0.6 → 1.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 (102) hide show
  1. package/dist/Avatar/index.js +38 -37
  2. package/dist/Badge/index.js +40 -39
  3. package/dist/BolioUIProvider/index.js +44 -43
  4. package/dist/Breadcrumbs/index.js +37 -36
  5. package/dist/Button/index.js +44 -43
  6. package/dist/ButtonDropdown/index.js +90 -78
  7. package/dist/ButtonDropdown/styles.d.ts +1 -0
  8. package/dist/ButtonGroup/index.js +38 -35
  9. package/dist/Capacity/index.js +33 -32
  10. package/dist/Card/Card.d.ts +1 -0
  11. package/dist/Card/index.js +69 -58
  12. package/dist/Checkbox/index.js +194 -175
  13. package/dist/Code/index.js +33 -32
  14. package/dist/Collapse/index.js +33 -32
  15. package/dist/Container/index.js +29 -29
  16. package/dist/CssBaseline/index.js +29 -29
  17. package/dist/Description/index.js +33 -32
  18. package/dist/Display/index.js +33 -32
  19. package/dist/Divider/index.js +33 -32
  20. package/dist/Dot/Dot.d.ts +1 -0
  21. package/dist/Dot/index.js +43 -40
  22. package/dist/Drawer/index.js +33 -32
  23. package/dist/Fieldset/index.js +33 -32
  24. package/dist/Grid/index.js +33 -32
  25. package/dist/Image/index.js +33 -32
  26. package/dist/Input/InputProps.d.ts +1 -0
  27. package/dist/Input/index.js +83 -72
  28. package/dist/Input/styles.d.ts +2 -0
  29. package/dist/Keyboard/index.js +33 -32
  30. package/dist/Link/index.js +33 -32
  31. package/dist/Loading/index.js +33 -32
  32. package/dist/MdxWidgets/index.js +29 -29
  33. package/dist/Modal/index.js +44 -43
  34. package/dist/Note/index.js +33 -32
  35. package/dist/Page/index.js +33 -32
  36. package/dist/Pagination/index.js +33 -32
  37. package/dist/Popover/index.js +33 -32
  38. package/dist/Progress/index.js +33 -32
  39. package/dist/Radio/index.js +33 -32
  40. package/dist/Rating/index.js +33 -32
  41. package/dist/Row/index.js +29 -29
  42. package/dist/Section/index.js +33 -32
  43. package/dist/Select/index.js +99 -96
  44. package/dist/Select/styles.d.ts +5 -4
  45. package/dist/Slider/index.js +33 -32
  46. package/dist/Snippet/index.js +33 -32
  47. package/dist/Spacer/index.js +33 -32
  48. package/dist/Spinner/index.js +33 -32
  49. package/dist/Table/index.js +33 -32
  50. package/dist/Tabs/index.js +36 -35
  51. package/dist/Tag/index.js +33 -32
  52. package/dist/Text/index.js +33 -32
  53. package/dist/Textarea/index.js +68 -57
  54. package/dist/Themes/index.js +29 -29
  55. package/dist/Toggle/index.js +40 -39
  56. package/dist/Tooltip/index.js +33 -32
  57. package/dist/index.js +333 -277
  58. package/dist/use-all-themes/index.js +29 -29
  59. package/dist/use-media-query/index.js +29 -29
  60. package/dist/use-scale/index.js +33 -32
  61. package/dist/use-theme/index.js +29 -29
  62. package/esm/Avatar/Avatar.js +5 -5
  63. package/esm/Badge/Badge.js +7 -7
  64. package/esm/Badge/stories.js +1 -1
  65. package/esm/Breadcrumbs/Breadcrumbs.js +4 -4
  66. package/esm/Button/Button.js +3 -3
  67. package/esm/Button/styles.js +8 -8
  68. package/esm/ButtonDropdown/ButtonDropdown.js +13 -13
  69. package/esm/ButtonDropdown/ButtonDropdownItem.js +3 -3
  70. package/esm/ButtonDropdown/Icon.js +1 -1
  71. package/esm/ButtonDropdown/styles.d.ts +1 -0
  72. package/esm/ButtonDropdown/styles.js +40 -29
  73. package/esm/ButtonGroup/ButtonGroup.js +5 -3
  74. package/esm/Capacity/stories.js +40 -10
  75. package/esm/Card/Card.d.ts +1 -0
  76. package/esm/Card/Card.js +8 -7
  77. package/esm/Card/stories.js +56 -7
  78. package/esm/Card/styles.js +28 -19
  79. package/esm/Checkbox/Checkbox.js +6 -6
  80. package/esm/Checkbox/CheckboxIcon.js +34 -16
  81. package/esm/Dot/Dot.d.ts +1 -0
  82. package/esm/Dot/Dot.js +10 -8
  83. package/esm/Input/Input.js +15 -15
  84. package/esm/Input/InputProps.d.ts +1 -0
  85. package/esm/Input/styles.d.ts +2 -0
  86. package/esm/Input/styles.js +28 -14
  87. package/esm/Select/Select.js +10 -15
  88. package/esm/Select/SelectDropdown.js +4 -4
  89. package/esm/Select/SelectIconClear.js +7 -7
  90. package/esm/Select/SelectMultipleValue.js +4 -4
  91. package/esm/Select/SelectOption.js +6 -6
  92. package/esm/Select/styles.d.ts +5 -4
  93. package/esm/Select/styles.js +35 -28
  94. package/esm/Tabs/TabsItem.js +3 -3
  95. package/esm/Textarea/Textarea.js +7 -11
  96. package/esm/Themes/Presets/Dark.js +16 -16
  97. package/esm/Themes/Presets/Default.js +12 -12
  98. package/esm/Themes/Presets/Shared.js +1 -1
  99. package/esm/Toggle/Toggle.js +7 -7
  100. package/esm/use-scale/utils.js +4 -3
  101. package/examples/create-redwoodjs/.redwood/README.md +44 -0
  102. package/package.json +19 -19
package/dist/Breadcrumbs/index.js CHANGED
@@ -268,7 +268,7 @@ var defaultLayout = {
268
268
  pageWidthWithMargin: '930pt',
269
269
  breakpointMobile: defaultBreakpoints.xs.max,
270
270
  breakpointTablet: defaultBreakpoints.sm.max,
271
- radius: '6px',
271
+ radius: '10px',
272
272
  unit: '16px'
273
273
  };
274
274
 
@@ -283,32 +283,32 @@ var palette$1 = {
283
283
  accents_6: '#444',
284
284
  accents_7: '#333',
285
285
  accents_8: '#111',
286
- selection: '#cee4fe',
286
+ selection: 'rgba(206,228,254, 0.5)',
287
287
  code: '#C25FFF',
288
- border: '#999',
288
+ border: '#eaeaea',
289
289
  primary: '#0072F6',
290
- primaryLight: '#96C1F3',
291
- primaryLighter: '#CEE4FF',
290
+ primaryLight: '#CEE4FF',
291
+ primaryLighter: '#96C1F3',
292
292
  primaryDark: '#00254E',
293
293
  secondary: '#7828C9',
294
- secondaryLighter: '#D1B1F1',
295
294
  secondaryLight: '#EADCF9',
295
+ secondaryLighter: '#D1B1F1',
296
296
  secondaryDark: '#290E45',
297
297
  error: '#F31261',
298
- errorLight: '#FAA8C6',
299
- errorLighter: '#FDD8E6',
298
+ errorLight: '#FDD8E6',
299
+ errorLighter: '#FAA8C6',
300
300
  errorDark: '#4E041F',
301
301
  success: '#17C965',
302
- successLight: '#ADF5CD',
303
- successLighter: '#DAFBE9',
302
+ successLight: '#DAFBE9',
303
+ successLighter: '#ADF5CD',
304
304
  successDark: '#06371C',
305
305
  warning: '#F5A525',
306
- warningLight: '#FBDBA8',
307
- warningLighter: '#FDEFD9',
306
+ warningLight: '#FDEFD9',
307
+ warningLighter: '#FBDBA8',
308
308
  warningDark: '#4E3105',
309
309
  info: '#06B7DC',
310
- infoLighter: '#A5EEFE',
311
310
  infoLight: '#D7F8FF',
311
+ infoLighter: '#A5EEFE',
312
312
  infoDark: '#053B49',
313
313
  purple: '#f81ce5',
314
314
  alert: '#ff0080',
@@ -350,37 +350,37 @@ var palette = {
350
350
  accents_6: '#999',
351
351
  accents_7: '#eaeaea',
352
352
  accents_8: '#fafafa',
353
- selection: '#f81ce5',
353
+ selection: 'rgba(248,28,229, 0.5)',
354
354
  code: '#C25FFF',
355
- border: '#444',
355
+ border: '#333',
356
356
  primary: '#0072F6',
357
- primaryLight: '#96C1F3',
358
- primaryLighter: '#CEE4FF',
357
+ primaryLight: '#CEE4FF',
358
+ primaryLighter: '#96C1F3',
359
359
  primaryDark: '#00254E',
360
360
  secondary: '#7828C9',
361
- secondaryLighter: '#D1B1F1',
362
361
  secondaryLight: '#EADCF9',
362
+ secondaryLighter: '#D1B1F1',
363
363
  secondaryDark: '#290E45',
364
364
  error: '#F31261',
365
- errorLight: '#FAA8C6',
366
- errorLighter: '#FDD8E6',
365
+ errorLight: '#FDD8E6',
366
+ errorLighter: '#FAA8C6',
367
367
  errorDark: '#4E041F',
368
368
  success: '#17C965',
369
- successLight: '#ADF5CD',
370
- successLighter: '#DAFBE9',
369
+ successLight: '#DAFBE9',
370
+ successLighter: '#ADF5CD',
371
371
  successDark: '#06371C',
372
372
  warning: '#F5A525',
373
- warningLight: '#FBDBA8',
374
- warningLighter: '#FDEFD9',
373
+ warningLight: '#FDEFD9',
374
+ warningLighter: '#FBDBA8',
375
375
  warningDark: '#4E3105',
376
376
  info: '#06B7DC',
377
- infoLighter: '#A5EEFE',
378
377
  infoLight: '#D7F8FF',
378
+ infoLighter: '#A5EEFE',
379
379
  infoDark: '#053B49',
380
380
  purple: '#f81ce5',
381
381
  alert: '#ff0080',
382
382
  link: '#3291ff',
383
- pre: '#363450'
383
+ pre: '#111'
384
384
  };
385
385
  var expressiveness = {
386
386
  linkStyle: 'none',
@@ -388,9 +388,9 @@ var expressiveness = {
388
388
  dropdownBoxShadow: '0 0 0 1px #333',
389
389
  scrollerStart: 'rgba(255, 255, 255, 1)',
390
390
  scrollerEnd: 'rgba(255, 255, 255, 0)',
391
- shadowSmall: '0 0 0 1px #333',
392
- shadowMedium: '0 0 0 1px #333',
393
- shadowLarge: '0 0 0 1px #333',
391
+ shadowSmall: '0 5px 10px rgba(255, 255, 255, 0.12)',
392
+ shadowMedium: '0 8px 30px rgba(255, 255, 255, 0.12)',
393
+ shadowLarge: '0 30px 60px rgba(255, 255, 255, 0.12)',
394
394
  portalOpacity: 0.75
395
395
  };
396
396
  var font = defaultFont;
@@ -595,9 +595,10 @@ var generateGetAllScaleProps = function generateGetAllScaleProps(props) {
595
595
  for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
596
596
  var key = _step2.value;
597
597
  var value = props[key];
598
- console.log('🚀 ~ file: utils.ts:32 ~ value:', value); // if (typeof value !== 'undefined') {
599
- // scaleProps[key as keyof ScaleProps] = value as any
600
- // }
598
+
599
+ if (typeof value !== 'undefined') {
600
+ scaleProps[key] = value;
601
+ }
601
602
  }
602
603
  } catch (err) {
603
604
  _iterator2.e(err);
@@ -854,11 +855,11 @@ function BreadcrumbsComponent(_ref) {
854
855
  return item;
855
856
  });
856
857
  return /*#__PURE__*/React__default["default"].createElement("nav", {
857
- className: styledJsx_cjs.style.dynamic([["2655258916", [theme.palette.accents_4, SCALES.font(1), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverColor, theme.palette.accents_6]]]) + " " + (className || "")
858
+ className: styledJsx_cjs.style.dynamic([["3435904432", [theme.palette.accents_5, SCALES.font(1), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverColor, theme.palette.accents_7]]]) + " " + (className || "")
858
859
  }, withSeparatorChildren, /*#__PURE__*/React__default["default"].createElement(styledJsx_cjs.style, {
859
- id: "2655258916",
860
- dynamic: [theme.palette.accents_4, SCALES.font(1), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverColor, theme.palette.accents_6]
861
- }, "nav.__jsx-style-dynamic-selector{line-height:inherit;color:".concat(theme.palette.accents_4, ";box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:").concat(SCALES.font(1), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}nav.__jsx-style-dynamic-selector .link:hover{color:").concat(hoverColor, ";}nav.__jsx-style-dynamic-selector>span:last-of-type{color:").concat(theme.palette.accents_6, ";}nav.__jsx-style-dynamic-selector>.separator:last-child{display:none;}nav.__jsx-style-dynamic-selector svg{width:1em;height:1em;margin:0 4px;}nav.__jsx-style-dynamic-selector .breadcrumbs-item{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}")));
860
+ id: "3435904432",
861
+ dynamic: [theme.palette.accents_5, SCALES.font(1), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverColor, theme.palette.accents_7]
862
+ }, "nav.__jsx-style-dynamic-selector{line-height:inherit;color:".concat(theme.palette.accents_5, ";box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:").concat(SCALES.font(1), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}nav.__jsx-style-dynamic-selector .link:hover{color:").concat(hoverColor, ";}nav.__jsx-style-dynamic-selector>span:last-of-type{color:").concat(theme.palette.accents_7, ";}nav.__jsx-style-dynamic-selector>.separator:last-child{display:none;}nav.__jsx-style-dynamic-selector svg{width:1em;height:1em;margin:0 4px;}nav.__jsx-style-dynamic-selector .breadcrumbs-item{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}")));
862
863
  }
863
864
 
864
865
  BreadcrumbsComponent.displayName = 'BolioUIBreadcrumbs';
package/dist/Button/index.js CHANGED
@@ -305,7 +305,7 @@ var defaultLayout = {
305
305
  pageWidthWithMargin: '930pt',
306
306
  breakpointMobile: defaultBreakpoints.xs.max,
307
307
  breakpointTablet: defaultBreakpoints.sm.max,
308
- radius: '6px',
308
+ radius: '10px',
309
309
  unit: '16px'
310
310
  };
311
311
 
@@ -320,32 +320,32 @@ var palette$1 = {
320
320
  accents_6: '#444',
321
321
  accents_7: '#333',
322
322
  accents_8: '#111',
323
- selection: '#cee4fe',
323
+ selection: 'rgba(206,228,254, 0.5)',
324
324
  code: '#C25FFF',
325
- border: '#999',
325
+ border: '#eaeaea',
326
326
  primary: '#0072F6',
327
- primaryLight: '#96C1F3',
328
- primaryLighter: '#CEE4FF',
327
+ primaryLight: '#CEE4FF',
328
+ primaryLighter: '#96C1F3',
329
329
  primaryDark: '#00254E',
330
330
  secondary: '#7828C9',
331
- secondaryLighter: '#D1B1F1',
332
331
  secondaryLight: '#EADCF9',
332
+ secondaryLighter: '#D1B1F1',
333
333
  secondaryDark: '#290E45',
334
334
  error: '#F31261',
335
- errorLight: '#FAA8C6',
336
- errorLighter: '#FDD8E6',
335
+ errorLight: '#FDD8E6',
336
+ errorLighter: '#FAA8C6',
337
337
  errorDark: '#4E041F',
338
338
  success: '#17C965',
339
- successLight: '#ADF5CD',
340
- successLighter: '#DAFBE9',
339
+ successLight: '#DAFBE9',
340
+ successLighter: '#ADF5CD',
341
341
  successDark: '#06371C',
342
342
  warning: '#F5A525',
343
- warningLight: '#FBDBA8',
344
- warningLighter: '#FDEFD9',
343
+ warningLight: '#FDEFD9',
344
+ warningLighter: '#FBDBA8',
345
345
  warningDark: '#4E3105',
346
346
  info: '#06B7DC',
347
- infoLighter: '#A5EEFE',
348
347
  infoLight: '#D7F8FF',
348
+ infoLighter: '#A5EEFE',
349
349
  infoDark: '#053B49',
350
350
  purple: '#f81ce5',
351
351
  alert: '#ff0080',
@@ -387,37 +387,37 @@ var palette = {
387
387
  accents_6: '#999',
388
388
  accents_7: '#eaeaea',
389
389
  accents_8: '#fafafa',
390
- selection: '#f81ce5',
390
+ selection: 'rgba(248,28,229, 0.5)',
391
391
  code: '#C25FFF',
392
- border: '#444',
392
+ border: '#333',
393
393
  primary: '#0072F6',
394
- primaryLight: '#96C1F3',
395
- primaryLighter: '#CEE4FF',
394
+ primaryLight: '#CEE4FF',
395
+ primaryLighter: '#96C1F3',
396
396
  primaryDark: '#00254E',
397
397
  secondary: '#7828C9',
398
- secondaryLighter: '#D1B1F1',
399
398
  secondaryLight: '#EADCF9',
399
+ secondaryLighter: '#D1B1F1',
400
400
  secondaryDark: '#290E45',
401
401
  error: '#F31261',
402
- errorLight: '#FAA8C6',
403
- errorLighter: '#FDD8E6',
402
+ errorLight: '#FDD8E6',
403
+ errorLighter: '#FAA8C6',
404
404
  errorDark: '#4E041F',
405
405
  success: '#17C965',
406
- successLight: '#ADF5CD',
407
- successLighter: '#DAFBE9',
406
+ successLight: '#DAFBE9',
407
+ successLighter: '#ADF5CD',
408
408
  successDark: '#06371C',
409
409
  warning: '#F5A525',
410
- warningLight: '#FBDBA8',
411
- warningLighter: '#FDEFD9',
410
+ warningLight: '#FDEFD9',
411
+ warningLighter: '#FBDBA8',
412
412
  warningDark: '#4E3105',
413
413
  info: '#06B7DC',
414
- infoLighter: '#A5EEFE',
415
414
  infoLight: '#D7F8FF',
415
+ infoLighter: '#A5EEFE',
416
416
  infoDark: '#053B49',
417
417
  purple: '#f81ce5',
418
418
  alert: '#ff0080',
419
419
  link: '#3291ff',
420
- pre: '#363450'
420
+ pre: '#111'
421
421
  };
422
422
  var expressiveness = {
423
423
  linkStyle: 'none',
@@ -425,9 +425,9 @@ var expressiveness = {
425
425
  dropdownBoxShadow: '0 0 0 1px #333',
426
426
  scrollerStart: 'rgba(255, 255, 255, 1)',
427
427
  scrollerEnd: 'rgba(255, 255, 255, 0)',
428
- shadowSmall: '0 0 0 1px #333',
429
- shadowMedium: '0 0 0 1px #333',
430
- shadowLarge: '0 0 0 1px #333',
428
+ shadowSmall: '0 5px 10px rgba(255, 255, 255, 0.12)',
429
+ shadowMedium: '0 8px 30px rgba(255, 255, 255, 0.12)',
430
+ shadowLarge: '0 30px 60px rgba(255, 255, 255, 0.12)',
431
431
  portalOpacity: 0.75
432
432
  };
433
433
  var font = defaultFont;
@@ -580,9 +580,10 @@ var generateGetAllScaleProps = function generateGetAllScaleProps(props) {
580
580
  for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
581
581
  var key = _step2.value;
582
582
  var value = props[key];
583
- console.log('🚀 ~ file: utils.ts:32 ~ value:', value); // if (typeof value !== 'undefined') {
584
- // scaleProps[key as keyof ScaleProps] = value as any
585
- // }
583
+
584
+ if (typeof value !== 'undefined') {
585
+ scaleProps[key] = value;
586
+ }
586
587
  }
587
588
  } catch (err) {
588
589
  _iterator2.e(err);
@@ -1030,9 +1031,9 @@ var getButtonColors = function getButtonColors(palette, props) {
1030
1031
  ghost = props.ghost;
1031
1032
  var colors = {
1032
1033
  "default": {
1033
- bg: palette.background,
1034
- border: palette.border,
1035
- color: palette.accents_5
1034
+ bg: palette.accents_2,
1035
+ border: palette.accents_2,
1036
+ color: palette.foreground
1036
1037
  },
1037
1038
  primary: {
1038
1039
  bg: palette.primary,
@@ -1071,9 +1072,9 @@ var getButtonColors = function getButtonColors(palette, props) {
1071
1072
  }
1072
1073
  };
1073
1074
  if (disabled) return {
1074
- bg: palette.accents_1,
1075
- border: palette.accents_2,
1076
- color: '#ccc'
1075
+ bg: palette.accents_3,
1076
+ border: palette.accents_3,
1077
+ color: palette.accents_5
1077
1078
  };
1078
1079
  /**
1079
1080
  * The '-light' type is the same color as the common type,
@@ -1186,7 +1187,7 @@ var getButtonHoverColors = function getButtonHoverColors(palette, props) {
1186
1187
  })
1187
1188
  };
1188
1189
  if (disabled) return {
1189
- bg: palette.accents_1,
1190
+ bg: palette.accents_2,
1190
1191
  border: palette.accents_2,
1191
1192
  color: '#ccc'
1192
1193
  };
@@ -1217,7 +1218,7 @@ var getButtonDripColor = function getButtonDripColor(palette, props) {
1217
1218
  var type = props.type;
1218
1219
  var isLightHover = type === null || type === void 0 ? void 0 : type.endsWith('light');
1219
1220
  var hoverColors = getButtonHoverColors(palette, props);
1220
- return isLightHover ? addColorAlpha(hoverColors.bg, 0.65) : addColorAlpha(palette.accents_2, 0.65);
1221
+ return isLightHover ? addColorAlpha(hoverColors.bg, 0.65) : addColorAlpha(palette.accents_3, 0.65);
1221
1222
  };
1222
1223
 
1223
1224
  var _excluded = ["children", "disabled", "type", "loading", "shadow", "ghost", "rounded", "effect", "onClick", "auto", "icon", "htmlType", "iconRight", "className"];
@@ -1336,7 +1337,7 @@ var ButtonComponent = /*#__PURE__*/React__default["default"].forwardRef(function
1336
1337
  disabled: disabled,
1337
1338
  onClick: clickHandler
1338
1339
  }, props, {
1339
- className: styledJsx_cjs.style.dynamic([["3337261033", [rounded ? '25px' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? '0 4px 10px 0' + bg : 'none', SCALES.pl(0.75), SCALES.height(2.5), color, bg, auto ? 'min-content' : SCALES.width(10.5), auto ? 'auto' : 'initial', SCALES.height(2.5), SCALES.pt(0), paddingRight, SCALES.pb(0), paddingLeft, SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hover.color, hover.color, hover.bg, hover.border, cursor, events]]]) + " " + (props && props.className != null && props.className || useClasses$1('btn', className) || "")
1340
+ className: styledJsx_cjs.style.dynamic([["1204671885", [rounded ? '25px' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? '0 4px 10px 0' + bg : 'none', SCALES.pl(0.75), SCALES.height(2.5), color, bg, auto ? 'min-content' : SCALES.width(10.5), auto ? 'auto' : 'initial', SCALES.height(2.5), SCALES.pt(0), paddingRight, SCALES.pb(0), paddingLeft, SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hover.color, hover.color, hover.bg, hover.border, cursor, events]]]) + " " + (props && props.className != null && props.className || useClasses$1('btn', className) || "")
1340
1341
  }), loading && /*#__PURE__*/React__default["default"].createElement(ButtonLoading, {
1341
1342
  color: color
1342
1343
  }), childrenWithIcon, dripShow && /*#__PURE__*/React__default["default"].createElement(ButtonDrip$1, {
@@ -1345,9 +1346,9 @@ var ButtonComponent = /*#__PURE__*/React__default["default"].forwardRef(function
1345
1346
  color: dripColor,
1346
1347
  onCompleted: dripCompletedHandle
1347
1348
  }), /*#__PURE__*/React__default["default"].createElement(styledJsx_cjs.style, {
1348
- id: "3337261033",
1349
+ id: "1204671885",
1349
1350
  dynamic: [rounded ? '25px' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? '0 4px 10px 0' + bg : 'none', SCALES.pl(0.75), SCALES.height(2.5), color, bg, auto ? 'min-content' : SCALES.width(10.5), auto ? 'auto' : 'initial', SCALES.height(2.5), SCALES.pt(0), paddingRight, SCALES.pb(0), paddingLeft, SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hover.color, hover.color, hover.bg, hover.border, cursor, events]
1350
- }, ".btn.__jsx-style-dynamic-selector{box-sizing:border-box;display:inline-block;border-radius:".concat(rounded ? '25px' : theme.layout.radius, ";font-weight:500;font-size:").concat(SCALES.font(0.875), ";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:none;text-transform:capitalize;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center;white-space:nowrap;-webkit-transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;position:relative;overflow:hidden;color:").concat(color, ";background-color:").concat(bg, ";border:1px solid ").concat(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? '0 4px 10px 0' + bg : 'none', ";--bolio-ui-button-icon-padding:").concat(SCALES.pl(0.75), ";--bolio-ui-button-height:").concat(SCALES.height(2.5), ";--bolio-ui-button-color:").concat(color, ";--bolio-ui-button-bg:").concat(bg, ";min-width:").concat(auto ? 'min-content' : SCALES.width(10.5), ";width:").concat(auto ? 'auto' : 'initial', ";height:").concat(SCALES.height(2.5), ";padding:").concat(SCALES.pt(0), " ").concat(paddingRight, " ").concat(SCALES.pb(0), " ").concat(paddingLeft, ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.btn.__jsx-style-dynamic-selector:hover,.btn.__jsx-style-dynamic-selector:focus{color:").concat(hover.color, ";--bolio-ui-button-color:").concat(hover.color, ";background-color:").concat(hover.bg, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";}.btn.__jsx-style-dynamic-selector:active{-webkit-transform:scale(0.98,0.98);-ms-transform:scale(0.98,0.98);transform:scale(0.98,0.98);}.btn.__jsx-style-dynamic-selector .text{position:relative;z-index:1;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;line-height:inherit;}.btn.__jsx-style-dynamic-selector .text p,.btn.__jsx-style-dynamic-selector .text pre,.btn.__jsx-style-dynamic-selector .text div{margin:0;}")));
1351
+ }, ".btn.__jsx-style-dynamic-selector{box-sizing:border-box;display:inline-block;border-radius:".concat(rounded ? '25px' : theme.layout.radius, ";font-weight:bold;font-size:").concat(SCALES.font(0.875), ";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:none;text-transform:capitalize;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center;white-space:nowrap;-webkit-transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;position:relative;overflow:hidden;color:").concat(color, ";background-color:").concat(bg, ";border:1px solid ").concat(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? '0 4px 10px 0' + bg : 'none', ";--bolio-ui-button-icon-padding:").concat(SCALES.pl(0.75), ";--bolio-ui-button-height:").concat(SCALES.height(2.5), ";--bolio-ui-button-color:").concat(color, ";--bolio-ui-button-bg:").concat(bg, ";min-width:").concat(auto ? 'min-content' : SCALES.width(10.5), ";width:").concat(auto ? 'auto' : 'initial', ";height:").concat(SCALES.height(2.5), ";padding:").concat(SCALES.pt(0), " ").concat(paddingRight, " ").concat(SCALES.pb(0), " ").concat(paddingLeft, ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.btn.__jsx-style-dynamic-selector:hover,.btn.__jsx-style-dynamic-selector:focus{cursor:").concat(cursor, ";pointer-events:").concat(events, ";}.btn.__jsx-style-dynamic-selector:active{-webkit-transform:scale(0.98,0.98);-ms-transform:scale(0.98,0.98);transform:scale(0.98,0.98);}.btn.__jsx-style-dynamic-selector .text{position:relative;z-index:1;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;line-height:inherit;}.btn.__jsx-style-dynamic-selector .text p,.btn.__jsx-style-dynamic-selector .text pre,.btn.__jsx-style-dynamic-selector .text div{margin:0;}")));
1351
1352
  });
1352
1353
  ButtonComponent.defaultProps = defaultProps;
1353
1354
  ButtonComponent.displayName = 'BolioUIButton';