@rovula/ui 0.1.0 → 0.1.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 (70) hide show
  1. package/dist/cjs/bundle.css +65 -0
  2. package/dist/cjs/bundle.js +9261 -3
  3. package/dist/cjs/bundle.js.map +1 -1
  4. package/dist/cjs/types/components/Footer/Footer.d.ts +21 -0
  5. package/dist/cjs/types/components/Footer/Footer.stories.d.ts +45 -0
  6. package/dist/cjs/types/components/Footer/index.d.ts +2 -0
  7. package/dist/cjs/types/components/Icon/Icon.d.ts +1 -1
  8. package/dist/cjs/types/components/Icon/Icon.stories.d.ts +9 -1
  9. package/dist/cjs/types/components/Navbar/Navbar.d.ts +5 -0
  10. package/dist/cjs/types/components/Navbar/Navbar.stories.d.ts +14 -0
  11. package/dist/cjs/types/components/PasswordInput/PasswordInput.d.ts +19 -0
  12. package/dist/cjs/types/components/PasswordInput/PasswordInput.stories.d.ts +395 -0
  13. package/dist/cjs/types/components/PasswordInput/index.d.ts +2 -0
  14. package/dist/cjs/types/icons/index.d.ts +1 -0
  15. package/dist/cjs/types/icons/lucideIconNames.d.ts +9 -0
  16. package/dist/cjs/types/index.d.ts +7 -1
  17. package/dist/cjs/types/utils/colors.d.ts +330 -0
  18. package/dist/components/Footer/Footer.js +11 -0
  19. package/dist/components/Footer/Footer.stories.js +34 -0
  20. package/dist/components/Footer/index.js +2 -0
  21. package/dist/components/Icon/Icon.js +28 -11
  22. package/dist/components/Icon/Icon.stories.js +39 -0
  23. package/dist/components/Navbar/Navbar.js +18 -4
  24. package/dist/components/Navbar/Navbar.stories.js +16 -9
  25. package/dist/components/PasswordInput/PasswordInput.js +36 -0
  26. package/dist/components/PasswordInput/PasswordInput.stories.js +67 -0
  27. package/dist/components/PasswordInput/index.js +1 -0
  28. package/dist/esm/bundle.css +65 -0
  29. package/dist/esm/bundle.js +9261 -3
  30. package/dist/esm/bundle.js.map +1 -1
  31. package/dist/esm/types/components/Footer/Footer.d.ts +21 -0
  32. package/dist/esm/types/components/Footer/Footer.stories.d.ts +45 -0
  33. package/dist/esm/types/components/Footer/index.d.ts +2 -0
  34. package/dist/esm/types/components/Icon/Icon.d.ts +1 -1
  35. package/dist/esm/types/components/Icon/Icon.stories.d.ts +9 -1
  36. package/dist/esm/types/components/Navbar/Navbar.d.ts +5 -0
  37. package/dist/esm/types/components/Navbar/Navbar.stories.d.ts +14 -0
  38. package/dist/esm/types/components/PasswordInput/PasswordInput.d.ts +19 -0
  39. package/dist/esm/types/components/PasswordInput/PasswordInput.stories.d.ts +395 -0
  40. package/dist/esm/types/components/PasswordInput/index.d.ts +2 -0
  41. package/dist/esm/types/icons/index.d.ts +1 -0
  42. package/dist/esm/types/icons/lucideIconNames.d.ts +9 -0
  43. package/dist/esm/types/index.d.ts +7 -1
  44. package/dist/esm/types/utils/colors.d.ts +330 -0
  45. package/dist/icons/index.js +1 -0
  46. package/dist/icons/lucideIconNames.js +12 -0
  47. package/dist/index.d.ts +386 -2
  48. package/dist/index.js +4 -0
  49. package/dist/src/theme/global.css +117 -24
  50. package/dist/utils/colors.js +369 -0
  51. package/package.json +2 -1
  52. package/src/components/Footer/Footer.stories.tsx +119 -0
  53. package/src/components/Footer/Footer.tsx +122 -0
  54. package/src/components/Footer/index.ts +3 -0
  55. package/src/components/Icon/Icon.stories.tsx +89 -0
  56. package/src/components/Icon/Icon.tsx +44 -23
  57. package/src/components/Navbar/Navbar.stories.tsx +109 -55
  58. package/src/components/Navbar/Navbar.tsx +41 -3
  59. package/src/components/PasswordInput/PasswordInput.stories.tsx +111 -0
  60. package/src/components/PasswordInput/PasswordInput.tsx +50 -0
  61. package/src/components/PasswordInput/index.ts +2 -0
  62. package/src/icons/index.ts +1 -0
  63. package/src/icons/lucideIconNames.ts +14 -0
  64. package/src/index.ts +15 -1
  65. package/src/theme/themes/skyller/typography.css +24 -24
  66. package/src/theme/tokens/baseline.css +1 -0
  67. package/src/theme/tokens/components/footer.css +9 -0
  68. package/src/theme/tokens/components/navbar.css +2 -1
  69. package/src/types/lucide-react.d.ts +5 -0
  70. package/src/utils/colors.ts +383 -0
