rbro-tat-uds 2.2.22 → 2.2.23

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,385 @@
1
+ "use strict";
2
+ "use client";
3
+
4
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
5
+ import { colors } from '../../utils';
6
+ import { Children } from 'react';
7
+ import styled, { css } from 'styled-components';
8
+ import IconButton from '../IconButton/IconButton.js';
9
+ import Icon from '../Icon/Icon.js';
10
+
11
+ const PropunereUniqaProtectStyled = styled.div`
12
+ border-radius: 8px;
13
+ border: 1px solid
14
+ ${({ $featured, $selected }) => $selected ? colors.purple_500 : $featured ? colors.accent_600 : colors.gray_200};
15
+ overflow: hidden;
16
+ min-height: ${({ $hideButton }) => $hideButton ? "294px" : "334px"};
17
+ box-sizing: border-box;
18
+ height: 100%;
19
+ width: 100%;
20
+
21
+ ${(props) => !props.$empty ? css`
22
+ outline: ${props.$featured ? `3px solid ${colors.accent_300}` : "none"};
23
+
24
+ & > div:first-of-type {
25
+ & > div:first-child {
26
+ padding: 6px 6px 0px 16px;
27
+ display: flex;
28
+ align-items: center;
29
+ justify-content: space-between;
30
+ gap: 8px;
31
+ background-color: ${props.$refused ? colors.gray_30 : props.$selected ? colors.purple_50 : props.$featured ? colors.accent_100 : "transparent"};
32
+
33
+ & > span {
34
+ font-size: 18px;
35
+ font-weight: 700;
36
+ line-height: 120%;
37
+ color: ${({ $refused }) => $refused ? colors.gray_300 : colors.purple_600};
38
+ }
39
+ }
40
+
41
+ & > div:nth-child(2) {
42
+ box-sizing: border-box;
43
+ display: flex;
44
+ align-items: stretch;
45
+ height: 80px;
46
+
47
+ & > div:first-of-type {
48
+ padding: 8px 4px 12px 16px;
49
+ flex: 1;
50
+ box-sizing: border-box;
51
+ display: flex;
52
+ flex-direction: column;
53
+ gap: 2px;
54
+ background-color: ${props.$refused ? colors.gray_30 : props.$selected ? colors.purple_50 : props.$featured ? colors.accent_100 : "transparent"};
55
+
56
+ & > div {
57
+ display: flex;
58
+ align-items: flex-start;
59
+ gap: 8px;
60
+
61
+ & > svg {
62
+ cursor: pointer;
63
+ }
64
+
65
+ & > span:first-of-type {
66
+ flex: 1;
67
+ font-size: 14px;
68
+ font-weight: ${({ $includePad }) => $includePad ? 700 : 400};
69
+ color: ${({ $refused }) => $refused ? colors.gray_200 : colors.gray_700};
70
+ }
71
+ }
72
+
73
+ & > span {
74
+ font-size: 20px;
75
+ font-weight: 700;
76
+ color: ${({ $refused }) => $refused ? colors.gray_300 : colors.gray_950};
77
+ }
78
+ }
79
+
80
+ & > div:nth-of-type(2) {
81
+ padding: 8px 16px 12px 4px;
82
+ flex: 1;
83
+ box-sizing: border-box;
84
+ display: flex;
85
+ flex-direction: column;
86
+ gap: 2px;
87
+ background-color: ${props.$refused ? colors.gray_30 : props.$selected ? colors.purple_50 : props.$featured ? colors.accent_100 : "transparent"};
88
+
89
+ & > span:first-of-type {
90
+ font-size: 14px;
91
+ font-weight: ${({ $includePad }) => $includePad ? 700 : 400};
92
+ color: ${({ $refused }) => $refused ? colors.gray_200 : colors.gray_700};
93
+ }
94
+
95
+ & > span:nth-of-type(2) {
96
+ font-size: 20px;
97
+ font-weight: 500;
98
+ color: ${({ $refused }) => $refused ? colors.gray_300 : colors.gray_950};
99
+ }
100
+ }
101
+ }
102
+
103
+ & > div:last-child {
104
+ display: flex;
105
+ border-top: 1px solid ${colors.gray_200};
106
+ border-bottom: 1px solid ${colors.gray_200};
107
+ display: flex;
108
+ align-items: stretch;
109
+ box-sizing: border-box;
110
+
111
+ & > div:first-of-type {
112
+ box-sizing: border-box;
113
+ flex: 1;
114
+ height: 58px;
115
+ display: flex;
116
+ align-items: flex-start;
117
+ padding: 12px 16px;
118
+ gap: 8px;
119
+ border-right: 0.5px solid ${colors.gray_200};
120
+ background-color: ${props.$refused ? colors.gray_60 : props.$featured ? colors.white : colors.gray_30};
121
+
122
+ & > div {
123
+ display: flex;
124
+ flex-direction: column;
125
+ gap: 2px;
126
+
127
+ & > div:first-of-type {
128
+ display: flex;
129
+ align-items: center;
130
+ gap: 4px;
131
+
132
+ & > span:first-of-type {
133
+ font-size: 12px;
134
+ font-weight: 400;
135
+ line-height: 120%;
136
+ color: ${({ $refused }) => $refused ? colors.gray_300 : colors.gray_700};
137
+ }
138
+ }
139
+
140
+ & > span {
141
+ font-size: 14px;
142
+ font-weight: 500;
143
+ line-height: 120%;
144
+ color: ${({ $refused }) => $refused ? colors.gray_300 : colors.gray_950};
145
+ }
146
+ }
147
+ }
148
+
149
+ & > div:last-of-type {
150
+ box-sizing: border-box;
151
+ flex: 1;
152
+ height: 58px;
153
+ display: flex;
154
+ align-items: flex-start;
155
+ padding: 12px 16px;
156
+ gap: 8px;
157
+ border-left: 0.5px solid ${colors.gray_200};
158
+ background-color: ${(props2) => props2.$refused ? colors.gray_60 : colors.gray_30};
159
+
160
+ & > div {
161
+ display: flex;
162
+ flex-direction: column;
163
+ gap: 2px;
164
+
165
+ & > span:first-of-type {
166
+ font-size: 12px;
167
+ font-weight: 400;
168
+ line-height: 120%;
169
+ color: ${({ $refused }) => $refused ? colors.gray_300 : colors.gray_700};
170
+ }
171
+
172
+ & > span:nth-of-type(2) {
173
+ font-size: 14px;
174
+ font-weight: 500;
175
+ line-height: 120%;
176
+ color: ${({ $refused }) => $refused ? colors.gray_300 : colors.gray_950};
177
+ }
178
+ }
179
+ }
180
+ }
181
+ }
182
+
183
+ & > div:last-of-type {
184
+ height: 106px;
185
+ box-sizing: border-box;
186
+ }
187
+
188
+ & > button {
189
+ appearance: none;
190
+ border: none;
191
+ outline: none;
192
+ background-color: ${({ $selected, $disabled }) => $selected ? $disabled ? colors.gray_100 : colors.purple_600 : "transparent"};
193
+ padding: 0px;
194
+ width: 100%;
195
+ height: 40px;
196
+ display: flex;
197
+ align-items: center;
198
+ justify-content: center;
199
+ gap: 8px;
200
+ border-top: 1px solid ${colors.gray_200};
201
+ cursor: pointer;
202
+
203
+ & > span {
204
+ font-size: 14px;
205
+ font-weight: 500;
206
+ line-height: 120%;
207
+ color: ${({ $selected, $disabled }) => $selected ? $disabled ? colors.gray_600 : colors.white : $disabled ? colors.gray_300 : colors.purple_600};
208
+ }
209
+ }
210
+ ` : css`
211
+ background-color: ${colors.gray_30};
212
+ display: flex;
213
+ justify-content: center;
214
+ align-items: center;
215
+ padding: 16px;
216
+
217
+ & > div {
218
+ display: flex;
219
+ flex-direction: column;
220
+ gap: 16px;
221
+ justify-content: center;
222
+ align-items: center;
223
+
224
+ & > span {
225
+ font-size: 14px;
226
+ font-weight: 400;
227
+ line-height: 120%;
228
+ color: ${colors.gray_500};
229
+ text-align: center;
230
+ }
231
+ }
232
+ `}
233
+ `;
234
+ const PropunereUniqaProtect = ({
235
+ title = "Fix ce ai cerut!",
236
+ contributiaLunara = "",
237
+ durata = "",
238
+ taxaDePolita = "",
239
+ numarPolite = "",
240
+ featured = false,
241
+ selected = false,
242
+ disabled = false,
243
+ refused = false,
244
+ hideButton = false,
245
+ empty = false,
246
+ emptyText = "Indisponibil",
247
+ iconButtonOnClick,
248
+ buttonOnClick,
249
+ contributiaLunaraHintOnClick,
250
+ taxaDePolitaHintOnClick,
251
+ children,
252
+ ...rest
253
+ }) => {
254
+ let _contentSlot = null;
255
+ Children.toArray(children).filter(Boolean).forEach((child) => {
256
+ const element = child;
257
+ if (element.type === ContentSlot) {
258
+ _contentSlot = child;
259
+ }
260
+ });
261
+ return /* @__PURE__ */ jsx(
262
+ PropunereUniqaProtectStyled,
263
+ {
264
+ $empty: empty,
265
+ $featured: featured,
266
+ $selected: selected,
267
+ $disabled: disabled,
268
+ $refused: refused,
269
+ $hideButton: hideButton,
270
+ ...rest,
271
+ children: !empty ? /* @__PURE__ */ jsxs(Fragment, { children: [
272
+ /* @__PURE__ */ jsxs("div", { children: [
273
+ /* @__PURE__ */ jsxs("div", { children: [
274
+ /* @__PURE__ */ jsx("span", { children: title }),
275
+ /* @__PURE__ */ jsx(
276
+ IconButton,
277
+ {
278
+ onClick: iconButtonOnClick,
279
+ icon: "new_tab",
280
+ intent: "accent",
281
+ variant: "tertiary",
282
+ shape: "rounded",
283
+ color: colors.info_800,
284
+ size: "medium"
285
+ }
286
+ )
287
+ ] }),
288
+ /* @__PURE__ */ jsxs("div", { children: [
289
+ /* @__PURE__ */ jsxs("div", { children: [
290
+ /* @__PURE__ */ jsxs("div", { children: [
291
+ /* @__PURE__ */ jsx("span", { children: "Contributia lunara" }),
292
+ /* @__PURE__ */ jsx(
293
+ Icon,
294
+ {
295
+ onClick: contributiaLunaraHintOnClick,
296
+ icon: "hint_filled",
297
+ size: 16,
298
+ color: refused ? colors.gray_200 : colors.info_700
299
+ }
300
+ )
301
+ ] }),
302
+ /* @__PURE__ */ jsx("span", { children: contributiaLunara || "-" })
303
+ ] }),
304
+ /* @__PURE__ */ jsxs("div", { children: [
305
+ /* @__PURE__ */ jsx("span", { children: "Durata" }),
306
+ /* @__PURE__ */ jsx("span", { children: durata || "-" })
307
+ ] })
308
+ ] }),
309
+ /* @__PURE__ */ jsxs("div", { children: [
310
+ /* @__PURE__ */ jsxs("div", { children: [
311
+ /* @__PURE__ */ jsx(
312
+ Icon,
313
+ {
314
+ icon: "invoice_seal",
315
+ size: 16,
316
+ color: refused ? colors.gray_200 : colors.gray_500
317
+ }
318
+ ),
319
+ /* @__PURE__ */ jsxs("div", { children: [
320
+ /* @__PURE__ */ jsxs("div", { children: [
321
+ /* @__PURE__ */ jsx("span", { children: "Taxa de polita" }),
322
+ /* @__PURE__ */ jsx(
323
+ Icon,
324
+ {
325
+ onClick: taxaDePolitaHintOnClick,
326
+ icon: "hint_filled",
327
+ size: 16,
328
+ color: refused ? colors.gray_200 : colors.info_700
329
+ }
330
+ )
331
+ ] }),
332
+ /* @__PURE__ */ jsx("span", { children: taxaDePolita || "-" })
333
+ ] })
334
+ ] }),
335
+ /* @__PURE__ */ jsxs("div", { children: [
336
+ /* @__PURE__ */ jsx(
337
+ Icon,
338
+ {
339
+ icon: "docs",
340
+ size: 16,
341
+ color: refused ? colors.gray_200 : colors.gray_500
342
+ }
343
+ ),
344
+ /* @__PURE__ */ jsxs("div", { children: [
345
+ /* @__PURE__ */ jsx("span", { children: "Numar polite" }),
346
+ /* @__PURE__ */ jsx("span", { children: numarPolite || "-" })
347
+ ] })
348
+ ] })
349
+ ] })
350
+ ] }),
351
+ /* @__PURE__ */ jsx("div", { children: _contentSlot }),
352
+ !hideButton && /* @__PURE__ */ jsxs(
353
+ "button",
354
+ {
355
+ disabled,
356
+ type: "button",
357
+ onClick: !disabled ? buttonOnClick : () => {
358
+ },
359
+ children: [
360
+ /* @__PURE__ */ jsx(
361
+ Icon,
362
+ {
363
+ icon: selected ? "checkmark_filled" : "checkmark-part",
364
+ size: 16,
365
+ color: selected ? disabled ? colors.gray_600 : colors.white : colors.purple_600,
366
+ style: {
367
+ opacity: disabled && !selected ? "0.25" : "1"
368
+ }
369
+ }
370
+ ),
371
+ /* @__PURE__ */ jsx("span", { children: selected ? "Varianta selectata" : "Vreau aceasta varianta!" })
372
+ ]
373
+ }
374
+ )
375
+ ] }) : /* @__PURE__ */ jsxs("div", { children: [
376
+ /* @__PURE__ */ jsx(Icon, { size: 20, icon: "rejected", color: colors.gray_500 }),
377
+ /* @__PURE__ */ jsx("span", { children: emptyText })
378
+ ] })
379
+ }
380
+ );
381
+ };
382
+ const ContentSlot = ({ children }) => children;
383
+ PropunereUniqaProtect.ContentSlot = ContentSlot;
384
+
385
+ export { PropunereUniqaProtect as default };
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ "use client";
3
+
4
+ import PropunereUniqaProtect from './PropunereUniqaProtect.js';
5
+
6
+
7
+
8
+ export { PropunereUniqaProtect as default };
@@ -94,3 +94,4 @@ export { default as PropunereAsigurareLocuinta } from './PropunereAsigurareLocui
94
94
  export { default as Textarea } from './Textarea/Textarea.js';
95
95
  export { default as FeedbackCard } from './FeedbackCard/FeedbackCard.js';
96
96
  export { default as ConfigurationStickyBar } from './ConfigurationStickyBar/ConfigurationStickyBar.js';
97
+ export { default as PropunereUniqaProtect } from './PropunereUniqaProtect/PropunereUniqaProtect.js';