@warmio/ui 1.4.0 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/LICENSES/fluid-functionalism.txt +24 -0
  2. package/README.md +23 -14
  3. package/dist/badge.js +2 -2
  4. package/dist/button.js +4 -1
  5. package/dist/chunks/chunk-A2PN77YE.js +42 -0
  6. package/dist/chunks/chunk-DHV2A22F.js +240 -0
  7. package/dist/chunks/chunk-DOOSH3V6.js +72 -0
  8. package/dist/chunks/chunk-EIEA5RJJ.js +97 -0
  9. package/dist/chunks/chunk-FKGHMPVW.js +875 -0
  10. package/dist/chunks/chunk-K36HD5J5.js +133 -0
  11. package/dist/chunks/chunk-L6L3GVGM.js +130 -0
  12. package/dist/chunks/chunk-MGX6ZL6Q.js +224 -0
  13. package/dist/chunks/chunk-MVUHHKBL.js +492 -0
  14. package/dist/chunks/chunk-PJUNSOJK.js +116 -0
  15. package/dist/chunks/chunk-RVVHR7RY.js +0 -0
  16. package/dist/chunks/chunk-U7D32UN3.js +0 -0
  17. package/dist/chunks/chunk-W24JGQWM.js +65 -0
  18. package/dist/dropdown-menu.js +4 -3
  19. package/dist/entries/badge.css +178 -0
  20. package/dist/entries/button.css +422 -0
  21. package/dist/entries/dropdown-menu.css +167 -0
  22. package/dist/entries/index.css +2789 -0
  23. package/dist/entries/logo.css +147 -0
  24. package/dist/entries/product-header.css +88 -0
  25. package/dist/entries/sheet.css +666 -0
  26. package/dist/entries/sidebar.css +2108 -0
  27. package/dist/entries/text.css +97 -0
  28. package/dist/index.js +17 -13
  29. package/dist/logo.js +2 -2
  30. package/dist/product-header.js +2 -2
  31. package/dist/product-header.types.d.ts +3 -2
  32. package/dist/sheet.js +5 -3
  33. package/dist/sidebar.css +129 -0
  34. package/dist/sidebar.js +7 -3
  35. package/dist/text.css +121 -0
  36. package/dist/text.js +2 -2
  37. package/package.json +15 -5
  38. package/types/badge.d.ts +10 -2
  39. package/types/button.d.ts +65 -9
  40. package/types/sidebar.d.ts +10 -2
  41. package/types/text.d.ts +10 -2
  42. package/dist/chunks/chunk-4RQCHKAW.js +0 -105
  43. package/dist/chunks/chunk-FW2EHGRK.js +0 -748
  44. package/dist/chunks/chunk-GKEYV2XW.js +0 -10
  45. package/dist/chunks/chunk-HDCV4ACN.js +0 -469
  46. package/dist/chunks/chunk-ICC7GQXS.js +0 -74
  47. package/dist/chunks/chunk-KN6WVLCR.js +0 -261
  48. package/dist/chunks/chunk-MIMC4M6W.js +0 -86
  49. package/dist/chunks/chunk-PBWF6BDE.js +0 -88
  50. package/dist/chunks/chunk-VIB7OX7D.js +0 -10
  51. package/dist/chunks/chunk-YTDMREDR.js +0 -201
