@devtron-labs/devtron-fe-common-lib 1.17.0-pre-6 → 1.17.0-pre-7

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@devtron-labs/devtron-fe-common-lib",
3
- "version": "1.17.0-pre-6",
3
+ "version": "1.17.0-pre-7",
4
4
  "description": "Supporting common component library",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
@@ -1,609 +0,0 @@
1
- import { j as n, at as b, av as k, au as W } from "./@vendor-DbxoIktR.js";
2
- import V, { forwardRef as J, useMemo as P } from "react";
3
- import K, { getDefaultRegistry as q } from "@rjsf/core";
4
- import { T as F, j as N, c as v, b as S, S as Y, i as z, a as w, d as A, e as G } from "./@code-editor-CIT4e7hG.js";
5
- import Q, { components as D } from "react-select";
6
- import { ReactComponent as X } from "./assets/ic-chevron-down.fc70d7a7.svg";
7
- import { getUiOptions as $, getTemplate as B, getSubmitButtonOptions as Z, ADDITIONAL_PROPERTY_FLAG as L, errorId as ee, englishStringTranslator as te, TranslatableString as ne, titleId as re, canExpand as ae, deepEquals as se } from "@rjsf/utils";
8
- import { ReactComponent as oe } from "./assets/ic-add.cfaa779b.svg";
9
- import { ReactComponent as ie } from "./assets/ic-warning.ecf7ff97.svg";
10
- import { ReactComponent as le } from "./assets/ic-cross.01e03666.svg";
11
- import './assets/@common-rjsf.css';const C = {
12
- SELECT: "Please select an option",
13
- INPUT: "Please enter an input",
14
- OBJECT_KEY: "Please enter a value for the key"
15
- }, ce = "Key not available", Je = {
16
- "ui:submitButtonOptions": {
17
- norender: !0
18
- }
19
- }, de = ({
20
- children: e,
21
- disabled: t,
22
- hasToolbar: a,
23
- hasRemove: r,
24
- index: s,
25
- onDropIndexClick: l,
26
- readonly: i,
27
- registry: o,
28
- uiSchema: c
29
- }) => {
30
- const { RemoveButton: d } = o.templates.ButtonTemplates;
31
- return /* @__PURE__ */ n.jsxs("div", { className: "dc__position-rel display-grid rjsf-form-template__array-field-item flex-align-center", children: [
32
- e,
33
- /* @__PURE__ */ n.jsx("div", { className: "dc__position-abs remove-btn__container", style: { right: "-28px", top: "9px" }, children: a && r && /* @__PURE__ */ n.jsx(
34
- d,
35
- {
36
- disabled: t || i,
37
- onClick: l(s),
38
- uiSchema: c,
39
- registry: o
40
- }
41
- ) })
42
- ] });
43
- }, T = ({
44
- showLabel: e,
45
- label: t,
46
- required: a,
47
- children: r,
48
- id: s,
49
- rawDescription: l,
50
- shouldAlignCenter: i = !0
51
- }) => /* @__PURE__ */ n.jsxs(
52
- "div",
53
- {
54
- className: e ? `display-grid dc__gap-12 rjsf-form-template__field ${i ? "flex-align-center" : ""}` : "",
55
- children: [
56
- e && /* @__PURE__ */ n.jsxs("label", { className: "cn-7 fs-13 lh-20 fw-4 flexbox mb-0", htmlFor: s, children: [
57
- /* @__PURE__ */ n.jsx(F, { alwaysShowTippyOnHover: !!l, content: l, children: /* @__PURE__ */ n.jsx("span", { className: `dc__ellipsis-right ${l ? "text-underline-dashed-300" : ""}`, children: t || ce }) }),
58
- a && /* @__PURE__ */ n.jsx("span", { className: "cr-5", children: " *" })
59
- ] }),
60
- r
61
- ]
62
- }
63
- ), E = ({ label: e, canAdd: t, onAddClick: a, disabled: r, readonly: s, uiSchema: l, registry: i }) => {
64
- const {
65
- ButtonTemplates: { AddButton: o }
66
- } = i.templates;
67
- return t && /* @__PURE__ */ n.jsx(
68
- o,
69
- {
70
- label: e,
71
- onClick: a,
72
- disabled: r || s,
73
- uiSchema: l,
74
- registry: i
75
- }
76
- );
77
- }, ue = ({
78
- canAdd: e,
79
- className: t,
80
- disabled: a,
81
- idSchema: r,
82
- uiSchema: s,
83
- items: l,
84
- onAddClick: i,
85
- readonly: o,
86
- registry: c,
87
- required: d,
88
- title: j
89
- }) => {
90
- const p = $(s), h = B("ArrayFieldItemTemplate", c, p), f = p.title || j;
91
- return /* @__PURE__ */ n.jsx("fieldset", { className: t, id: r.$id, children: l.length ? /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
92
- l.map(({ key: _, ...x }, m) => {
93
- const u = {
94
- ...x.children,
95
- props: {
96
- ...x.children.props
97
- }
98
- };
99
- return /* @__PURE__ */ n.jsx(h, { ...x, children: u }, _);
100
- }),
101
- /* @__PURE__ */ n.jsx(
102
- E,
103
- {
104
- label: f,
105
- canAdd: e,
106
- onAddClick: i,
107
- disabled: a,
108
- readonly: o,
109
- uiSchema: s,
110
- registry: c
111
- }
112
- )
113
- ] }) : /* @__PURE__ */ n.jsx(T, { label: f, required: d, showLabel: !0, id: r.$id, children: /* @__PURE__ */ n.jsx(
114
- E,
115
- {
116
- label: f,
117
- canAdd: e,
118
- onAddClick: i,
119
- disabled: a,
120
- readonly: o,
121
- uiSchema: s,
122
- registry: c
123
- }
124
- ) }) });
125
- }, {
126
- templates: { BaseInputTemplate: me }
127
- } = q(), pe = ({ placeholder: e, ...t }) => /* @__PURE__ */ n.jsx(
128
- me,
129
- {
130
- placeholder: e || C.INPUT,
131
- ...t,
132
- className: "form__input cn-9 fs-13 lh-20 fw-4"
133
- }
134
- ), U = ({
135
- label: e,
136
- icon: t,
137
- iconType: a,
138
- registry: r,
139
- uiSchema: s,
140
- ...l
141
- }) => {
142
- const i = `Add ${e}`;
143
- return /* @__PURE__ */ n.jsx("div", { className: "flexbox flex-justify-start", children: /* @__PURE__ */ n.jsxs(
144
- "button",
145
- {
146
- ...l,
147
- type: "button",
148
- className: "dc__outline-none-imp p-0 dc__transparent flex dc__gap-4 cursor dc__mxw-250",
149
- title: "Add",
150
- children: [
151
- /* @__PURE__ */ n.jsx(oe, { className: "icon-dim-16 fcb-5" }),
152
- /* @__PURE__ */ n.jsx(F, { placement: "right", content: i, children: /* @__PURE__ */ n.jsx("span", { className: "cb-5 fs-13 lh-34 dc__truncate", children: i }) })
153
- ]
154
- }
155
- ) });
156
- }, fe = ({ icon: e, iconType: t, registry: a, uiSchema: r, ...s }) => /* @__PURE__ */ n.jsx("button", { ...s, type: "button", className: "dc__outline-none-imp p-0 dc__transparent flex cursor", title: "Remove", children: /* @__PURE__ */ n.jsx(le, { className: "icon-dim-16 fcn-6" }) }), he = ({ uiSchema: e }) => {
157
- const { submitText: t, norender: a, props: r = {} } = Z(e);
158
- return a ? null : /* @__PURE__ */ n.jsx("div", { className: "flexbox flex-justify-end", children: /* @__PURE__ */ n.jsx("button", { type: "submit", ...r, className: `cta ${r.className || ""}`, children: t }) });
159
- }, O = ({
160
- id: e,
161
- title: t,
162
- required: a,
163
- description: r
164
- }) => /* @__PURE__ */ n.jsxs("legend", { className: "fs-13 fw-6 cn-9 lh-20 dc__no-border pb-9 mb-0", id: e, children: [
165
- /* @__PURE__ */ n.jsx(F, { alwaysShowTippyOnHover: !!r, content: r, children: /* @__PURE__ */ n.jsx("span", { className: `${r ? "text-underline-dashed-300" : ""}`, children: t }) }),
166
- a && /* @__PURE__ */ n.jsx("span", { className: "cr-5", children: " *" })
167
- ] }), xe = (e) => {
168
- const {
169
- id: t,
170
- label: a,
171
- children: r,
172
- errors: s,
173
- hidden: l,
174
- required: i,
175
- displayLabel: o,
176
- registry: c,
177
- uiSchema: d,
178
- classNames: j,
179
- schema: p,
180
- rawDescription: h
181
- } = e, f = $(d), _ = B(
182
- "WrapIfAdditionalTemplate",
183
- c,
184
- f
185
- ), x = L in p, m = (o || p.type === "boolean") && !x, u = p.type === "array";
186
- return l ? /* @__PURE__ */ n.jsx("div", { className: "hidden", children: r }) : (
187
- // NOTE: need to override the margins of default rjsf css
188
- /* @__PURE__ */ n.jsxs("div", { className: `${j} mb-0`, children: [
189
- u && /* @__PURE__ */ n.jsx(
190
- O,
191
- {
192
- id: t,
193
- title: a,
194
- required: i,
195
- registry: c,
196
- uiSchema: d,
197
- schema: p,
198
- description: h
199
- }
200
- ),
201
- /* @__PURE__ */ n.jsx(
202
- T,
203
- {
204
- label: a,
205
- showLabel: m,
206
- id: t,
207
- required: i,
208
- rawDescription: h,
209
- children: /* @__PURE__ */ n.jsx(_, { ...e, children: r })
210
- }
211
- ),
212
- s
213
- ] })
214
- );
215
- }, je = ({ errors: e = [], idSchema: t }) => {
216
- const a = ee(t);
217
- return e.length > 0 && /* @__PURE__ */ n.jsx("span", { className: "display-grid rjsf-form-template__field--error dc__gap-12", id: a, children: e.filter((r) => !!r).map((r, s) => /* @__PURE__ */ n.jsxs(V.Fragment, { children: [
218
- /* @__PURE__ */ n.jsx("span", {}),
219
- /* @__PURE__ */ n.jsxs("span", { className: "form__error", children: [
220
- /* @__PURE__ */ n.jsx(ie, { className: "form__icon form__icon--error" }),
221
- r
222
- ] })
223
- ] }, s)) });
224
- }, _e = (e, t) => {
225
- switch (e) {
226
- case ne.NewStringDefault:
227
- return "";
228
- default:
229
- return te(e, t);
230
- }
231
- }, Ke = (e) => {
232
- try {
233
- const t = new URL(e).origin === window.location.origin;
234
- return {
235
- href: e,
236
- target: t ? "_self" : "_blank",
237
- rel: t ? void 0 : "external noreferrer",
238
- url: e
239
- };
240
- } catch {
241
- return {
242
- href: e,
243
- target: "_blank",
244
- url: `${e} (Invalid URL)`
245
- };
246
- }
247
- }, qe = (e) => {
248
- const t = typeof e;
249
- switch (t) {
250
- case "boolean":
251
- case "string":
252
- case "number":
253
- return t;
254
- case "object":
255
- return Array.isArray(e) ? "array" : e === null ? "null" : t;
256
- default:
257
- return "null";
258
- }
259
- }, y = (e) => {
260
- if (!e)
261
- return "";
262
- const t = e.trim(), r = (/^\/.+$/g.test(t) ? t : `/${t}`).replaceAll(/\./g, "/");
263
- return /(\/(([^/~])|(~[01]))*)/g.test(r) ? r : "";
264
- }, R = {
265
- value: !1,
266
- path: ""
267
- }, ge = (e) => {
268
- if (!e)
269
- return null;
270
- const t = structuredClone(e);
271
- return typeof t == "string" ? {
272
- value: !0,
273
- path: y(t)
274
- } : typeof t != "object" ? structuredClone(R) : Object.hasOwn(t, "condition") && "condition" in t && Object.hasOwn(t, "value") && "value" in t ? {
275
- value: t.condition,
276
- path: y(t.value)
277
- } : Object.hasOwn(t, "value") && "value" in t && Object.hasOwn(t, "path") && "path" in t ? {
278
- value: t.value,
279
- path: y(t.path)
280
- } : structuredClone(R);
281
- }, H = (e, t, a) => {
282
- e && (e.type === "object" && e.properties && typeof e.properties == "object" && Object.entries(e.properties).forEach(([r, s]) => {
283
- H(s, `${t}/${r}`, a);
284
- }), (e.type === "boolean" || e.type === "string" || e.type === "number" || e.type === "integer") && (a[t] = y(e.updatePath ?? t)));
285
- }, ye = (e) => {
286
- const t = {};
287
- return H(e, "", t), t;
288
- }, M = (e, t, a) => {
289
- if (t >= a.length)
290
- return e;
291
- const r = a[t];
292
- if (t === a.length - 1) {
293
- const s = structuredClone(e);
294
- return delete s[r], s;
295
- }
296
- if (e[r] && (e[r] = M(e[r], t + 1, a)), Object.keys(e[r] ?? {}).length === 0) {
297
- const s = structuredClone(e);
298
- return delete s[r], s;
299
- }
300
- return e;
301
- }, be = (e, t) => {
302
- if (!e || typeof e != "object" || Array.isArray(e))
303
- throw new Error("Invalid object");
304
- if (!t || !t.startsWith("/"))
305
- throw new Error("Invalid path");
306
- const a = t.split("/").slice(1);
307
- return M(e, 0, a);
308
- }, I = ({
309
- formState: e,
310
- formData: t,
311
- schemaPathToUpdatePathMap: a
312
- }) => {
313
- let r = structuredClone(e);
314
- return r && (Object.entries(a).forEach(([s, l]) => {
315
- if (s === l || !l)
316
- return;
317
- const i = b({
318
- json: t,
319
- path: v(s),
320
- resultType: "value",
321
- wrap: !1
322
- });
323
- i === void 0 ? r = be(r, s) : r = N([S(s, i), r]);
324
- const o = b({
325
- json: e,
326
- path: v(s),
327
- resultType: "value",
328
- wrap: !1
329
- });
330
- o !== void 0 && (r = N([S(l, o), r]));
331
- }), t && r ? k(t, W(t, r), !1, !1).newDocument : r);
332
- }, ve = ({ formData: e, schemaPathToUpdatePathMap: t }) => N([
333
- ...Object.entries(t).map(([a, r]) => {
334
- if (a === r || !r)
335
- return {};
336
- const s = b({
337
- json: e,
338
- path: v(r),
339
- resultType: "value",
340
- wrap: !1
341
- });
342
- return s === void 0 ? {} : S(a, s);
343
- }),
344
- structuredClone(e)
345
- ]), Te = ({
346
- disabled: e,
347
- formData: t,
348
- idSchema: a,
349
- onAddClick: r,
350
- properties: s,
351
- readonly: l,
352
- registry: i,
353
- required: o,
354
- schema: c,
355
- title: d,
356
- uiSchema: j,
357
- formContext: p
358
- }) => {
359
- const h = !!c.additionalProperties, f = ae(c, j, t) && /* @__PURE__ */ n.jsx(
360
- U,
361
- {
362
- label: d,
363
- className: "object-property-expand",
364
- onClick: r(c),
365
- disabled: e || l,
366
- uiSchema: j,
367
- registry: i
368
- }
369
- ), _ = s.filter((x) => {
370
- const m = c.properties?.[x.name]?.hidden;
371
- if (!m)
372
- return !0;
373
- try {
374
- const u = ge(m);
375
- if (!u.path)
376
- throw new Error("Empty path property of hidden descriptor field");
377
- const g = b({
378
- path: v(u.path),
379
- json: p,
380
- resultType: "value",
381
- wrap: !1
382
- });
383
- return !(g === void 0 || se(u.value, g));
384
- } catch {
385
- return !0;
386
- }
387
- }).map((x) => x.content);
388
- return h ? s.length ? /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
389
- /* @__PURE__ */ n.jsx(
390
- T,
391
- {
392
- label: d,
393
- required: o,
394
- showLabel: !0,
395
- id: a.$id,
396
- shouldAlignCenter: !1,
397
- children: /* @__PURE__ */ n.jsx("div", { children: _ })
398
- }
399
- ),
400
- f
401
- ] }) : /* @__PURE__ */ n.jsx(T, { label: d, required: o, showLabel: !0, id: a.$id, children: f }) : /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
402
- _,
403
- f
404
- ] });
405
- }, we = (e) => {
406
- const { idSchema: t, registry: a, required: r, schema: s, title: l, uiSchema: i, description: o } = e, c = !!s.additionalProperties, d = l && !c;
407
- return /* @__PURE__ */ n.jsxs("fieldset", { id: t.$id, children: [
408
- d && /* @__PURE__ */ n.jsx(
409
- O,
410
- {
411
- id: re(t),
412
- title: l,
413
- required: r,
414
- schema: s,
415
- uiSchema: i,
416
- registry: a,
417
- description: o
418
- }
419
- ),
420
- /* @__PURE__ */ n.jsx(
421
- "div",
422
- {
423
- className: `${s.properties && !c && t.$id !== "root" ? "dc__border-left pl-12" : ""} ${t.$id === "root" ? "dc__separated-flexbox dc__separated-flexbox--vertical" : "flexbox-col dc__gap-8"}`,
424
- children: /* @__PURE__ */ n.jsx(Te, { ...e })
425
- }
426
- )
427
- ] });
428
- }, Ne = ({
429
- id: e,
430
- disabled: t,
431
- label: a,
432
- onKeyChange: r,
433
- onDropPropertyClick: s,
434
- readonly: l,
435
- schema: i,
436
- children: o,
437
- uiSchema: c,
438
- registry: d
439
- }) => {
440
- const { templates: j } = d, { RemoveButton: p } = j.ButtonTemplates, h = L in i;
441
- return /* @__PURE__ */ n.jsx(n.Fragment, { children: h ? /* @__PURE__ */ n.jsxs("div", { className: "dc__position-rel rjsf-form-template__additional-fields display-grid dc__gap-8 flex-align-center", children: [
442
- /* @__PURE__ */ n.jsx("div", { children: /* @__PURE__ */ n.jsx(
443
- "input",
444
- {
445
- type: "text",
446
- className: "form__input cn-9 fs-13 lh-20 fw-4",
447
- id: `${e}-key`,
448
- onBlur: (f) => r(f.target.value),
449
- placeholder: C.OBJECT_KEY,
450
- defaultValue: a
451
- }
452
- ) }),
453
- /* @__PURE__ */ n.jsx("div", { children: o }),
454
- /* @__PURE__ */ n.jsx("div", { className: "dc__position-abs remove-btn__container", style: { right: "-28px", top: "9px" }, children: /* @__PURE__ */ n.jsx(
455
- p,
456
- {
457
- disabled: t || l,
458
- onClick: s(a),
459
- uiSchema: c,
460
- registry: d
461
- }
462
- ) })
463
- ] }) : o });
464
- }, Se = ({
465
- id: e,
466
- onChange: t,
467
- value: a,
468
- disabled: r,
469
- readonly: s,
470
- autofocus: l
471
- }) => {
472
- const i = z(a) ? !1 : a, o = () => {
473
- t(!i);
474
- };
475
- return /* @__PURE__ */ n.jsxs("div", { className: "flexbox dc__align-items-center dc__gap-8", children: [
476
- /* @__PURE__ */ n.jsx(
477
- Y,
478
- {
479
- name: e,
480
- ariaLabel: e,
481
- onChange: o,
482
- isChecked: i,
483
- autoFocus: l,
484
- isDisabled: r || s
485
- }
486
- ),
487
- /* @__PURE__ */ n.jsx("span", { className: "dc__capitalize", children: i.toString() })
488
- ] });
489
- }, Fe = ({ children: e, ...t }) => /* @__PURE__ */ n.jsx(D.MenuList, { ...t, children: Array.isArray(e) ? e.slice(0, 20) : e }), Ce = (e) => /* @__PURE__ */ n.jsx(D.DropdownIndicator, { ...e, children: /* @__PURE__ */ n.jsx(X, { className: "icon-dim-20 icon-n5", "data-testid": "overview-project-edit-dropdown" }) }), Oe = (e) => {
490
- const {
491
- id: t,
492
- multiple: a = !1,
493
- options: r,
494
- value: s,
495
- disabled: l,
496
- readonly: i,
497
- autofocus: o = !1,
498
- onChange: c,
499
- onBlur: d,
500
- onFocus: j,
501
- placeholder: p
502
- } = e, { enumOptions: h = [] } = r, f = a ? [] : "", _ = (m) => {
503
- c(a ? m.map((u) => u.value) : m.value);
504
- }, x = (m) => a ? h.filter((u) => m.some((g) => A(g, u.value))) : h.find((u) => A(m, u.value));
505
- return /* @__PURE__ */ n.jsx(
506
- Q,
507
- {
508
- id: t,
509
- name: t,
510
- isMulti: a,
511
- value: typeof s > "u" ? f : x(s),
512
- autoFocus: o,
513
- onChange: _,
514
- options: h,
515
- onBlur: () => d(t, s),
516
- onFocus: () => j(t, s),
517
- placeholder: p || C.SELECT,
518
- isDisabled: l || i,
519
- styles: {
520
- ...w,
521
- control: (m, u) => ({
522
- ...w.control(m, u),
523
- minHeight: "36px"
524
- }),
525
- multiValue: (m, u) => ({
526
- ...w.multiValue(m, u),
527
- margin: "2px 8px 2px 2px"
528
- })
529
- },
530
- components: {
531
- IndicatorSeparator: null,
532
- DropdownIndicator: Ce,
533
- MenuList: Fe
534
- },
535
- menuPlacement: "auto"
536
- }
537
- );
538
- }, Pe = {
539
- CheckboxWidget: Se,
540
- SelectWidget: Oe
541
- }, Ae = {
542
- ArrayFieldItemTemplate: de,
543
- ArrayFieldTemplate: ue,
544
- BaseInputTemplate: pe,
545
- ButtonTemplates: { AddButton: U, RemoveButton: fe, SubmitButton: he },
546
- FieldTemplate: xe,
547
- FieldErrorTemplate: je,
548
- ObjectFieldTemplate: we,
549
- TitleFieldTemplate: O,
550
- WrapIfAdditionalTemplate: Ne
551
- }, Ee = K, Re = G, Ye = J((e, t) => {
552
- const { schemaPathToUpdatePathMap: a, isUpdatePathKeywordPresent: r } = P(() => {
553
- const o = ye(e.schema);
554
- return {
555
- schemaPathToUpdatePathMap: o,
556
- isUpdatePathKeywordPresent: Object.entries(o).some(([c, d]) => c !== d)
557
- };
558
- }, [e.schema]), s = P(() => r ? ve({ formData: e.formData ?? {}, schemaPathToUpdatePathMap: a }) : e.formData, [e.formData, a, r]), l = (o) => {
559
- if (!e.onChange)
560
- return;
561
- const c = I({
562
- formState: o.formData,
563
- formData: e.formData,
564
- schemaPathToUpdatePathMap: a
565
- });
566
- e.onChange({ ...o, formData: c });
567
- }, i = (o, c) => {
568
- if (!e.onSubmit)
569
- return;
570
- const d = I({
571
- formState: o.formData,
572
- formData: e.formData,
573
- schemaPathToUpdatePathMap: a
574
- });
575
- e.onSubmit?.({ ...o, formData: d }, c);
576
- };
577
- return /* @__PURE__ */ n.jsx(
578
- Ee,
579
- {
580
- noHtml5Validate: !0,
581
- showErrorList: !1,
582
- autoComplete: "off",
583
- ...e,
584
- formData: s,
585
- ...r ? {
586
- onChange: l,
587
- onSubmit: i
588
- } : {},
589
- className: `rjsf-form-template__container ${e.className || ""}`,
590
- validator: Re,
591
- templates: {
592
- ...Ae,
593
- ...e.templates
594
- },
595
- formContext: s,
596
- widgets: { ...Pe, ...e.widgets },
597
- translateString: _e,
598
- ref: t
599
- }
600
- );
601
- });
602
- export {
603
- Je as H,
604
- Ye as R,
605
- Ke as a,
606
- ye as b,
607
- y as c,
608
- qe as g
609
- };