@rtsee/ngx 0.0.89 → 0.0.92

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.
@@ -0,0 +1,153 @@
1
+ @import "./variables";
2
+
3
+ .rtsee-rate-input {
4
+ display: flex;
5
+ flex-direction: column;
6
+ gap: $rts-offset-md;
7
+ border-bottom: 1px solid $rts-rates-border-dim;
8
+ padding-bottom: $rts-offset-lg;
9
+ box-sizing: border-box;
10
+
11
+ .rtsee-rate-input-header {
12
+ display: flex;
13
+ flex-direction: column;
14
+ gap: $rts-offset-xsm;
15
+ margin-bottom: $rts-offset-sm;
16
+
17
+ .rtsee-rate-input-name {
18
+ margin: 0;
19
+ font-size: 1.05rem;
20
+ font-weight: 700;
21
+ color: $rts-rates-text-primary;
22
+ letter-spacing: -0.01em;
23
+ }
24
+
25
+ .rtsee-rate-input-description {
26
+ margin: 0;
27
+ font-size: 0.84rem;
28
+ color: $rts-rates-text-secondary;
29
+ line-height: 1.4;
30
+ }
31
+ }
32
+
33
+ &:last-of-type {
34
+ border-bottom: none;
35
+ padding-bottom: 0;
36
+ }
37
+
38
+ .rtsee-rate-form-container {
39
+ .rtsee-rate-form {
40
+ display: flex;
41
+ flex-direction: column;
42
+ }
43
+ }
44
+
45
+ .rtsee-rate-comment-field {
46
+ background: rgba(255, 255, 255, 0.03) !important;
47
+ border: 1px solid $rts-rates-border-med !important;
48
+ border-radius: $rts-default-border-radius !important;
49
+ padding: ($rts-offset-sm + $rts-offset-xsm) $rts-offset-md !important;
50
+ font-family: inherit !important;
51
+ font-size: 0.92rem !important;
52
+ color: $rts-rates-text-primary !important;
53
+ transition:
54
+ border-color 0.25s ease,
55
+ box-shadow 0.25s ease,
56
+ background-color 0.25s ease !important;
57
+ outline: none !important;
58
+ resize: vertical !important;
59
+ min-height: 52px !important;
60
+ width: 100% !important;
61
+ box-sizing: border-box !important;
62
+
63
+ &::placeholder {
64
+ color: $rts-rates-text-muted !important;
65
+ }
66
+
67
+ &:hover {
68
+ background: rgba(255, 255, 255, 0.05) !important;
69
+ border-color: $rts-rates-border-bright !important;
70
+ }
71
+
72
+ &:focus {
73
+ background: rgba(255, 255, 255, 0.06) !important;
74
+ border-color: $rts-rates-accent-purple !important;
75
+ box-shadow: 0 0 0 3px rgba($rts-rates-accent-purple, 0.2) !important;
76
+ }
77
+ }
78
+
79
+ .rtsee-rate-select-container {
80
+ display: flex;
81
+ align-items: center;
82
+ justify-content: space-between;
83
+ gap: $rts-offset-md;
84
+ flex-wrap: wrap;
85
+
86
+ rtsee-rating {
87
+ flex-shrink: 0;
88
+ }
89
+
90
+ p-message {
91
+ .p-message {
92
+ margin: 0;
93
+ padding: 6px 12px;
94
+ font-size: 0.8rem;
95
+ border-radius: 6px;
96
+ }
97
+ }
98
+ }
99
+ }
100
+
101
+ /* ── RATING STARS GLOBAL STYLES ───────────────────────────────── */
102
+ .rtsee-rating {
103
+ display: inline-flex;
104
+ align-items: center;
105
+ gap: $rts-offset-xsm;
106
+
107
+ .rtsee-rating-star {
108
+ font-size: 1.5rem;
109
+ line-height: 1;
110
+ color: $rts-rates-star-empty;
111
+ transition:
112
+ color 0.15s ease,
113
+ transform 0.15s ease,
114
+ text-shadow 0.15s ease;
115
+ user-select: none;
116
+
117
+ &.rtsee-rating-star-full {
118
+ color: $rts-rates-accent-gold;
119
+ text-shadow: 0 0 8px $rts-rates-accent-gold-shadow;
120
+ }
121
+
122
+ &.rtsee-rating-star-half {
123
+ color: $rts-rates-accent-gold;
124
+ opacity: 0.65;
125
+ }
126
+
127
+ &.rtsee-rating-star-empty {
128
+ color: $rts-rates-star-empty;
129
+ }
130
+
131
+ &.rtsee-rating-star-clickable {
132
+ cursor: pointer;
133
+
134
+ &:hover {
135
+ transform: scale(1.2);
136
+ color: #ffeaa7;
137
+ text-shadow: 0 0 10px rgba(255, 234, 167, 0.8);
138
+ }
139
+
140
+ &:active {
141
+ transform: scale(0.95);
142
+ }
143
+ }
144
+ }
145
+
146
+ .rtsee-rating-number {
147
+ font-size: 1.1rem;
148
+ font-weight: 700;
149
+ color: $rts-rates-accent-gold;
150
+ margin-left: $rts-offset-sm;
151
+ text-shadow: 0 0 4px rgba($rts-rates-accent-gold, 0.3);
152
+ }
153
+ }
@@ -0,0 +1,204 @@
1
+ @import "./variables";
2
+
3
+ .rtsee-rates-group-item {
4
+ background: linear-gradient(
5
+ 145deg,
6
+ $rts-rates-bg-card-start 0%,
7
+ $rts-rates-bg-card-end 100%
8
+ );
9
+ border: 1px solid $rts-rates-border-dim;
10
+ border-radius: 14px;
11
+ transition:
12
+ transform 0.25s ease,
13
+ border-color 0.25s ease,
14
+ box-shadow 0.25s ease;
15
+ display: flex;
16
+ flex-direction: column;
17
+ animation: ratesListCardSlideUp 0.6s ease-out both;
18
+
19
+ // Mobile first default styles
20
+ padding: $rts-offset-md;
21
+ gap: $rts-offset-sm;
22
+
23
+ &:hover {
24
+ transform: translateY(-3px);
25
+ border-color: $rts-rates-border-bright;
26
+ box-shadow: 0 6px 24px rgba(0, 0, 0, 0.3);
27
+ }
28
+
29
+ .rtsee-rates-group-header {
30
+ display: flex;
31
+ justify-content: space-between;
32
+ align-items: center;
33
+ border-bottom: 1px solid $rts-rates-border-dim;
34
+ padding-bottom: ($rts-offset-sm + $rts-offset-xsm);
35
+ flex-wrap: wrap;
36
+ gap: $rts-offset-sm;
37
+
38
+ .rtsee-rates-group-user-info {
39
+ display: flex;
40
+ align-items: center;
41
+ gap: $rts-offset-sm;
42
+ min-width: 0;
43
+
44
+ .rtsee-rates-group-avatar {
45
+ width: 36px;
46
+ height: 36px;
47
+ border-radius: 50%;
48
+ background: rgba($rts-rates-accent-purple, 0.15);
49
+ border: 2px solid rgba($rts-rates-accent-purple, 0.3);
50
+ object-fit: cover;
51
+ flex-shrink: 0;
52
+ }
53
+
54
+ .rtsee-rates-group-avatar-fallback {
55
+ width: 36px;
56
+ height: 36px;
57
+ border-radius: 50%;
58
+ background: rgba($rts-rates-accent-purple, 0.15);
59
+ border: 2px solid rgba($rts-rates-accent-purple, 0.3);
60
+ color: $rts-rates-text-primary;
61
+ font-weight: 700;
62
+ font-size: 0.95rem;
63
+ display: flex;
64
+ align-items: center;
65
+ justify-content: center;
66
+ text-transform: uppercase;
67
+ flex-shrink: 0;
68
+ }
69
+
70
+ .rtsee-rates-group-peer-name {
71
+ font-size: 0.95rem;
72
+ font-weight: 600;
73
+ color: $rts-rates-text-primary;
74
+ text-overflow: ellipsis;
75
+ overflow: hidden;
76
+ white-space: nowrap;
77
+ }
78
+ }
79
+
80
+ .rtsee-rates-group-right-header {
81
+ display: flex;
82
+ align-items: center;
83
+ gap: ($rts-offset-sm + $rts-offset-xsm);
84
+ flex-shrink: 0;
85
+
86
+ .rtsee-rates-group-date {
87
+ font-size: 0.78rem;
88
+ color: $rts-rates-text-muted;
89
+ }
90
+
91
+ .rtsee-rates-group-actions {
92
+ display: flex;
93
+ align-items: center;
94
+ gap: 6px;
95
+
96
+ .rtsee-rates-group-btn-edit ::v-deep .p-button,
97
+ .rtsee-rates-group-btn-delete ::v-deep .p-button {
98
+ padding: 0 !important;
99
+ width: 28px !important;
100
+ height: 28px !important;
101
+ border-radius: 6px !important;
102
+ display: inline-flex !important;
103
+ align-items: center !important;
104
+ justify-content: center !important;
105
+ transition:
106
+ transform 0.2s ease,
107
+ background-color 0.2s ease;
108
+ box-shadow: none !important;
109
+
110
+ &:hover {
111
+ transform: scale(1.1);
112
+ }
113
+ }
114
+
115
+ .rtsee-rates-group-btn-edit ::v-deep .p-button {
116
+ color: $rts-rates-text-secondary !important;
117
+ background: rgba(255, 255, 255, 0.04) !important;
118
+ border: 1px solid $rts-rates-border-med !important;
119
+
120
+ &:hover {
121
+ background: rgba($rts-rates-accent-purple, 0.15) !important;
122
+ border-color: rgba($rts-rates-accent-purple, 0.35) !important;
123
+ color: $rts-rates-text-primary !important;
124
+ }
125
+ }
126
+
127
+ .rtsee-rates-group-btn-delete ::v-deep .p-button {
128
+ color: $rts-rates-danger !important;
129
+ background: $rts-rates-danger-bg !important;
130
+ border: 1px solid $rts-rates-danger-border !important;
131
+
132
+ &:hover {
133
+ background: $rts-rates-danger-hover-bg !important;
134
+ border-color: $rts-rates-danger-hover-border !important;
135
+ color: $rts-rates-text-primary !important;
136
+ }
137
+ }
138
+ }
139
+ }
140
+ }
141
+
142
+ .rtsee-rates-group-body {
143
+ display: flex;
144
+ flex-direction: column;
145
+ gap: $rts-offset-md;
146
+
147
+ .rtsee-rates-group-rate-item-container {
148
+ display: flex;
149
+ flex-direction: column;
150
+ gap: 6px;
151
+ }
152
+
153
+ .rtsee-rates-group-rate-item {
154
+ display: flex;
155
+ justify-content: space-between;
156
+ align-items: center;
157
+ gap: $rts-offset-md;
158
+
159
+ .rtsee-rates-group-rate-config-name {
160
+ font-size: 0.88rem;
161
+ color: $rts-rates-text-secondary;
162
+ font-weight: 500;
163
+ }
164
+
165
+ rtsee-rating {
166
+ .rtsee-rating-star {
167
+ font-size: 1.15rem;
168
+ }
169
+ }
170
+ }
171
+
172
+ .rtsee-rates-group-rate-comment {
173
+ margin: $rts-offset-xsm 0 $rts-offset-sm 0;
174
+ font-size: 0.88rem;
175
+ line-height: 1.5;
176
+ color: $rts-rates-text-secondary;
177
+ font-style: italic;
178
+ padding-left: ($rts-offset-sm + $rts-offset-xsm);
179
+ border-left: 2px solid rgba($rts-rates-accent-purple, 0.4);
180
+ }
181
+ }
182
+
183
+ // Desktop media overrides
184
+ @media screen and (min-width: $rts-break-sm) {
185
+ padding: $rts-offset-lg;
186
+ gap: $rts-offset-md;
187
+
188
+ .rtsee-rates-group-header {
189
+ flex-wrap: nowrap;
190
+ gap: 0;
191
+ }
192
+ }
193
+ }
194
+
195
+ @keyframes ratesListCardSlideUp {
196
+ from {
197
+ opacity: 0;
198
+ transform: translateY(16px);
199
+ }
200
+ to {
201
+ opacity: 1;
202
+ transform: translateY(0);
203
+ }
204
+ }
@@ -0,0 +1,212 @@
1
+ @import "./variables";
2
+
3
+ .rtsee-rater {
4
+ background: linear-gradient(
5
+ 135deg,
6
+ $rts-rates-bg-form-start 0%,
7
+ $rts-rates-bg-form-end 100%
8
+ );
9
+ border: 1px solid $rts-rates-border-dim;
10
+ border-radius: 16px;
11
+ backdrop-filter: blur(12px);
12
+ box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
13
+ display: flex;
14
+ flex-direction: column;
15
+ transition:
16
+ transform 0.3s ease,
17
+ border-color 0.3s ease,
18
+ box-shadow 0.3s ease;
19
+ animation: raterSlideUp 0.6s ease-out both;
20
+
21
+ // Mobile first default styles
22
+ padding: $rts-offset-md;
23
+ margin-bottom: $rts-offset-xl;
24
+
25
+ &.rtsee-rater-view-mode {
26
+ padding: 0;
27
+ }
28
+
29
+ &:hover {
30
+ border-color: rgba($rts-rates-accent-purple, 0.3);
31
+ box-shadow: 0 8px 32px rgba($rts-rates-accent-purple, 0.15);
32
+ }
33
+
34
+ .rtsee-rater-user-header {
35
+ display: flex;
36
+ align-items: center;
37
+ gap: ($rts-offset-sm + $rts-offset-xsm);
38
+ margin-bottom: $rts-offset-md;
39
+
40
+ .rtsee-rater-avatar {
41
+ width: 40px;
42
+ height: 40px;
43
+ border-radius: 50%;
44
+ background: rgba($rts-rates-accent-purple, 0.15);
45
+ border: 2px solid rgba($rts-rates-accent-purple, 0.3);
46
+ object-fit: cover;
47
+ flex-shrink: 0;
48
+ }
49
+
50
+ .rtsee-rater-avatar-fallback {
51
+ width: 40px;
52
+ height: 40px;
53
+ border-radius: 50%;
54
+ background: rgba($rts-rates-accent-purple, 0.15);
55
+ border: 2px solid rgba($rts-rates-accent-purple, 0.3);
56
+ color: $rts-rates-text-primary;
57
+ font-weight: 700;
58
+ font-size: 1.1rem;
59
+ display: flex;
60
+ align-items: center;
61
+ justify-content: center;
62
+ text-transform: uppercase;
63
+ flex-shrink: 0;
64
+ }
65
+
66
+ .rtsee-rater-user-info {
67
+ display: flex;
68
+ flex-direction: column;
69
+ gap: 2px;
70
+ min-width: 0;
71
+
72
+ .rtsee-rater-user-name {
73
+ font-size: 0.94rem;
74
+ font-weight: 600;
75
+ color: $rts-rates-text-primary;
76
+ }
77
+
78
+ .rtsee-rater-user-status {
79
+ font-size: 0.76rem;
80
+ color: $rts-rates-text-muted;
81
+ }
82
+ }
83
+ }
84
+
85
+ .rtsee-rater-divider {
86
+ border: none;
87
+ border-top: 1px solid $rts-rates-border-med;
88
+ margin: $rts-offset-sm 0 ($rts-offset-md + $rts-offset-xsm) 0;
89
+ }
90
+
91
+ .rtsee-rater-actions {
92
+ display: flex;
93
+ gap: ($rts-offset-sm + $rts-offset-xsm);
94
+ margin-top: ($rts-offset-sm + $rts-offset-xsm);
95
+
96
+ // Mobile action stacking
97
+ flex-direction: column;
98
+
99
+ p-button {
100
+ width: 100%;
101
+
102
+ button {
103
+ display: inline-flex;
104
+ align-items: center;
105
+ gap: $rts-offset-sm;
106
+ font-weight: 600;
107
+ font-family: inherit;
108
+ border-radius: $rts-default-border-radius;
109
+ padding: ($rts-offset-sm + $rts-offset-xsm) $rts-offset-lg;
110
+ transition:
111
+ transform 0.2s ease,
112
+ box-shadow 0.2s ease,
113
+ filter 0.2s ease;
114
+ border: none;
115
+ cursor: pointer;
116
+ width: 100%;
117
+ justify-content: center;
118
+
119
+ span {
120
+ margin: 0;
121
+ }
122
+
123
+ &.p-button-primary {
124
+ background: linear-gradient(
125
+ 135deg,
126
+ $rts-rates-accent-purple 0%,
127
+ $rts-rates-accent-purple-light 100%
128
+ );
129
+ color: $rts-rates-text-primary;
130
+ box-shadow: 0 4px 16px rgba($rts-rates-accent-purple, 0.3);
131
+
132
+ &:hover {
133
+ transform: translateY(-2px);
134
+ box-shadow: 0 6px 20px rgba($rts-rates-accent-purple, 0.45);
135
+ }
136
+
137
+ &:active {
138
+ transform: translateY(0);
139
+ }
140
+ }
141
+
142
+ &.p-button-success {
143
+ background: linear-gradient(
144
+ 135deg,
145
+ $rts-rates-success 0%,
146
+ color-mix(in srgb, $rts-rates-success 80%, black) 100%
147
+ );
148
+ color: $rts-rates-text-primary;
149
+ box-shadow: 0 4px 16px rgba($rts-rates-success, 0.3);
150
+
151
+ &:hover {
152
+ transform: translateY(-2px);
153
+ box-shadow: 0 6px 20px rgba($rts-rates-success, 0.45);
154
+ }
155
+
156
+ &:active {
157
+ transform: translateY(0);
158
+ }
159
+ }
160
+
161
+ &.p-button-danger {
162
+ background: linear-gradient(
163
+ 135deg,
164
+ $rts-rates-danger 0%,
165
+ color-mix(in srgb, $rts-rates-danger 80%, black) 100%
166
+ );
167
+ color: $rts-rates-text-primary;
168
+ box-shadow: 0 4px 16px rgba($rts-rates-danger, 0.3);
169
+
170
+ &:hover {
171
+ transform: translateY(-2px);
172
+ box-shadow: 0 6px 20px rgba($rts-rates-danger, 0.45);
173
+ }
174
+
175
+ &:active {
176
+ transform: translateY(0);
177
+ }
178
+ }
179
+ }
180
+ }
181
+ }
182
+
183
+ // Desktop tablet media overrides
184
+ @media screen and (min-width: $rts-break-sm) {
185
+ padding: $rts-offset-xl;
186
+
187
+ .rtsee-rater-actions {
188
+ flex-direction: row;
189
+ justify-content: flex-end;
190
+
191
+ p-button {
192
+ width: auto;
193
+
194
+ button {
195
+ width: auto;
196
+ justify-content: flex-start;
197
+ }
198
+ }
199
+ }
200
+ }
201
+ }
202
+
203
+ @keyframes raterSlideUp {
204
+ from {
205
+ opacity: 0;
206
+ transform: translateY(24px);
207
+ }
208
+ to {
209
+ opacity: 1;
210
+ transform: translateY(0);
211
+ }
212
+ }
@@ -0,0 +1,46 @@
1
+ @import "./variables";
2
+
3
+ .rtsee-rates-list {
4
+ display: flex;
5
+ flex-direction: column;
6
+ gap: $rts-offset-md;
7
+ overflow-y: auto;
8
+ max-height: 700px;
9
+ box-sizing: border-box;
10
+
11
+ &::-webkit-scrollbar {
12
+ width: $rts-offset-xsm;
13
+ }
14
+ &::-webkit-scrollbar-track {
15
+ background: rgba(255, 255, 255, 0.02);
16
+ border-radius: 10px;
17
+ }
18
+ &::-webkit-scrollbar-thumb {
19
+ background: rgba(255, 255, 255, 0.1);
20
+ border-radius: 10px;
21
+
22
+ &:hover {
23
+ background: rgba($rts-rates-accent-purple, 0.4);
24
+ }
25
+ }
26
+
27
+ .rtsee-rates-list-loading {
28
+ text-align: center;
29
+ font-size: 0.86rem;
30
+ color: $rts-rates-text-secondary;
31
+ padding: $rts-offset-md 0;
32
+ font-weight: 500;
33
+ letter-spacing: 0.02em;
34
+ animation: listLoadingPulse 1.5s infinite ease-in-out;
35
+ }
36
+ }
37
+
38
+ @keyframes listLoadingPulse {
39
+ 0%,
40
+ 100% {
41
+ opacity: 0.6;
42
+ }
43
+ 50% {
44
+ opacity: 1;
45
+ }
46
+ }
@@ -0,0 +1,10 @@
1
+ @import "./variables";
2
+
3
+ .rtsee-rating-section {
4
+ box-sizing: border-box;
5
+
6
+ @media screen and (min-width: $rts-break-md) {
7
+ max-width: 1200px;
8
+ margin: 0 auto;
9
+ }
10
+ }
@@ -0,0 +1 @@
1
+ @import "../common-variables";
@@ -8,3 +8,4 @@
8
8
  @import "./auth/index";
