@helpdice/theme 1.0.5 → 1.0.9

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 (16) hide show
  1. package/dist/css-baseline/index.js +89 -3
  2. package/dist/index.js +89 -3
  3. package/dist/themes/index.js +89 -2
  4. package/dist/themes/presets/index.d.ts +11 -0
  5. package/dist/themes/shadows.d.ts +84 -0
  6. package/dist/ui-provider/index.js +89 -2
  7. package/dist/use-all-themes/index.js +89 -2
  8. package/dist/use-media-query/index.js +89 -2
  9. package/dist/use-theme/index.js +89 -2
  10. package/esm/css-baseline/css-baseline.js +0 -1
  11. package/esm/themes/presets/dark.js +3 -1
  12. package/esm/themes/presets/default.js +3 -1
  13. package/esm/themes/presets/index.d.ts +11 -0
  14. package/esm/themes/shadows.d.ts +84 -0
  15. package/esm/themes/shadows.js +84 -0
  16. package/package.json +3 -1
package/dist/css-baseline/index.js CHANGED
@@ -600,6 +600,91 @@ function _typeof(o) {
600
600
  }, _typeof(o);
601
601
  }
602
602
 
603
+ var shadows = {
604
+ button: "0 2px #0000000b",
605
+ text: "0 -1px 0 rgb(0 0 0 / 12%)",
606
+ drop: {
607
+ z1: "0px 2px 8px rgba(0, 0, 0, 0.4)",
608
+ z2: "rgba(149, 157, 165, 0.2) 0px 8px 24px",
609
+ z3: "rgba(100, 100, 111, 0.2) 0px 7px 29px 0px"
610
+ },
611
+ level: {
612
+ z1: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
613
+ z2: "rgba(0, 0, 0, 0.16) 0px 1px 4px",
614
+ z3: "rgba(0, 0, 0, 0.35) 0px 5px 15px",
615
+ z4: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
616
+ z5: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px",
617
+ z6: "rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px",
618
+ z7: "rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px",
619
+ z8: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
620
+ z9: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
621
+ z10: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px",
622
+ z11: "rgba(0, 0, 0, 0.1) 0px 4px 12px",
623
+ z12: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
624
+ z13: "rgb(38, 57, 77) 0px 20px 30px -10px",
625
+ z14: "rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px",
626
+ z15: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
627
+ z16: "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px",
628
+ z17: "rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px",
629
+ z18: "rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px",
630
+ z19: "rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset",
631
+ z20: "rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px",
632
+ z21: "rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px",
633
+ z22: "rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px",
634
+ z23: "rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px",
635
+ z24: "rgba(17, 17, 26, 0.1) 0px 0px 16px",
636
+ z25: "rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
637
+ z26: "rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px",
638
+ z27: "rgba(0, 0, 0, 0.15) 0px 3px 3px 0px",
639
+ z28: "rgba(0, 0, 0, 0.08) 0px 4px 12px",
640
+ z29: "rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px",
641
+ z30: "rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px",
642
+ z31: "rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px"
643
+ },
644
+ border: {
645
+ z1: "rgba(0, 0, 0, 0.05) 0px 0px 0px 1px",
646
+ z2: "rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px",
647
+ z3: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px",
648
+ z4: "rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px",
649
+ z5: "rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px",
650
+ z6: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
651
+ z7: "rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px",
652
+ z8: "rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em",
653
+ z9: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
654
+ z10: "rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px",
655
+ z11: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px",
656
+ z12: "rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px",
657
+ z13: "rgba(0, 0, 0, 0.15) 0px 2px 8px",
658
+ z14: "rgba(0, 0, 0, 0.18) 0px 2px 4px",
659
+ z15: "rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px",
660
+ z16: "rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset",
661
+ z17: "rgba(0, 0, 0, 0.15) 0px 5px 15px 0px"
662
+ },
663
+ inner: {
664
+ z1: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset",
665
+ z2: "rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset",
666
+ z3: "rgb(204, 219, 232) 3px 3px 6px 0px inset, rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset",
667
+ z4: "rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset"
668
+ },
669
+ "float": {
670
+ z1: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
671
+ z2: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset",
672
+ z3: "rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
673
+ z4: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
674
+ z5: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
675
+ z6: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px",
676
+ z7: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
677
+ z8: "rgba(0, 0, 0, 0.25) 0px 25px 50px -12px",
678
+ z9: "rgba(0, 0, 0, 0.1) 0px 10px 50px"
679
+ },
680
+ top: {
681
+ z1: "rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px",
682
+ z2: "rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px",
683
+ z3: "rgba(0, 0, 0, 0.1) -4px 9px 25px -6px",
684
+ z4: "rgba(0, 0, 0, 0.09) 0px 3px 12px"
685
+ }
686
+ };
687
+
603
688
  var defaultFont = {
604
689
  sans: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
605
690
  mono: 'Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace',
@@ -703,7 +788,8 @@ var themes$1 = {
703
788
  layout: layout$1,
704
789
  palette: palette$1,
705
790
  breakpoints: breakpoints$1,
706
- expressiveness: expressiveness$1
791
+ expressiveness: expressiveness$1,
792
+ shadows: shadows
707
793
  };
708
794
 
709
795
  var palette = {
@@ -766,7 +852,8 @@ var themes = {
766
852
  layout: layout,
767
853
  palette: palette,
768
854
  breakpoints: breakpoints,
769
- expressiveness: expressiveness
855
+ expressiveness: expressiveness,
856
+ shadows: shadows
770
857
  };
771
858
 
772
859
  var isObject = function isObject(target) {
@@ -869,7 +956,6 @@ var styledJsxExports = requireStyledJsx();
869
956
  var flush = /*@__PURE__*/getDefaultExportFromCjs(styledJsxExports);
870
957
 
871
958
  // export type FlushToReact = <T>(opts?: { nonce?: string }) => Array<ReactElement<T>>
872
-
873
959
  // export type FlushToHTML = (opts?: { nonce?: string }) => string
874
960
 
875
961
  var CssBaseline = function CssBaseline(_ref) {
package/dist/index.js CHANGED
@@ -172,6 +172,91 @@ var useHUIContext = function useHUIContext() {
172
172
  return React.useContext(HUIContent);
173
173
  };
174
174
 
175
+ var shadows = {
176
+ button: "0 2px #0000000b",
177
+ text: "0 -1px 0 rgb(0 0 0 / 12%)",
178
+ drop: {
179
+ z1: "0px 2px 8px rgba(0, 0, 0, 0.4)",
180
+ z2: "rgba(149, 157, 165, 0.2) 0px 8px 24px",
181
+ z3: "rgba(100, 100, 111, 0.2) 0px 7px 29px 0px"
182
+ },
183
+ level: {
184
+ z1: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
185
+ z2: "rgba(0, 0, 0, 0.16) 0px 1px 4px",
186
+ z3: "rgba(0, 0, 0, 0.35) 0px 5px 15px",
187
+ z4: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
188
+ z5: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px",
189
+ z6: "rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px",
190
+ z7: "rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px",
191
+ z8: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
192
+ z9: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
193
+ z10: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px",
194
+ z11: "rgba(0, 0, 0, 0.1) 0px 4px 12px",
195
+ z12: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
196
+ z13: "rgb(38, 57, 77) 0px 20px 30px -10px",
197
+ z14: "rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px",
198
+ z15: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
199
+ z16: "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px",
200
+ z17: "rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px",
201
+ z18: "rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px",
202
+ z19: "rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset",
203
+ z20: "rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px",
204
+ z21: "rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px",
205
+ z22: "rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px",
206
+ z23: "rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px",
207
+ z24: "rgba(17, 17, 26, 0.1) 0px 0px 16px",
208
+ z25: "rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
209
+ z26: "rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px",
210
+ z27: "rgba(0, 0, 0, 0.15) 0px 3px 3px 0px",
211
+ z28: "rgba(0, 0, 0, 0.08) 0px 4px 12px",
212
+ z29: "rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px",
213
+ z30: "rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px",
214
+ z31: "rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px"
215
+ },
216
+ border: {
217
+ z1: "rgba(0, 0, 0, 0.05) 0px 0px 0px 1px",
218
+ z2: "rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px",
219
+ z3: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px",
220
+ z4: "rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px",
221
+ z5: "rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px",
222
+ z6: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
223
+ z7: "rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px",
224
+ z8: "rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em",
225
+ z9: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
226
+ z10: "rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px",
227
+ z11: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px",
228
+ z12: "rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px",
229
+ z13: "rgba(0, 0, 0, 0.15) 0px 2px 8px",
230
+ z14: "rgba(0, 0, 0, 0.18) 0px 2px 4px",
231
+ z15: "rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px",
232
+ z16: "rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset",
233
+ z17: "rgba(0, 0, 0, 0.15) 0px 5px 15px 0px"
234
+ },
235
+ inner: {
236
+ z1: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset",
237
+ z2: "rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset",
238
+ z3: "rgb(204, 219, 232) 3px 3px 6px 0px inset, rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset",
239
+ z4: "rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset"
240
+ },
241
+ "float": {
242
+ z1: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
243
+ z2: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset",
244
+ z3: "rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
245
+ z4: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
246
+ z5: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
247
+ z6: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px",
248
+ z7: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
249
+ z8: "rgba(0, 0, 0, 0.25) 0px 25px 50px -12px",
250
+ z9: "rgba(0, 0, 0, 0.1) 0px 10px 50px"
251
+ },
252
+ top: {
253
+ z1: "rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px",
254
+ z2: "rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px",
255
+ z3: "rgba(0, 0, 0, 0.1) -4px 9px 25px -6px",
256
+ z4: "rgba(0, 0, 0, 0.09) 0px 3px 12px"
257
+ }
258
+ };
259
+
175
260
  var defaultFont = {
176
261
  sans: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
177
262
  mono: 'Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace',
@@ -275,7 +360,8 @@ var themes$1 = {
275
360
  layout: layout$1,
276
361
  palette: palette$1,
277
362
  breakpoints: breakpoints$1,
278
- expressiveness: expressiveness$1
363
+ expressiveness: expressiveness$1,
364
+ shadows: shadows
279
365
  };
280
366
 
281
367
  var palette = {
@@ -338,7 +424,8 @@ var themes = {
338
424
  layout: layout,
339
425
  palette: palette,
340
426
  breakpoints: breakpoints,
341
- expressiveness: expressiveness
427
+ expressiveness: expressiveness,
428
+ shadows: shadows
342
429
  };
343
430
 
344
431
  var isObject = function isObject(target) {
@@ -1462,7 +1549,6 @@ var styledJsxExports = requireStyledJsx();
1462
1549
  var flush = /*@__PURE__*/getDefaultExportFromCjs(styledJsxExports);
1463
1550
 
1464
1551
  // export type FlushToReact = <T>(opts?: { nonce?: string }) => Array<ReactElement<T>>
1465
-
1466
1552
  // export type FlushToHTML = (opts?: { nonce?: string }) => string
1467
1553
 
1468
1554
  var CssBaseline = function CssBaseline(_ref) {
package/dist/themes/index.js CHANGED
@@ -55,6 +55,91 @@ function _typeof(o) {
55
55
  }, _typeof(o);
56
56
  }
57
57
 
58
+ var shadows = {
59
+ button: "0 2px #0000000b",
60
+ text: "0 -1px 0 rgb(0 0 0 / 12%)",
61
+ drop: {
62
+ z1: "0px 2px 8px rgba(0, 0, 0, 0.4)",
63
+ z2: "rgba(149, 157, 165, 0.2) 0px 8px 24px",
64
+ z3: "rgba(100, 100, 111, 0.2) 0px 7px 29px 0px"
65
+ },
66
+ level: {
67
+ z1: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
68
+ z2: "rgba(0, 0, 0, 0.16) 0px 1px 4px",
69
+ z3: "rgba(0, 0, 0, 0.35) 0px 5px 15px",
70
+ z4: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
71
+ z5: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px",
72
+ z6: "rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px",
73
+ z7: "rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px",
74
+ z8: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
75
+ z9: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
76
+ z10: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px",
77
+ z11: "rgba(0, 0, 0, 0.1) 0px 4px 12px",
78
+ z12: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
79
+ z13: "rgb(38, 57, 77) 0px 20px 30px -10px",
80
+ z14: "rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px",
81
+ z15: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
82
+ z16: "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px",
83
+ z17: "rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px",
84
+ z18: "rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px",
85
+ z19: "rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset",
86
+ z20: "rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px",
87
+ z21: "rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px",
88
+ z22: "rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px",
89
+ z23: "rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px",
90
+ z24: "rgba(17, 17, 26, 0.1) 0px 0px 16px",
91
+ z25: "rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
92
+ z26: "rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px",
93
+ z27: "rgba(0, 0, 0, 0.15) 0px 3px 3px 0px",
94
+ z28: "rgba(0, 0, 0, 0.08) 0px 4px 12px",
95
+ z29: "rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px",
96
+ z30: "rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px",
97
+ z31: "rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px"
98
+ },
99
+ border: {
100
+ z1: "rgba(0, 0, 0, 0.05) 0px 0px 0px 1px",
101
+ z2: "rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px",
102
+ z3: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px",
103
+ z4: "rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px",
104
+ z5: "rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px",
105
+ z6: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
106
+ z7: "rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px",
107
+ z8: "rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em",
108
+ z9: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
109
+ z10: "rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px",
110
+ z11: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px",
111
+ z12: "rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px",
112
+ z13: "rgba(0, 0, 0, 0.15) 0px 2px 8px",
113
+ z14: "rgba(0, 0, 0, 0.18) 0px 2px 4px",
114
+ z15: "rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px",
115
+ z16: "rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset",
116
+ z17: "rgba(0, 0, 0, 0.15) 0px 5px 15px 0px"
117
+ },
118
+ inner: {
119
+ z1: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset",
120
+ z2: "rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset",
121
+ z3: "rgb(204, 219, 232) 3px 3px 6px 0px inset, rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset",
122
+ z4: "rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset"
123
+ },
124
+ "float": {
125
+ z1: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
126
+ z2: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset",
127
+ z3: "rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
128
+ z4: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
129
+ z5: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
130
+ z6: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px",
131
+ z7: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
132
+ z8: "rgba(0, 0, 0, 0.25) 0px 25px 50px -12px",
133
+ z9: "rgba(0, 0, 0, 0.1) 0px 10px 50px"
134
+ },
135
+ top: {
136
+ z1: "rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px",
137
+ z2: "rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px",
138
+ z3: "rgba(0, 0, 0, 0.1) -4px 9px 25px -6px",
139
+ z4: "rgba(0, 0, 0, 0.09) 0px 3px 12px"
140
+ }
141
+ };
142
+
58
143
  var defaultFont = {
59
144
  sans: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
60
145
  mono: 'Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace',
@@ -158,7 +243,8 @@ var themes$1 = {
158
243
  layout: layout$1,
159
244
  palette: palette$1,
160
245
  breakpoints: breakpoints$1,
161
- expressiveness: expressiveness$1
246
+ expressiveness: expressiveness$1,
247
+ shadows: shadows
162
248
  };
163
249
 
164
250
  var palette = {
@@ -221,7 +307,8 @@ var themes = {
221
307
  layout: layout,
222
308
  palette: palette,
223
309
  breakpoints: breakpoints,
224
- expressiveness: expressiveness
310
+ expressiveness: expressiveness,
311
+ shadows: shadows
225
312
  };
226
313
 
227
314
  var isObject = function isObject(target) {
package/dist/themes/presets/index.d.ts CHANGED
@@ -80,6 +80,16 @@ export interface HUIThemesBreakpoints {
80
80
  lg: BreakpointsItem;
81
81
  xl: BreakpointsItem;
82
82
  }
83
+ export interface HUIThemesShadow {
84
+ button: string;
85
+ text: string;
86
+ drop: Record<string, string>;
87
+ level: Record<string, string>;
88
+ border: Record<string, string>;
89
+ inner: Record<string, string>;
90
+ float: Record<string, string>;
91
+ top: Record<string, string>;
92
+ }
83
93
  export interface HUIThemes {
84
94
  type: string;
85
95
  font: HUIThemesFont;
@@ -87,4 +97,5 @@ export interface HUIThemes {
87
97
  palette: HUIThemesPalette;
88
98
  breakpoints: HUIThemesBreakpoints;
89
99
  expressiveness: HUIThemesExpressiveness;
100
+ shadows: HUIThemesShadow;
90
101
  }
package/dist/themes/shadows.d.ts ADDED
@@ -0,0 +1,84 @@
1
+ export declare const shadows: {
2
+ button: string;
3
+ text: string;
4
+ drop: {
5
+ z1: string;
6
+ z2: string;
7
+ z3: string;
8
+ };
9
+ level: {
10
+ z1: string;
11
+ z2: string;
12
+ z3: string;
13
+ z4: string;
14
+ z5: string;
15
+ z6: string;
16
+ z7: string;
17
+ z8: string;
18
+ z9: string;
19
+ z10: string;
20
+ z11: string;
21
+ z12: string;
22
+ z13: string;
23
+ z14: string;
24
+ z15: string;
25
+ z16: string;
26
+ z17: string;
27
+ z18: string;
28
+ z19: string;
29
+ z20: string;
30
+ z21: string;
31
+ z22: string;
32
+ z23: string;
33
+ z24: string;
34
+ z25: string;
35
+ z26: string;
36
+ z27: string;
37
+ z28: string;
38
+ z29: string;
39
+ z30: string;
40
+ z31: string;
41
+ };
42
+ border: {
43
+ z1: string;
44
+ z2: string;
45
+ z3: string;
46
+ z4: string;
47
+ z5: string;
48
+ z6: string;
49
+ z7: string;
50
+ z8: string;
51
+ z9: string;
52
+ z10: string;
53
+ z11: string;
54
+ z12: string;
55
+ z13: string;
56
+ z14: string;
57
+ z15: string;
58
+ z16: string;
59
+ z17: string;
60
+ };
61
+ inner: {
62
+ z1: string;
63
+ z2: string;
64
+ z3: string;
65
+ z4: string;
66
+ };
67
+ float: {
68
+ z1: string;
69
+ z2: string;
70
+ z3: string;
71
+ z4: string;
72
+ z5: string;
73
+ z6: string;
74
+ z7: string;
75
+ z8: string;
76
+ z9: string;
77
+ };
78
+ top: {
79
+ z1: string;
80
+ z2: string;
81
+ z3: string;
82
+ z4: string;
83
+ };
84
+ };
package/dist/ui-provider/index.js CHANGED
@@ -153,6 +153,91 @@ var useHUIContext = function useHUIContext() {
153
153
  return React.useContext(HUIContent);
154
154
  };
155
155
 
156
+ var shadows = {
157
+ button: "0 2px #0000000b",
158
+ text: "0 -1px 0 rgb(0 0 0 / 12%)",
159
+ drop: {
160
+ z1: "0px 2px 8px rgba(0, 0, 0, 0.4)",
161
+ z2: "rgba(149, 157, 165, 0.2) 0px 8px 24px",
162
+ z3: "rgba(100, 100, 111, 0.2) 0px 7px 29px 0px"
163
+ },
164
+ level: {
165
+ z1: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
166
+ z2: "rgba(0, 0, 0, 0.16) 0px 1px 4px",
167
+ z3: "rgba(0, 0, 0, 0.35) 0px 5px 15px",
168
+ z4: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
169
+ z5: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px",
170
+ z6: "rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px",
171
+ z7: "rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px",
172
+ z8: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
173
+ z9: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
174
+ z10: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px",
175
+ z11: "rgba(0, 0, 0, 0.1) 0px 4px 12px",
176
+ z12: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
177
+ z13: "rgb(38, 57, 77) 0px 20px 30px -10px",
178
+ z14: "rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px",
179
+ z15: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
180
+ z16: "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px",
181
+ z17: "rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px",
182
+ z18: "rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px",
183
+ z19: "rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset",
184
+ z20: "rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px",
185
+ z21: "rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px",
186
+ z22: "rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px",
187
+ z23: "rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px",
188
+ z24: "rgba(17, 17, 26, 0.1) 0px 0px 16px",
189
+ z25: "rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
190
+ z26: "rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px",
191
+ z27: "rgba(0, 0, 0, 0.15) 0px 3px 3px 0px",
192
+ z28: "rgba(0, 0, 0, 0.08) 0px 4px 12px",
193
+ z29: "rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px",
194
+ z30: "rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px",
195
+ z31: "rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px"
196
+ },
197
+ border: {
198
+ z1: "rgba(0, 0, 0, 0.05) 0px 0px 0px 1px",
199
+ z2: "rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px",
200
+ z3: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px",
201
+ z4: "rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px",
202
+ z5: "rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px",
203
+ z6: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
204
+ z7: "rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px",
205
+ z8: "rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em",
206
+ z9: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
207
+ z10: "rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px",
208
+ z11: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px",
209
+ z12: "rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px",
210
+ z13: "rgba(0, 0, 0, 0.15) 0px 2px 8px",
211
+ z14: "rgba(0, 0, 0, 0.18) 0px 2px 4px",
212
+ z15: "rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px",
213
+ z16: "rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset",
214
+ z17: "rgba(0, 0, 0, 0.15) 0px 5px 15px 0px"
215
+ },
216
+ inner: {
217
+ z1: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset",
218
+ z2: "rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset",
219
+ z3: "rgb(204, 219, 232) 3px 3px 6px 0px inset, rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset",
220
+ z4: "rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset"
221
+ },
222
+ "float": {
223
+ z1: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
224
+ z2: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset",
225
+ z3: "rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
226
+ z4: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
227
+ z5: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
228
+ z6: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px",
229
+ z7: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
230
+ z8: "rgba(0, 0, 0, 0.25) 0px 25px 50px -12px",
231
+ z9: "rgba(0, 0, 0, 0.1) 0px 10px 50px"
232
+ },
233
+ top: {
234
+ z1: "rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px",
235
+ z2: "rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px",
236
+ z3: "rgba(0, 0, 0, 0.1) -4px 9px 25px -6px",
237
+ z4: "rgba(0, 0, 0, 0.09) 0px 3px 12px"
238
+ }
239
+ };
240
+
156
241
  var defaultFont = {
157
242
  sans: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
158
243
  mono: 'Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace',
@@ -256,7 +341,8 @@ var themes$1 = {
256
341
  layout: layout$1,
257
342
  palette: palette$1,
258
343
  breakpoints: breakpoints$1,
259
- expressiveness: expressiveness$1
344
+ expressiveness: expressiveness$1,
345
+ shadows: shadows
260
346
  };
261
347
 
262
348
  var palette = {
@@ -319,7 +405,8 @@ var themes = {
319
405
  layout: layout,
320
406
  palette: palette,
321
407
  breakpoints: breakpoints,
322
- expressiveness: expressiveness
408
+ expressiveness: expressiveness,
409
+ shadows: shadows
323
410
  };
324
411
 
325
412
  var isObject = function isObject(target) {
package/dist/use-all-themes/index.js CHANGED
@@ -57,6 +57,91 @@ function _typeof(o) {
57
57
  }, _typeof(o);
58
58
  }
59
59
 
60
+ var shadows = {
61
+ button: "0 2px #0000000b",
62
+ text: "0 -1px 0 rgb(0 0 0 / 12%)",
63
+ drop: {
64
+ z1: "0px 2px 8px rgba(0, 0, 0, 0.4)",
65
+ z2: "rgba(149, 157, 165, 0.2) 0px 8px 24px",
66
+ z3: "rgba(100, 100, 111, 0.2) 0px 7px 29px 0px"
67
+ },
68
+ level: {
69
+ z1: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
70
+ z2: "rgba(0, 0, 0, 0.16) 0px 1px 4px",
71
+ z3: "rgba(0, 0, 0, 0.35) 0px 5px 15px",
72
+ z4: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
73
+ z5: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px",
74
+ z6: "rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px",
75
+ z7: "rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px",
76
+ z8: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
77
+ z9: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
78
+ z10: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px",
79
+ z11: "rgba(0, 0, 0, 0.1) 0px 4px 12px",
80
+ z12: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
81
+ z13: "rgb(38, 57, 77) 0px 20px 30px -10px",
82
+ z14: "rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px",
83
+ z15: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
84
+ z16: "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px",
85
+ z17: "rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px",
86
+ z18: "rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px",
87
+ z19: "rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset",
88
+ z20: "rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px",
89
+ z21: "rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px",
90
+ z22: "rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px",
91
+ z23: "rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px",
92
+ z24: "rgba(17, 17, 26, 0.1) 0px 0px 16px",
93
+ z25: "rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
94
+ z26: "rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px",
95
+ z27: "rgba(0, 0, 0, 0.15) 0px 3px 3px 0px",
96
+ z28: "rgba(0, 0, 0, 0.08) 0px 4px 12px",
97
+ z29: "rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px",
98
+ z30: "rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px",
99
+ z31: "rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px"
100
+ },
101
+ border: {
102
+ z1: "rgba(0, 0, 0, 0.05) 0px 0px 0px 1px",
103
+ z2: "rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px",
104
+ z3: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px",
105
+ z4: "rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px",
106
+ z5: "rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px",
107
+ z6: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
108
+ z7: "rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px",
109
+ z8: "rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em",
110
+ z9: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
111
+ z10: "rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px",
112
+ z11: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px",
113
+ z12: "rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px",
114
+ z13: "rgba(0, 0, 0, 0.15) 0px 2px 8px",
115
+ z14: "rgba(0, 0, 0, 0.18) 0px 2px 4px",
116
+ z15: "rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px",
117
+ z16: "rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset",
118
+ z17: "rgba(0, 0, 0, 0.15) 0px 5px 15px 0px"
119
+ },
120
+ inner: {
121
+ z1: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset",
122
+ z2: "rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset",
123
+ z3: "rgb(204, 219, 232) 3px 3px 6px 0px inset, rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset",
124
+ z4: "rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset"
125
+ },
126
+ "float": {
127
+ z1: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
128
+ z2: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset",
129
+ z3: "rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
130
+ z4: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
131
+ z5: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
132
+ z6: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px",
133
+ z7: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
134
+ z8: "rgba(0, 0, 0, 0.25) 0px 25px 50px -12px",
135
+ z9: "rgba(0, 0, 0, 0.1) 0px 10px 50px"
136
+ },
137
+ top: {
138
+ z1: "rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px",
139
+ z2: "rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px",
140
+ z3: "rgba(0, 0, 0, 0.1) -4px 9px 25px -6px",
141
+ z4: "rgba(0, 0, 0, 0.09) 0px 3px 12px"
142
+ }
143
+ };
144
+
60
145
  var defaultFont = {
61
146
  sans: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
62
147
  mono: 'Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace',
@@ -160,7 +245,8 @@ var themes$1 = {
160
245
  layout: layout$1,
161
246
  palette: palette$1,
162
247
  breakpoints: breakpoints$1,
163
- expressiveness: expressiveness$1
248
+ expressiveness: expressiveness$1,
249
+ shadows: shadows
164
250
  };
165
251
 
166
252
  var palette = {
@@ -223,7 +309,8 @@ var themes = {
223
309
  layout: layout,
224
310
  palette: palette,
225
311
  breakpoints: breakpoints,
226
- expressiveness: expressiveness
312
+ expressiveness: expressiveness,
313
+ shadows: shadows
227
314
  };
228
315
 
229
316
  var isObject = function isObject(target) {
package/dist/use-media-query/index.js CHANGED
@@ -102,6 +102,91 @@ function _unsupportedIterableToArray(r, a) {
102
102
  }
103
103
  }
104
104
 
105
+ var shadows = {
106
+ button: "0 2px #0000000b",
107
+ text: "0 -1px 0 rgb(0 0 0 / 12%)",
108
+ drop: {
109
+ z1: "0px 2px 8px rgba(0, 0, 0, 0.4)",
110
+ z2: "rgba(149, 157, 165, 0.2) 0px 8px 24px",
111
+ z3: "rgba(100, 100, 111, 0.2) 0px 7px 29px 0px"
112
+ },
113
+ level: {
114
+ z1: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
115
+ z2: "rgba(0, 0, 0, 0.16) 0px 1px 4px",
116
+ z3: "rgba(0, 0, 0, 0.35) 0px 5px 15px",
117
+ z4: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
118
+ z5: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px",
119
+ z6: "rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px",
120
+ z7: "rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px",
121
+ z8: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
122
+ z9: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
123
+ z10: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px",
124
+ z11: "rgba(0, 0, 0, 0.1) 0px 4px 12px",
125
+ z12: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
126
+ z13: "rgb(38, 57, 77) 0px 20px 30px -10px",
127
+ z14: "rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px",
128
+ z15: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
129
+ z16: "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px",
130
+ z17: "rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px",
131
+ z18: "rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px",
132
+ z19: "rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset",
133
+ z20: "rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px",
134
+ z21: "rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px",
135
+ z22: "rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px",
136
+ z23: "rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px",
137
+ z24: "rgba(17, 17, 26, 0.1) 0px 0px 16px",
138
+ z25: "rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
139
+ z26: "rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px",
140
+ z27: "rgba(0, 0, 0, 0.15) 0px 3px 3px 0px",
141
+ z28: "rgba(0, 0, 0, 0.08) 0px 4px 12px",
142
+ z29: "rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px",
143
+ z30: "rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px",
144
+ z31: "rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px"
145
+ },
146
+ border: {
147
+ z1: "rgba(0, 0, 0, 0.05) 0px 0px 0px 1px",
148
+ z2: "rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px",
149
+ z3: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px",
150
+ z4: "rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px",
151
+ z5: "rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px",
152
+ z6: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
153
+ z7: "rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px",
154
+ z8: "rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em",
155
+ z9: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
156
+ z10: "rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px",
157
+ z11: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px",
158
+ z12: "rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px",
159
+ z13: "rgba(0, 0, 0, 0.15) 0px 2px 8px",
160
+ z14: "rgba(0, 0, 0, 0.18) 0px 2px 4px",
161
+ z15: "rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px",
162
+ z16: "rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset",
163
+ z17: "rgba(0, 0, 0, 0.15) 0px 5px 15px 0px"
164
+ },
165
+ inner: {
166
+ z1: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset",
167
+ z2: "rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset",
168
+ z3: "rgb(204, 219, 232) 3px 3px 6px 0px inset, rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset",
169
+ z4: "rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset"
170
+ },
171
+ "float": {
172
+ z1: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
173
+ z2: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset",
174
+ z3: "rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
175
+ z4: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
176
+ z5: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
177
+ z6: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px",
178
+ z7: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
179
+ z8: "rgba(0, 0, 0, 0.25) 0px 25px 50px -12px",
180
+ z9: "rgba(0, 0, 0, 0.1) 0px 10px 50px"
181
+ },
182
+ top: {
183
+ z1: "rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px",
184
+ z2: "rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px",
185
+ z3: "rgba(0, 0, 0, 0.1) -4px 9px 25px -6px",
186
+ z4: "rgba(0, 0, 0, 0.09) 0px 3px 12px"
187
+ }
188
+ };
189
+
105
190
  var defaultFont = {
106
191
  sans: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
107
192
  mono: 'Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace',
@@ -205,7 +290,8 @@ var themes$1 = {
205
290
  layout: layout$1,
206
291
  palette: palette$1,
207
292
  breakpoints: breakpoints$1,
208
- expressiveness: expressiveness$1
293
+ expressiveness: expressiveness$1,
294
+ shadows: shadows
209
295
  };
210
296
 
211
297
  var palette = {
@@ -268,7 +354,8 @@ var themes = {
268
354
  layout: layout,
269
355
  palette: palette,
270
356
  breakpoints: breakpoints,
271
- expressiveness: expressiveness
357
+ expressiveness: expressiveness,
358
+ shadows: shadows
272
359
  };
273
360
 
274
361
  var isObject = function isObject(target) {
package/dist/use-theme/index.js CHANGED
@@ -57,6 +57,91 @@ function _typeof(o) {
57
57
  }, _typeof(o);
58
58
  }
59
59
 
60
+ var shadows = {
61
+ button: "0 2px #0000000b",
62
+ text: "0 -1px 0 rgb(0 0 0 / 12%)",
63
+ drop: {
64
+ z1: "0px 2px 8px rgba(0, 0, 0, 0.4)",
65
+ z2: "rgba(149, 157, 165, 0.2) 0px 8px 24px",
66
+ z3: "rgba(100, 100, 111, 0.2) 0px 7px 29px 0px"
67
+ },
68
+ level: {
69
+ z1: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
70
+ z2: "rgba(0, 0, 0, 0.16) 0px 1px 4px",
71
+ z3: "rgba(0, 0, 0, 0.35) 0px 5px 15px",
72
+ z4: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
73
+ z5: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px",
74
+ z6: "rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px",
75
+ z7: "rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px",
76
+ z8: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
77
+ z9: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
78
+ z10: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px",
79
+ z11: "rgba(0, 0, 0, 0.1) 0px 4px 12px",
80
+ z12: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
81
+ z13: "rgb(38, 57, 77) 0px 20px 30px -10px",
82
+ z14: "rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px",
83
+ z15: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
84
+ z16: "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px",
85
+ z17: "rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px",
86
+ z18: "rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px",
87
+ z19: "rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset",
88
+ z20: "rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px",
89
+ z21: "rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px",
90
+ z22: "rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px",
91
+ z23: "rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px",
92
+ z24: "rgba(17, 17, 26, 0.1) 0px 0px 16px",
93
+ z25: "rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
94
+ z26: "rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px",
95
+ z27: "rgba(0, 0, 0, 0.15) 0px 3px 3px 0px",
96
+ z28: "rgba(0, 0, 0, 0.08) 0px 4px 12px",
97
+ z29: "rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px",
98
+ z30: "rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px",
99
+ z31: "rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px"
100
+ },
101
+ border: {
102
+ z1: "rgba(0, 0, 0, 0.05) 0px 0px 0px 1px",
103
+ z2: "rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px",
104
+ z3: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px",
105
+ z4: "rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px",
106
+ z5: "rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px",
107
+ z6: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
108
+ z7: "rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px",
109
+ z8: "rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em",
110
+ z9: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
111
+ z10: "rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px",
112
+ z11: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px",
113
+ z12: "rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px",
114
+ z13: "rgba(0, 0, 0, 0.15) 0px 2px 8px",
115
+ z14: "rgba(0, 0, 0, 0.18) 0px 2px 4px",
116
+ z15: "rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px",
117
+ z16: "rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset",
118
+ z17: "rgba(0, 0, 0, 0.15) 0px 5px 15px 0px"
119
+ },
120
+ inner: {
121
+ z1: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset",
122
+ z2: "rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset",
123
+ z3: "rgb(204, 219, 232) 3px 3px 6px 0px inset, rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset",
124
+ z4: "rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset"
125
+ },
126
+ "float": {
127
+ z1: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
128
+ z2: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset",
129
+ z3: "rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
130
+ z4: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
131
+ z5: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
132
+ z6: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px",
133
+ z7: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
134
+ z8: "rgba(0, 0, 0, 0.25) 0px 25px 50px -12px",
135
+ z9: "rgba(0, 0, 0, 0.1) 0px 10px 50px"
136
+ },
137
+ top: {
138
+ z1: "rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px",
139
+ z2: "rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px",
140
+ z3: "rgba(0, 0, 0, 0.1) -4px 9px 25px -6px",
141
+ z4: "rgba(0, 0, 0, 0.09) 0px 3px 12px"
142
+ }
143
+ };
144
+
60
145
  var defaultFont = {
61
146
  sans: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
62
147
  mono: 'Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace',
@@ -160,7 +245,8 @@ var themes$1 = {
160
245
  layout: layout$1,
161
246
  palette: palette$1,
162
247
  breakpoints: breakpoints$1,
163
- expressiveness: expressiveness$1
248
+ expressiveness: expressiveness$1,
249
+ shadows: shadows
164
250
  };
165
251
 
166
252
  var palette = {
@@ -223,7 +309,8 @@ var themes = {
223
309
  layout: layout,
224
310
  palette: palette,
225
311
  breakpoints: breakpoints,
226
- expressiveness: expressiveness
312
+ expressiveness: expressiveness,
313
+ shadows: shadows
227
314
  };
228
315
 
229
316
  var isObject = function isObject(target) {
package/esm/css-baseline/css-baseline.js CHANGED
@@ -4,7 +4,6 @@ import React from 'react';
4
4
  import useTheme from '../use-theme';
5
5
  import flush from 'styled-jsx';
6
6
  // export type FlushToReact = <T>(opts?: { nonce?: string }) => Array<ReactElement<T>>
7
-
8
7
  // export type FlushToHTML = (opts?: { nonce?: string }) => string
9
8
 
10
9
  var CssBaseline = function CssBaseline(_ref) {
package/esm/themes/presets/dark.js CHANGED
@@ -1,3 +1,4 @@
1
+ import { shadows } from '../shadows';
1
2
  import { defaultFont, defaultBreakpoints, defaultLayout } from './shared';
2
3
  export var palette = {
3
4
  accents_1: '#111',
@@ -59,6 +60,7 @@ export var themes = {
59
60
  layout: layout,
60
61
  palette: palette,
61
62
  breakpoints: breakpoints,
62
- expressiveness: expressiveness
63
+ expressiveness: expressiveness,
64
+ shadows: shadows
63
65
  };
64
66
  export default themes;
package/esm/themes/presets/default.js CHANGED
@@ -1,3 +1,4 @@
1
+ import { shadows } from '../shadows';
1
2
  import { defaultFont, defaultBreakpoints, defaultLayout } from './shared';
2
3
  export var palette = {
3
4
  accents_1: '#fafafa',
@@ -59,6 +60,7 @@ export var themes = {
59
60
  layout: layout,
60
61
  palette: palette,
61
62
  breakpoints: breakpoints,
62
- expressiveness: expressiveness
63
+ expressiveness: expressiveness,
64
+ shadows: shadows
63
65
  };
64
66
  export default themes;
package/esm/themes/presets/index.d.ts CHANGED
@@ -80,6 +80,16 @@ export interface HUIThemesBreakpoints {
80
80
  lg: BreakpointsItem;
81
81
  xl: BreakpointsItem;
82
82
  }
83
+ export interface HUIThemesShadow {
84
+ button: string;
85
+ text: string;
86
+ drop: Record<string, string>;
87
+ level: Record<string, string>;
88
+ border: Record<string, string>;
89
+ inner: Record<string, string>;
90
+ float: Record<string, string>;
91
+ top: Record<string, string>;
92
+ }
83
93
  export interface HUIThemes {
84
94
  type: string;
85
95
  font: HUIThemesFont;
@@ -87,4 +97,5 @@ export interface HUIThemes {
87
97
  palette: HUIThemesPalette;
88
98
  breakpoints: HUIThemesBreakpoints;
89
99
  expressiveness: HUIThemesExpressiveness;
100
+ shadows: HUIThemesShadow;
90
101
  }
package/esm/themes/shadows.d.ts ADDED
@@ -0,0 +1,84 @@
1
+ export declare const shadows: {
2
+ button: string;
3
+ text: string;
4
+ drop: {
5
+ z1: string;
6
+ z2: string;
7
+ z3: string;
8
+ };
9
+ level: {
10
+ z1: string;
11
+ z2: string;
12
+ z3: string;
13
+ z4: string;
14
+ z5: string;
15
+ z6: string;
16
+ z7: string;
17
+ z8: string;
18
+ z9: string;
19
+ z10: string;
20
+ z11: string;
21
+ z12: string;
22
+ z13: string;
23
+ z14: string;
24
+ z15: string;
25
+ z16: string;
26
+ z17: string;
27
+ z18: string;
28
+ z19: string;
29
+ z20: string;
30
+ z21: string;
31
+ z22: string;
32
+ z23: string;
33
+ z24: string;
34
+ z25: string;
35
+ z26: string;
36
+ z27: string;
37
+ z28: string;
38
+ z29: string;
39
+ z30: string;
40
+ z31: string;
41
+ };
42
+ border: {
43
+ z1: string;
44
+ z2: string;
45
+ z3: string;
46
+ z4: string;
47
+ z5: string;
48
+ z6: string;
49
+ z7: string;
50
+ z8: string;
51
+ z9: string;
52
+ z10: string;
53
+ z11: string;
54
+ z12: string;
55
+ z13: string;
56
+ z14: string;
57
+ z15: string;
58
+ z16: string;
59
+ z17: string;
60
+ };
61
+ inner: {
62
+ z1: string;
63
+ z2: string;
64
+ z3: string;
65
+ z4: string;
66
+ };
67
+ float: {
68
+ z1: string;
69
+ z2: string;
70
+ z3: string;
71
+ z4: string;
72
+ z5: string;
73
+ z6: string;
74
+ z7: string;
75
+ z8: string;
76
+ z9: string;
77
+ };
78
+ top: {
79
+ z1: string;
80
+ z2: string;
81
+ z3: string;
82
+ z4: string;
83
+ };
84
+ };
package/esm/themes/shadows.js ADDED
@@ -0,0 +1,84 @@
1
+ export var shadows = {
2
+ button: "0 2px #0000000b",
3
+ text: "0 -1px 0 rgb(0 0 0 / 12%)",
4
+ drop: {
5
+ z1: "0px 2px 8px rgba(0, 0, 0, 0.4)",
6
+ z2: "rgba(149, 157, 165, 0.2) 0px 8px 24px",
7
+ z3: "rgba(100, 100, 111, 0.2) 0px 7px 29px 0px"
8
+ },
9
+ level: {
10
+ z1: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
11
+ z2: "rgba(0, 0, 0, 0.16) 0px 1px 4px",
12
+ z3: "rgba(0, 0, 0, 0.35) 0px 5px 15px",
13
+ z4: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
14
+ z5: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px",
15
+ z6: "rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px",
16
+ z7: "rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px",
17
+ z8: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
18
+ z9: "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px",
19
+ z10: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px",
20
+ z11: "rgba(0, 0, 0, 0.1) 0px 4px 12px",
21
+ z12: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
22
+ z13: "rgb(38, 57, 77) 0px 20px 30px -10px",
23
+ z14: "rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px",
24
+ z15: "rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px",
25
+ z16: "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px",
26
+ z17: "rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px",
27
+ z18: "rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px",
28
+ z19: "rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset",
29
+ z20: "rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px",
30
+ z21: "rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px",
31
+ z22: "rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px",
32
+ z23: "rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px",
33
+ z24: "rgba(17, 17, 26, 0.1) 0px 0px 16px",
34
+ z25: "rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
35
+ z26: "rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px",
36
+ z27: "rgba(0, 0, 0, 0.15) 0px 3px 3px 0px",
37
+ z28: "rgba(0, 0, 0, 0.08) 0px 4px 12px",
38
+ z29: "rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px",
39
+ z30: "rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px",
40
+ z31: "rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px"
41
+ },
42
+ border: {
43
+ z1: "rgba(0, 0, 0, 0.05) 0px 0px 0px 1px",
44
+ z2: "rgba(9, 30, 66, 0.25) 0px 1px 1px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px",
45
+ z3: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px",
46
+ z4: "rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px",
47
+ z5: "rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px",
48
+ z6: "rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
49
+ z7: "rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px",
50
+ z8: "rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em",
51
+ z9: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px",
52
+ z10: "rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px",
53
+ z11: "rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px",
54
+ z12: "rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px",
55
+ z13: "rgba(0, 0, 0, 0.15) 0px 2px 8px",
56
+ z14: "rgba(0, 0, 0, 0.18) 0px 2px 4px",
57
+ z15: "rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px",
58
+ z16: "rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset",
59
+ z17: "rgba(0, 0, 0, 0.15) 0px 5px 15px 0px"
60
+ },
61
+ inner: {
62
+ z1: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset",
63
+ z2: "rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset",
64
+ z3: "rgb(204, 219, 232) 3px 3px 6px 0px inset, rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset",
65
+ z4: "rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset"
66
+ },
67
+ "float": {
68
+ z1: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
69
+ z2: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset",
70
+ z3: "rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
71
+ z4: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
72
+ z5: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
73
+ z6: "rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px",
74
+ z7: "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px",
75
+ z8: "rgba(0, 0, 0, 0.25) 0px 25px 50px -12px",
76
+ z9: "rgba(0, 0, 0, 0.1) 0px 10px 50px"
77
+ },
78
+ top: {
79
+ z1: "rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px",
80
+ z2: "rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px",
81
+ z3: "rgba(0, 0, 0, 0.1) -4px 9px 25px -6px",
82
+ z4: "rgba(0, 0, 0, 0.09) 0px 3px 12px"
83
+ }
84
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@helpdice/theme",
3
- "version": "1.0.5",
3
+ "version": "1.0.9",
4
4
  "main": "dist/index.js",
5
5
  "types": "esm/index.d.ts",
6
6
  "unpkg": "dist/index.min.js",
@@ -70,6 +70,7 @@
70
70
  "@rollup/plugin-node-resolve": "16.0.0",
71
71
  "@types/enzyme": "^3.10.18",
72
72
  "@types/react": "~18.3.1",
73
+ "@types/react-dom": "^19.2.2",
73
74
  "@typescript-eslint/eslint-plugin": "^8.22.0",
74
75
  "@typescript-eslint/parser": "^8.22.0",
75
76
  "css-mediaquery": "^0.1.2",
@@ -92,6 +93,7 @@
92
93
  "@types/hoist-non-react-statics": "^3.3.6",
93
94
  "babel-plugin-transform-rename-import": "^2.3.0",
94
95
  "hoist-non-react-statics": "^3.3.2",
96
+ "react-dom": "^19.2.0",
95
97
  "react-fast-compare": "^3.2.2",
96
98
  "react-is": "^19.0.0",
97
99
  "rehype-join-line": "^1.0.2",