@a-type/ui 2.6.2 → 2.7.1

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 (108) hide show
  1. package/dist/cjs/components/button/Button.d.ts +14 -1
  2. package/dist/cjs/components/button/Button.js +84 -8
  3. package/dist/cjs/components/button/Button.js.map +1 -1
  4. package/dist/cjs/components/button/Button.stories.d.ts +14 -1
  5. package/dist/cjs/components/button/Button.stories.js +27 -6
  6. package/dist/cjs/components/button/Button.stories.js.map +1 -1
  7. package/dist/cjs/components/button/classes.d.ts +2 -2
  8. package/dist/cjs/components/button/classes.js +12 -7
  9. package/dist/cjs/components/button/classes.js.map +1 -1
  10. package/dist/cjs/components/camera/Camera.js +3 -3
  11. package/dist/cjs/components/camera/Camera.js.map +1 -1
  12. package/dist/cjs/components/card/Card.d.ts +2 -2
  13. package/dist/cjs/components/card/Card.stories.js +7 -7
  14. package/dist/cjs/components/card/Card.stories.js.map +1 -1
  15. package/dist/cjs/components/datePicker/DatePicker.js +4 -4
  16. package/dist/cjs/components/datePicker/DatePicker.js.map +1 -1
  17. package/dist/cjs/components/emojiPicker/EmojiPicker.js +2 -2
  18. package/dist/cjs/components/emojiPicker/EmojiPicker.js.map +1 -1
  19. package/dist/cjs/components/horizontalList/HorizontalList.js +1 -1
  20. package/dist/cjs/components/horizontalList/HorizontalList.js.map +1 -1
  21. package/dist/cjs/components/horizontalList/HorizontalList.stories.js +2 -2
  22. package/dist/cjs/components/horizontalList/HorizontalList.stories.js.map +1 -1
  23. package/dist/cjs/components/icon/Icon.js +7 -1
  24. package/dist/cjs/components/icon/Icon.js.map +1 -1
  25. package/dist/cjs/components/icon/IconLoadingContext.d.ts +2 -0
  26. package/dist/cjs/components/icon/IconLoadingContext.js +12 -0
  27. package/dist/cjs/components/icon/IconLoadingContext.js.map +1 -0
  28. package/dist/cjs/components/imageUploader/ImageUploader.js +1 -1
  29. package/dist/cjs/components/imageUploader/ImageUploader.js.map +1 -1
  30. package/dist/cjs/components/particles/ParticleLayer.stories.js +1 -1
  31. package/dist/cjs/components/particles/ParticleLayer.stories.js.map +1 -1
  32. package/dist/cjs/components/select/Select.d.ts +1 -1
  33. package/dist/cjs/components/select/Select.js +6 -5
  34. package/dist/cjs/components/select/Select.js.map +1 -1
  35. package/dist/cjs/components/spinner/Spinner.js +1 -1
  36. package/dist/cjs/components/spinner/Spinner.js.map +1 -1
  37. package/dist/cjs/themes.stories.d.ts +1 -0
  38. package/dist/cjs/themes.stories.js +2 -1
  39. package/dist/cjs/themes.stories.js.map +1 -1
  40. package/dist/cjs/uno/colors.d.ts +1 -0
  41. package/dist/cjs/uno/colors.js +1 -0
  42. package/dist/cjs/uno/colors.js.map +1 -1
  43. package/dist/cjs/uno/shadows.js +11 -8
  44. package/dist/cjs/uno/shadows.js.map +1 -1
  45. package/dist/css/main.css +12 -12
  46. package/dist/esm/components/button/Button.d.ts +14 -1
  47. package/dist/esm/components/button/Button.js +82 -7
  48. package/dist/esm/components/button/Button.js.map +1 -1
  49. package/dist/esm/components/button/Button.stories.d.ts +14 -1
  50. package/dist/esm/components/button/Button.stories.js +27 -6
  51. package/dist/esm/components/button/Button.stories.js.map +1 -1
  52. package/dist/esm/components/button/classes.d.ts +2 -2
  53. package/dist/esm/components/button/classes.js +13 -8
  54. package/dist/esm/components/button/classes.js.map +1 -1
  55. package/dist/esm/components/camera/Camera.js +3 -3
  56. package/dist/esm/components/camera/Camera.js.map +1 -1
  57. package/dist/esm/components/card/Card.d.ts +2 -2
  58. package/dist/esm/components/card/Card.stories.js +7 -7
  59. package/dist/esm/components/card/Card.stories.js.map +1 -1
  60. package/dist/esm/components/datePicker/DatePicker.js +4 -4
  61. package/dist/esm/components/datePicker/DatePicker.js.map +1 -1
  62. package/dist/esm/components/emojiPicker/EmojiPicker.js +2 -2
  63. package/dist/esm/components/emojiPicker/EmojiPicker.js.map +1 -1
  64. package/dist/esm/components/horizontalList/HorizontalList.js +1 -1
  65. package/dist/esm/components/horizontalList/HorizontalList.js.map +1 -1
  66. package/dist/esm/components/horizontalList/HorizontalList.stories.js +2 -2
  67. package/dist/esm/components/horizontalList/HorizontalList.stories.js.map +1 -1
  68. package/dist/esm/components/icon/Icon.js +7 -1
  69. package/dist/esm/components/icon/Icon.js.map +1 -1
  70. package/dist/esm/components/icon/IconLoadingContext.d.ts +2 -0
  71. package/dist/esm/components/icon/IconLoadingContext.js +8 -0
  72. package/dist/esm/components/icon/IconLoadingContext.js.map +1 -0
  73. package/dist/esm/components/imageUploader/ImageUploader.js +1 -1
  74. package/dist/esm/components/imageUploader/ImageUploader.js.map +1 -1
  75. package/dist/esm/components/particles/ParticleLayer.stories.js +1 -1
  76. package/dist/esm/components/particles/ParticleLayer.stories.js.map +1 -1
  77. package/dist/esm/components/select/Select.d.ts +1 -1
  78. package/dist/esm/components/select/Select.js +2 -1
  79. package/dist/esm/components/select/Select.js.map +1 -1
  80. package/dist/esm/components/spinner/Spinner.js +1 -1
  81. package/dist/esm/components/spinner/Spinner.js.map +1 -1
  82. package/dist/esm/themes.stories.d.ts +1 -0
  83. package/dist/esm/themes.stories.js +2 -1
  84. package/dist/esm/themes.stories.js.map +1 -1
  85. package/dist/esm/uno/colors.d.ts +1 -0
  86. package/dist/esm/uno/colors.js +1 -0
  87. package/dist/esm/uno/colors.js.map +1 -1
  88. package/dist/esm/uno/shadows.js +11 -8
  89. package/dist/esm/uno/shadows.js.map +1 -1
  90. package/package.json +2 -1
  91. package/src/components/button/Button.stories.tsx +47 -7
  92. package/src/components/button/Button.tsx +137 -14
  93. package/src/components/button/classes.tsx +19 -11
  94. package/src/components/camera/Camera.tsx +1 -7
  95. package/src/components/card/Card.stories.tsx +10 -10
  96. package/src/components/datePicker/DatePicker.tsx +0 -4
  97. package/src/components/emojiPicker/EmojiPicker.tsx +4 -4
  98. package/src/components/horizontalList/HorizontalList.stories.tsx +0 -2
  99. package/src/components/horizontalList/HorizontalList.tsx +0 -1
  100. package/src/components/icon/Icon.tsx +9 -0
  101. package/src/components/icon/IconLoadingContext.tsx +7 -0
  102. package/src/components/imageUploader/ImageUploader.tsx +0 -1
  103. package/src/components/particles/ParticleLayer.stories.tsx +2 -2
  104. package/src/components/select/Select.tsx +2 -1
  105. package/src/components/spinner/Spinner.tsx +1 -1
  106. package/src/themes.stories.tsx +3 -2
  107. package/src/uno/colors.ts +1 -0
  108. package/src/uno/shadows.ts +11 -8