9
9
  @import "./forms/index";
10
10
  @import "./common-components/index";
11
+ @import "./rates/index";
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "0.0.89",
2
+ "version": "0.0.92",
3
3
  "name": "@rtsee/ngx",
4
4
  "module": "./dist/ngx/fesm2022/rtsee-ngx.mjs",
5
5
  "types": "./dist/ngx/index.d.ts",
@@ -40,15 +40,15 @@
40
40
  "@angular/platform-browser-dynamic": "^20.1.2",
41
41
  "@angular/router": "^20.1.2",
42
42
  "@primeuix/themes": "^1.2.3",
43
- "@rtsee/common": "^0.0.60",
44
- "@rtsee/conference": "^0.0.61",
45
- "@rtsee/core": "^0.0.104",
46
- "@rtsee/events-dashboard": "^0.0.94",
47
- "@rtsee/factory": "^0.0.103",
48
- "@rtsee/messenger": "^0.0.94",
49
- "@rtsee/presentation": "^0.0.93",
50
- "@rtsee/signaling-client": "^0.0.107",
51
- "@rtsee/utilities-ui": "^0.0.25",
43
+ "@rtsee/common": "^0.0.63",
44
+ "@rtsee/conference": "^0.0.64",
45
+ "@rtsee/core": "^0.0.107",
46
+ "@rtsee/events-dashboard": "^0.0.97",
47
+ "@rtsee/factory": "^0.0.106",
48
+ "@rtsee/messenger": "^0.0.97",
49
+ "@rtsee/presentation": "^0.0.96",
50
+ "@rtsee/signaling-client": "^0.0.110",
51
+ "@rtsee/utilities-ui": "^0.0.28",
52
52
  "@stripe/stripe-js": "^8.6.1",
53
53
  "@types/node": "~24.0.14",
54
54
  "dayjs": "^1.11.9",
@@ -70,5 +70,5 @@
70
70
  "publishConfig": {
71
71
  "access": "public"
72
72
  },
73
- "gitHead": "1b642ce33ceebb6a75cb755ad7bcf9335b15a43a"
73
+ "gitHead": "ed78e51c5a985b2d846bd66cf188a0480632b695"
74
74
  }