mayak-common-library 0.0.51 → 0.0.52
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/dist/index.js +80 -86
- package/dist/index.mjs +80 -86
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -309,6 +309,7 @@ var SelectPro = ({
|
|
|
309
309
|
const [btn, setAnchorEl] = (0, import_react2.useState)(null);
|
|
310
310
|
const [open, setOpen] = (0, import_react2.useState)(false);
|
|
311
311
|
const handleClick = (event) => {
|
|
312
|
+
if (isOpen) return;
|
|
312
313
|
event.persist();
|
|
313
314
|
if (open)
|
|
314
315
|
setTimeout(() => {
|
|
@@ -326,92 +327,85 @@ var SelectPro = ({
|
|
|
326
327
|
const childrenWithHandleChange = (0, import_react2.isValidElement)(children) ? (0, import_react2.cloneElement)(children, {
|
|
327
328
|
collapseParent: handleClose
|
|
328
329
|
}) : children;
|
|
329
|
-
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
] })
|
|
409
|
-
]
|
|
410
|
-
}
|
|
411
|
-
) : null
|
|
412
|
-
] })
|
|
413
|
-
}
|
|
414
|
-
);
|
|
330
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_material4.ClickAwayListener, { onClickAway: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_material4.Box, { width: fullWidth ? "100%" : "inherit", children: [
|
|
331
|
+
clickComponent ? (0, import_react2.cloneElement)(clickComponent, {
|
|
332
|
+
ref: btn,
|
|
333
|
+
onClick: handleClick,
|
|
334
|
+
onClose: handleClose,
|
|
335
|
+
collapse: open
|
|
336
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
337
|
+
import_material4.Button,
|
|
338
|
+
{
|
|
339
|
+
ref: btn,
|
|
340
|
+
"aria-controls": open ? "basic-menu" : void 0,
|
|
341
|
+
"aria-haspopup": "true",
|
|
342
|
+
"aria-expanded": open ? "true" : void 0,
|
|
343
|
+
onClick: handleClick,
|
|
344
|
+
disableRipple: true,
|
|
345
|
+
fullWidth: true,
|
|
346
|
+
sx: {
|
|
347
|
+
height: small ? "34px" : "38px",
|
|
348
|
+
padding: small ? "0 10px 0 6px" : "0 20px 0 19px"
|
|
349
|
+
},
|
|
350
|
+
className: `border rounded-none border-solid normal-case text-accent-dark hover:bg-white ${open ? "!border-transparent bg-white" : ""} ${colorBorder ? "border-accent-beige flex-row-reverse justify-end gap-x-2" : "justify-between border-accent-dark"}`,
|
|
351
|
+
children: [
|
|
352
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
353
|
+
import_material4.Typography,
|
|
354
|
+
{
|
|
355
|
+
width: "200px",
|
|
356
|
+
className: "text-sm leading-4 truncate text-left",
|
|
357
|
+
children: placeholder
|
|
358
|
+
}
|
|
359
|
+
),
|
|
360
|
+
colorBorder ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(search_default, {}) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
361
|
+
dropdown_arrow_default,
|
|
362
|
+
{
|
|
363
|
+
style: {
|
|
364
|
+
transform: open ? "scaleY(-1)" : "scaleY(1)",
|
|
365
|
+
transition: "0.3s ease-in-out"
|
|
366
|
+
}
|
|
367
|
+
}
|
|
368
|
+
)
|
|
369
|
+
]
|
|
370
|
+
}
|
|
371
|
+
),
|
|
372
|
+
btn ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
373
|
+
import_material4.Paper,
|
|
374
|
+
{
|
|
375
|
+
sx: {
|
|
376
|
+
position: "absolute",
|
|
377
|
+
width: freeChildWidth ? "fit-content" : !fullContainerWidth && btn ? btn.offsetWidth : "100%",
|
|
378
|
+
left: fullContainerWidth ? 0 : "initial",
|
|
379
|
+
right: fullContainerWidth ? 0 : "initial",
|
|
380
|
+
top: overButton ? 0 : "initial"
|
|
381
|
+
},
|
|
382
|
+
className: `select ${open ? "select--open" : "select--close"} z-50 rounded-none shadow-none ${intermediateChild ? "mt-[1px]" : "m-0"}`,
|
|
383
|
+
children: [
|
|
384
|
+
intermediateChild ? intermediateChild : null,
|
|
385
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_material4.Box, { className: `flex flex-col py-3 px-4 gap-2 shadow-sm`, children: [
|
|
386
|
+
overButton ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
387
|
+
IconButton_default,
|
|
388
|
+
{
|
|
389
|
+
className: "bg-accent-silver p-1 self-end absolute",
|
|
390
|
+
onClick: isOpen ? () => {
|
|
391
|
+
return;
|
|
392
|
+
} : handleClose,
|
|
393
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(close_default, {})
|
|
394
|
+
}
|
|
395
|
+
) : null,
|
|
396
|
+
childTitle ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
397
|
+
import_material4.Typography,
|
|
398
|
+
{
|
|
399
|
+
className: "text-sm font-normal text-accent-silver-2",
|
|
400
|
+
children: childTitle
|
|
401
|
+
}
|
|
402
|
+
) : null,
|
|
403
|
+
childrenWithHandleChange
|
|
404
|
+
] })
|
|
405
|
+
]
|
|
406
|
+
}
|
|
407
|
+
) : null
|
|
408
|
+
] }) });
|
|
415
409
|
};
|
|
416
410
|
var SelectPro_default = SelectPro;
|
|
417
411
|
|
package/dist/index.mjs
CHANGED
|
@@ -249,6 +249,7 @@ var SelectPro = ({
|
|
|
249
249
|
const [btn, setAnchorEl] = useState2(null);
|
|
250
250
|
const [open, setOpen] = useState2(false);
|
|
251
251
|
const handleClick = (event) => {
|
|
252
|
+
if (isOpen) return;
|
|
252
253
|
event.persist();
|
|
253
254
|
if (open)
|
|
254
255
|
setTimeout(() => {
|
|
@@ -266,92 +267,85 @@ var SelectPro = ({
|
|
|
266
267
|
const childrenWithHandleChange = isValidElement(children) ? cloneElement(children, {
|
|
267
268
|
collapseParent: handleClose
|
|
268
269
|
}) : children;
|
|
269
|
-
return /* @__PURE__ */ jsx7(
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
] })
|
|
349
|
-
]
|
|
350
|
-
}
|
|
351
|
-
) : null
|
|
352
|
-
] })
|
|
353
|
-
}
|
|
354
|
-
);
|
|
270
|
+
return /* @__PURE__ */ jsx7(ClickAwayListener, { onClickAway: handleClose, children: /* @__PURE__ */ jsxs3(Box, { width: fullWidth ? "100%" : "inherit", children: [
|
|
271
|
+
clickComponent ? cloneElement(clickComponent, {
|
|
272
|
+
ref: btn,
|
|
273
|
+
onClick: handleClick,
|
|
274
|
+
onClose: handleClose,
|
|
275
|
+
collapse: open
|
|
276
|
+
}) : /* @__PURE__ */ jsxs3(
|
|
277
|
+
Button2,
|
|
278
|
+
{
|
|
279
|
+
ref: btn,
|
|
280
|
+
"aria-controls": open ? "basic-menu" : void 0,
|
|
281
|
+
"aria-haspopup": "true",
|
|
282
|
+
"aria-expanded": open ? "true" : void 0,
|
|
283
|
+
onClick: handleClick,
|
|
284
|
+
disableRipple: true,
|
|
285
|
+
fullWidth: true,
|
|
286
|
+
sx: {
|
|
287
|
+
height: small ? "34px" : "38px",
|
|
288
|
+
padding: small ? "0 10px 0 6px" : "0 20px 0 19px"
|
|
289
|
+
},
|
|
290
|
+
className: `border rounded-none border-solid normal-case text-accent-dark hover:bg-white ${open ? "!border-transparent bg-white" : ""} ${colorBorder ? "border-accent-beige flex-row-reverse justify-end gap-x-2" : "justify-between border-accent-dark"}`,
|
|
291
|
+
children: [
|
|
292
|
+
/* @__PURE__ */ jsx7(
|
|
293
|
+
Typography2,
|
|
294
|
+
{
|
|
295
|
+
width: "200px",
|
|
296
|
+
className: "text-sm leading-4 truncate text-left",
|
|
297
|
+
children: placeholder
|
|
298
|
+
}
|
|
299
|
+
),
|
|
300
|
+
colorBorder ? /* @__PURE__ */ jsx7(search_default, {}) : /* @__PURE__ */ jsx7(
|
|
301
|
+
dropdown_arrow_default,
|
|
302
|
+
{
|
|
303
|
+
style: {
|
|
304
|
+
transform: open ? "scaleY(-1)" : "scaleY(1)",
|
|
305
|
+
transition: "0.3s ease-in-out"
|
|
306
|
+
}
|
|
307
|
+
}
|
|
308
|
+
)
|
|
309
|
+
]
|
|
310
|
+
}
|
|
311
|
+
),
|
|
312
|
+
btn ? /* @__PURE__ */ jsxs3(
|
|
313
|
+
Paper,
|
|
314
|
+
{
|
|
315
|
+
sx: {
|
|
316
|
+
position: "absolute",
|
|
317
|
+
width: freeChildWidth ? "fit-content" : !fullContainerWidth && btn ? btn.offsetWidth : "100%",
|
|
318
|
+
left: fullContainerWidth ? 0 : "initial",
|
|
319
|
+
right: fullContainerWidth ? 0 : "initial",
|
|
320
|
+
top: overButton ? 0 : "initial"
|
|
321
|
+
},
|
|
322
|
+
className: `select ${open ? "select--open" : "select--close"} z-50 rounded-none shadow-none ${intermediateChild ? "mt-[1px]" : "m-0"}`,
|
|
323
|
+
children: [
|
|
324
|
+
intermediateChild ? intermediateChild : null,
|
|
325
|
+
/* @__PURE__ */ jsxs3(Box, { className: `flex flex-col py-3 px-4 gap-2 shadow-sm`, children: [
|
|
326
|
+
overButton ? /* @__PURE__ */ jsx7(
|
|
327
|
+
IconButton_default,
|
|
328
|
+
{
|
|
329
|
+
className: "bg-accent-silver p-1 self-end absolute",
|
|
330
|
+
onClick: isOpen ? () => {
|
|
331
|
+
return;
|
|
332
|
+
} : handleClose,
|
|
333
|
+
children: /* @__PURE__ */ jsx7(close_default, {})
|
|
334
|
+
}
|
|
335
|
+
) : null,
|
|
336
|
+
childTitle ? /* @__PURE__ */ jsx7(
|
|
337
|
+
Typography2,
|
|
338
|
+
{
|
|
339
|
+
className: "text-sm font-normal text-accent-silver-2",
|
|
340
|
+
children: childTitle
|
|
341
|
+
}
|
|
342
|
+
) : null,
|
|
343
|
+
childrenWithHandleChange
|
|
344
|
+
] })
|
|
345
|
+
]
|
|
346
|
+
}
|
|
347
|
+
) : null
|
|
348
|
+
] }) });
|
|
355
349
|
};
|
|
356
350
|
var SelectPro_default = SelectPro;
|
|
357
351
|
|