package/src/uno/shadows.ts CHANGED
@@ -1,12 +1,15 @@
1
1
  export function getShadows(hard = false) {
2
+ const opacity1 = `calc(var(--un-shadow-opacity,0.1)*(1 + var(--global-shadow-spread,1) * 0.5)*2)`;
3
+ const opacity2 = `calc(var(--un-shadow-opacity,0.1)*(1 + var(--global-shadow-spread,1) * 0.5))`;
4
+ const opacity3 = `calc(var(--un-shadow-opacity,0.1)*(1 + var(--global-shadow-spread,1) * 0.5)/2)`;
2
5
  return {
3
- sm: `var(--un-shadow-inset) 0 calc(0px * var(--v-shadow-y-mult,1)) calc(1px * var(--global-shadow-spread,1)) 0 rgb(from var(--un-shadow-color) r g b / calc((var(--un-shadow-opacity,0.1)*2))),
4
- var(--un-shadow-inset) 0 calc(1px * var(--v-shadow-y-mult,1)) calc(2px * var(--global-shadow-spread,1)) 0 rgb(from var(--un-shadow-color) r g b / calc((var(--un-shadow-opacity,0.1)*2)))`,
5
- md: `var(--un-shadow-inset) 0 calc(4px * var(--v-shadow-y-mult,1)) calc(8px * var(--global-shadow-spread,1)) -1px rgb(from var(--un-shadow-color) r g b / calc((var(--un-shadow-opacity,0.1)))),
6
- var(--un-shadow-inset) 0 calc(2px * var(--v-shadow-y-mult,1)) calc(4px * var(--global-shadow-spread,1)) -1px rgb(from var(--un-shadow-color) r g b / calc((var(--un-shadow-opacity,0.1)*2)))`,
7
- lg: `var(--un-shadow-inset) 0 calc(8px * var(--v-shadow-y-mult,1)) calc(16px * var(--global-shadow-spread,1)) 0px rgb(from var(--un-shadow-color) r g b / calc((var(--un-shadow-opacity,0.1)))),
8
- var(--un-shadow-inset) 0 calc(5px * var(--v-shadow-y-mult,1)) calc(10px * var(--global-shadow-spread,1)) 0px rgb(from var(--un-shadow-color) r g b / calc((var(--un-shadow-opacity,0.1))))`,
9
- xl: `var(--un-shadow-inset) 0 calc(20px * var(--v-shadow-y-mult,1)) calc(40px * (0.1 + var(--global-shadow-spread,1))) -0px rgb(from var(--un-shadow-color) r g b / calc((var(--un-shadow-opacity,0.1)))),
10
- var(--un-shadow-inset) 0 calc(15px * var(--v-shadow-y-mult,1)) calc(30px * (0.05 + var(--global-shadow-spread,1))) -6px rgb(from var(--un-shadow-color) r g b / calc(0.5*(var(--un-shadow-opacity,0.1))))`,
6
+ sm: `var(--un-shadow-inset) 0 calc(0px * var(--v-shadow-y-mult,1)) calc(1px * var(--global-shadow-spread,1)) 0 rgb(from var(--un-shadow-color) r g b / ${opacity1}),
7
+ var(--un-shadow-inset) 0 calc(1px * var(--v-shadow-y-mult,1)) calc(2px * var(--global-shadow-spread,1)) 0 rgb(from var(--un-shadow-color) r g b / ${opacity1})`,
8
+ md: `var(--un-shadow-inset) 0 calc(4px * var(--v-shadow-y-mult,1)) calc(8px * var(--global-shadow-spread,1)) -1px rgb(from var(--un-shadow-color) r g b / ${opacity2}),
9
+ var(--un-shadow-inset) 0 calc(2px * var(--v-shadow-y-mult,1)) calc(4px * var(--global-shadow-spread,1)) -1px rgb(from var(--un-shadow-color) r g b / ${opacity1})`,
10
+ lg: `var(--un-shadow-inset) 0 calc(8px * var(--v-shadow-y-mult,1)) calc(16px * var(--global-shadow-spread,1)) 0px rgb(from var(--un-shadow-color) r g b / ${opacity2}),
11
+ var(--un-shadow-inset) 0 calc(5px * var(--v-shadow-y-mult,1)) calc(10px * var(--global-shadow-spread,1)) 0px rgb(from var(--un-shadow-color) r g b / ${opacity2})`,
12
+ xl: `var(--un-shadow-inset) 0 calc(20px * var(--v-shadow-y-mult,1)) calc(40px * (0.1 + var(--global-shadow-spread,1))) -0px rgb(from var(--un-shadow-color) r g b / ${opacity2}),
13
+ var(--un-shadow-inset) 0 calc(15px * var(--v-shadow-y-mult,1)) calc(30px * (0.05 + var(--global-shadow-spread,1))) -6px rgb(from var(--un-shadow-color) r g b / ${opacity3})`,
11
14
  };
12
15
  }