package/dist/entries/logo.css ADDED
@@ -0,0 +1,147 @@
1
+ /* ../ui/src/warmio/mascot/mascot.css */
2
+ [data-slot=warm-mascot] {
3
+ --warm-mascot-size: 4.5rem;
4
+ display: block;
5
+ width: var(--warm-mascot-size);
6
+ aspect-ratio: 1;
7
+ position: relative;
8
+ flex-shrink: 0;
9
+ overflow: visible;
10
+ pointer-events: none;
11
+ user-select: none;
12
+ -webkit-user-select: none;
13
+ }
14
+ [data-slot=warm-mascot][data-size=hero] {
15
+ --warm-mascot-size: 5.5rem;
16
+ }
17
+ [data-slot=warm-mascot][data-size=page] {
18
+ --warm-mascot-size: 8rem;
19
+ }
20
+ [data-slot=warm-mascot][data-size=stage] {
21
+ --warm-mascot-size: 14.4rem;
22
+ }
23
+ [data-slot=warm-mascot][data-click-hype] {
24
+ pointer-events: auto;
25
+ cursor: pointer;
26
+ }
27
+ [data-slot=warm-mascot] picture {
28
+ display: block;
29
+ width: 100%;
30
+ height: 100%;
31
+ }
32
+ [data-slot=warm-mascot] svg {
33
+ display: block;
34
+ width: 100%;
35
+ height: 100%;
36
+ pointer-events: visiblePainted;
37
+ }
38
+ [data-slot=warm-mascot] img {
39
+ outline: 0;
40
+ }
41
+ [data-slot=warm-mascot] [data-slot=warm-mascot-frame] {
42
+ display: block;
43
+ width: 100%;
44
+ height: 100%;
45
+ object-fit: contain;
46
+ pointer-events: none;
47
+ }
48
+ a [data-slot=warm-mascot] svg {
49
+ cursor: pointer;
50
+ }
51
+ a [data-slot=warm-mascot] img {
52
+ pointer-events: auto;
53
+ cursor: pointer;
54
+ }
55
+ @media (prefers-reduced-motion: no-preference) {
56
+ [data-slot=warm-mascot] {
57
+ animation: warm-mascot-float 3.8s ease-in-out infinite;
58
+ }
59
+ [data-slot=warm-mascot][data-expression=CONFUSED] #left_pupil path,
60
+ [data-slot=warm-mascot][data-expression=CONFUSED] #right_pupil path {
61
+ transform-box: fill-box;
62
+ transform-origin: center;
63
+ animation: warm-mascot-swirl 2.1s linear infinite;
64
+ }
65
+ }
66
+ @keyframes warm-mascot-swirl {
67
+ to {
68
+ transform: rotate(360deg);
69
+ }
70
+ }
71
+ @keyframes warm-mascot-float {
72
+ 0%, 100% {
73
+ transform: translateY(0);
74
+ }
75
+ 50% {
76
+ transform: translateY(-0.2rem);
77
+ }
78
+ }
79
+
80
+ /* ../ui/src/warmio/logo/logo.css */
81
+ [data-slot=warm-branded-logo] {
82
+ position: relative;
83
+ display: inline-flex;
84
+ flex-shrink: 0;
85
+ align-items: center;
86
+ justify-content: center;
87
+ }
88
+ [data-slot=warm-branded-logo][data-size=sm] {
89
+ width: calc(var(--spacing) * 8);
90
+ height: calc(var(--spacing) * 8);
91
+ }
92
+ [data-slot=warm-branded-logo][data-size=md] {
93
+ width: calc(var(--spacing) * 10);
94
+ height: calc(var(--spacing) * 10);
95
+ }
96
+ [data-slot=warm-branded-logo][data-size=lg] {
97
+ width: calc(var(--spacing) * 14);
98
+ height: calc(var(--spacing) * 14);
99
+ }
100
+ [data-slot=warm-branded-logo-mascot] {
101
+ pointer-events: none;
102
+ position: absolute;
103
+ inset: calc(var(--spacing) * 0);
104
+ scale: 1.35;
105
+ opacity: 90%;
106
+ }
107
+ [data-slot=warm-branded-logo-icon] {
108
+ position: relative;
109
+ z-index: 10;
110
+ filter: drop-shadow(0 1px 2px var(--black-10));
111
+ }
112
+ [data-slot=warm-branded-logo-icon][data-size=sm] {
113
+ width: calc(var(--spacing) * 5);
114
+ height: calc(var(--spacing) * 5);
115
+ }
116
+ [data-slot=warm-branded-logo-icon][data-size=md] {
117
+ width: calc(var(--spacing) * 6);
118
+ height: calc(var(--spacing) * 6);
119
+ }
120
+ [data-slot=warm-branded-logo-icon][data-size=lg] {
121
+ width: calc(var(--spacing) * 8);
122
+ height: calc(var(--spacing) * 8);
123
+ }
124
+ [data-slot=warm-branded-logo-link] {
125
+ display: inline-flex;
126
+ flex-shrink: 0;
127
+ align-items: center;
128
+ }
129
+ [data-slot=warm-branded-logo-static] {
130
+ position: relative;
131
+ display: inline-flex;
132
+ align-items: center;
133
+ justify-content: center;
134
+ width: calc(var(--spacing) * 8);
135
+ height: calc(var(--spacing) * 8);
136
+ }
137
+ [data-slot=warm-branded-logo-static-fill] {
138
+ position: absolute;
139
+ inset: calc(var(--spacing) * 0);
140
+ border-radius: var(--radius-full);
141
+ background-image:
142
+ linear-gradient(
143
+ to bottom right in oklab,
144
+ color-mix(in oklab, var(--primary) 90%, transparent) 0%,
145
+ color-mix(in oklab, var(--warning) 80%, transparent) 50%,
146
+ color-mix(in oklab, var(--primary) 80%, transparent) 100%);
147
+ }
package/dist/entries/product-header.css ADDED
@@ -0,0 +1,88 @@
1
+ /* ../ui/src/warmio/product-header/product-header.css */
2
+ [data-slot=product-header] {
3
+ position: relative;
4
+ top: calc(var(--spacing) * 0);
5
+ z-index: 20;
6
+ display: flex;
7
+ height: var(--header-height);
8
+ flex-shrink: 0;
9
+ flex-wrap: nowrap;
10
+ align-items: center;
11
+ overflow: visible;
12
+ font-size: var(--type-size-body);
13
+ }
14
+ [data-slot=product-header][data-visibility=desktop],
15
+ [data-slot=product-header][data-visibility=container] {
16
+ display: none;
17
+ }
18
+ @media (width >= 48rem) {
19
+ [data-slot=product-header][data-visibility=desktop] {
20
+ display: flex;
21
+ }
22
+ }
23
+ @container main (width >= 48rem) {
24
+ [data-slot=product-header][data-visibility=container] {
25
+ display: flex;
26
+ }
27
+ }
28
+ [data-slot=product-header][data-desktop-shell] {
29
+ -webkit-user-select: none;
30
+ user-select: none;
31
+ }
32
+ @supports (backdrop-filter: var(--tw)) {
33
+ [data-slot=product-header][data-desktop-shell] {
34
+ -webkit-backdrop-filter: blur(8px);
35
+ backdrop-filter: blur(8px);
36
+ }
37
+ }
38
+ [data-slot=product-header-titles] {
39
+ display: flex;
40
+ flex-shrink: 0;
41
+ align-items: center;
42
+ gap: calc(var(--spacing) * 2);
43
+ white-space: nowrap;
44
+ padding-inline: calc(var(--spacing) * 4);
45
+ }
46
+ @media (width >= 48rem) {
47
+ [data-slot=product-header-titles] {
48
+ padding-left: calc(var(--spacing) * 0);
49
+ }
50
+ }
51
+ [data-slot=product-header-actions] {
52
+ display: flex;
53
+ min-width: calc(var(--spacing) * 0);
54
+ flex-shrink: 1;
55
+ align-items: center;
56
+ gap: calc(var(--spacing) * 2);
57
+ margin-left: auto;
58
+ overflow: visible;
59
+ padding-inline: calc(var(--spacing) * 4);
60
+ }
61
+ [data-slot=product-header-fallback] {
62
+ display: contents;
63
+ }
64
+ [data-slot=product-header-titles]:has(> [data-page-chrome-content]) > [data-page-chrome-fallback],
65
+ [data-slot=product-header-actions]:has(> [data-page-chrome-content]) > [data-page-chrome-fallback] {
66
+ display: none;
67
+ }
68
+ [data-slot=product-header-separator] {
69
+ width: calc(var(--spacing) * 4);
70
+ height: calc(var(--spacing) * 4);
71
+ color: var(--foreground);
72
+ }
73
+ [data-slot=product-header] [data-slot=product-header-title] {
74
+ font-size: var(--type-size-body);
75
+ font-weight: 400;
76
+ line-height: 1.25;
77
+ text-decoration: none;
78
+ }
79
+ [data-slot=product-header] [data-slot=product-header-title]:not([aria-current=page]) {
80
+ color: var(--foreground);
81
+ }
82
+ [data-slot=product-header] [data-slot=product-header-title][aria-current=page] {
83
+ font-family: var(--font-sans);
84
+ }
85
+ [data-slot=product-header] [data-slot=product-header-title]:focus-visible {
86
+ outline: var(--focus-ring-width) solid var(--ring);
87
+ outline-offset: 2px;
88
+ }