@@ -566,6 +566,9 @@ input[type=number] {
566
566
  .pointer-events-auto{
567
567
  pointer-events: auto;
568
568
  }
569
+ .visible{
570
+ visibility: visible;
571
+ }
569
572
  .static{
570
573
  position: static;
571
574
  }
@@ -657,6 +660,12 @@ input[type=number] {
657
660
  .top-full{
658
661
  top: 100%;
659
662
  }
663
+ .-z-10{
664
+ z-index: -10;
665
+ }
666
+ .-z-\[5\]{
667
+ z-index: -5;
668
+ }
660
669
  .z-0{
661
670
  z-index: 0;
662
671
  }
@@ -868,6 +877,9 @@ input[type=number] {
868
877
  .h-60{
869
878
  height: 15rem;
870
879
  }
880
+ .h-\[200vh\]{
881
+ height: 200vh;
882
+ }
871
883
  .h-\[24px\]{
872
884
  height: 24px;
873
885
  }
@@ -892,6 +904,12 @@ input[type=number] {
892
904
  .h-\[64px\]{
893
905
  height: 64px;
894
906
  }
907
+ .h-\[var\(--footer-height\)\]{
908
+ height: var(--footer-height);
909
+ }
910
+ .h-\[var\(--footer-height-simple\)\]{
911
+ height: var(--footer-height-simple);
912
+ }
895
913
  .h-\[var\(--navbar-height\)\]{
896
914
  height: var(--navbar-height);
897
915
  }
@@ -911,12 +929,18 @@ input[type=number] {
911
929
  .max-h-60{
912
930
  max-height: 15rem;
913
931
  }
932
+ .max-h-\[80vh\]{
933
+ max-height: 80vh;
934
+ }
914
935
  .max-h-screen{
915
936
  max-height: 100vh;
916
937
  }
917
938
  .min-h-10{
918
939
  min-height: 2.5rem;
919
940
  }
941
+ .min-h-screen{
942
+ min-height: 100vh;
943
+ }
920
944
  .w-1\/2{
921
945
  width: 50%;
922
946
  }
@@ -941,6 +965,9 @@ input[type=number] {
941
965
  .w-6{
942
966
  width: 1.5rem;
943
967
  }
968
+ .w-64{
969
+ width: 16rem;
970
+ }
944
971
  .w-8{
945
972
  width: 2rem;
946
973
  }
@@ -1110,6 +1137,9 @@ input[type=number] {
1110
1137
  .grid-cols-9{
1111
1138
  grid-template-columns: repeat(9, minmax(0, 1fr));
1112
1139
  }
1140
+ .grid-cols-\[repeat\(auto-fill\2c minmax\(140px\2c 1fr\)\)\]{
1141
+ grid-template-columns: repeat(auto-fill,minmax(140px,1fr));
1142
+ }
1113
1143
  .flex-row{
1114
1144
  flex-direction: row;
1115
1145
  }
@@ -1170,6 +1200,10 @@ input[type=number] {
1170
1200
  .gap-\[2px\]{
1171
1201
  gap: 2px;
1172
1202
  }
1203
+ .gap-x-\[var\(--footer-gap\)\]{
1204
+ -moz-column-gap: var(--footer-gap);
1205
+ column-gap: var(--footer-gap);
1206
+ }
1173
1207
  .gap-x-\[var\(--navbar-gap\)\]{
1174
1208
  -moz-column-gap: var(--navbar-gap);
1175
1209
  column-gap: var(--navbar-gap);
@@ -1323,6 +1357,9 @@ input[type=number] {
1323
1357
  .border-t{
1324
1358
  border-top-width: 1px;
1325
1359
  }
1360
+ .border-t-2{
1361
+ border-top-width: 2px;
1362
+ }
1326
1363
  .border-solid{
1327
1364
  border-style: solid;
1328
1365
  }
@@ -1543,6 +1580,9 @@ input[type=number] {
1543
1580
  --tw-border-opacity: 1;
1544
1581
  border-right-color: color-mix(in srgb, var(--input-color-error) calc(100% * var(--tw-border-opacity, 1)), transparent);
1545
1582
  }
1583
+ .border-t-\[var\(--footer-border-color\)\]{
1584
+ border-top-color: var(--footer-border-color);
1585
+ }
1546
1586
  .border-t-secondary{
1547
1587
  --tw-border-opacity: 1;
1548
1588
  border-top-color: color-mix(in srgb, var(--state-color-secondary-default) calc(100% * var(--tw-border-opacity, 1)), transparent);
@@ -1562,6 +1602,9 @@ input[type=number] {
1562
1602
  .bg-\[var\(--dropdown-menu-seperator-bg\)\]{
1563
1603
  background-color: var(--dropdown-menu-seperator-bg);
1564
1604
  }
1605
+ .bg-\[var\(--footer-bg-color\)\]{
1606
+ background-color: var(--footer-bg-color);
1607
+ }
1565
1608
  .bg-action-button-icon-active{
1566
1609
  --tw-bg-opacity: 1;
1567
1610
  background-color: color-mix(in srgb, var(--action-button-icon-active-bg) calc(100% * var(--tw-bg-opacity, 1)), transparent);
@@ -2907,6 +2950,9 @@ input[type=number] {
2907
2950
  .fill-warning{
2908
2951
  fill: color-mix(in srgb, var(--state-color-warning-default) calc(100% * 1), transparent);
2909
2952
  }
2953
+ .stroke-current{
2954
+ stroke: currentColor;
2955
+ }
2910
2956
  .stroke-input-default-stroke{
2911
2957
  stroke: color-mix(in srgb, var(--input-color-default-stroke) calc(100% * 1), transparent);
2912
2958
  }
@@ -3109,6 +3155,9 @@ input[type=number] {
3109
3155
  .align-middle{
3110
3156
  vertical-align: middle;
3111
3157
  }
3158
+ .font-mono{
3159
+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
3160
+ }
3112
3161
  .font-poppins{
3113
3162
  font-family: Poppins, sans-serif;
3114
3163
  }
@@ -3313,6 +3362,9 @@ input[type=number] {
3313
3362
  .text-\[var\(--dropdown-menu-selected-text\)\]{
3314
3363
  color: var(--dropdown-menu-selected-text);
3315
3364
  }
3365
+ .text-\[var\(--footer-text-color\)\]{
3366
+ color: var(--footer-text-color);
3367
+ }
3316
3368
  .text-\[var\(--loading-process-color\)\]{
3317
3369
  color: var(--loading-process-color);
3318
3370
  }
@@ -3618,6 +3670,10 @@ input[type=number] {
3618
3670
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
3619
3671
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3620
3672
  }
3673
+ .shadow-\[var\(--navbar-shadow-scrolled\)\]{
3674
+ --tw-shadow-color: var(--navbar-shadow-scrolled);
3675
+ --tw-shadow: var(--tw-shadow-colored);
3676
+ }
3621
3677
  .outline-none{
3622
3678
  outline: 2px solid transparent;
3623
3679
  outline-offset: 2px;
@@ -3690,6 +3746,11 @@ input[type=number] {
3690
3746
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
3691
3747
  transition-duration: 150ms;
3692
3748
  }
3749
+ .transition-shadow{
3750
+ transition-property: box-shadow;
3751
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
3752
+ transition-duration: 150ms;
3753
+ }
3693
3754
  .transition-transform{
3694
3755
  transition-property: transform;
3695
3756
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -4126,6 +4187,10 @@ input[type=number] {
4126
4187
  --tw-bg-opacity: 1;
4127
4188
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
4128
4189
  }
4190
+ .hover\:bg-gray-50:hover{
4191
+ --tw-bg-opacity: 1;
4192
+ background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
4193
+ }
4129
4194
  .hover\:bg-input-active-stroke\/10:hover{
4130
4195
  background-color: color-mix(in srgb, var(--input-color-active-stroke) calc(100% * 0.1), transparent);
4131
4196
  }